Mac App: Opening the side navigation and scrolling activates scrolling for main page as well

[marcellamaki]

Observed by @LianaHarris360 during the 0.16 sync sessino on Feb 14 2024

Observed behavior

When running Kolibri on the mac app, if you open the side navigation, the main page behind the overlay also scrolls

Expected behavior

Only the side navigation should scroll

Steps to reproduce

1. Run the Kolibri Mac app on the browser
2. Open the main side navigation
3. Scroll, and observe the main page content also scrolling

Context

Mac app - 0.16.x

[poju3185]

Hi @marcellamaki, I would like to work on this issue. First, I'd like to confirm if this is the bug you mentioned:
User shouldn't be able to scroll the main page while the side navigation is open.

2024-03-12.1.43.51.mov

By the way, this also happens in devserver.

[LianaHarris360]

Hello @poju3185 the issue occurs when scrolling on the side navigation, the main page will scroll at the same time.

sidenavscroll.mp4

[poju3185]

@LianaHarris360 thanks for your reply. Could you please tell me how you run the app server?
I used yarn run app-devserver and open the url showed in the teminal.
However, I was stuck at the Using mobile data? window.
It doesn't react when I click either of the option. In terminal, the error message is django.core.exceptions.ValidationError: {'extra_settings': ["{'allow_download_on_metered_connection': False} does not have property 'enable_automatic_download'"]}
Should I open another issues for this?

[poju3185]

I fix the scrolling issue. Please kindly review, thanks!

[LianaHarris360]

@poju3185 To run the app server, I followed all of the same instructions here. But I am unable to recreate the error you described, I can select either option when running the Kolibri Mac app in the browser, with a Mac operating system as well.

The Kolibri dev documentation also mentions the file integration_testing/scripts/run_kolibri_app_mode.py, where you can edit line 52 to return False within the function check_is_metered().

I see your opened pull request to fix this issue, thank you for taking the time to work on this, I will assign this issue to you. Moving forward, could you please wait to be assigned to an issue before opening a pull request? This helps maintain transparency within the team's workflow and provides the team time to make any necessary decisions! :)

[poju3185]

@LianaHarris360 thanks for the reply. Sorry I'll make sure to open a PR after being assigned. Should I create another PR and cloase the old one?
Regarding the Use mobile data issue, I actually found a bug in the frontend file, which I solved with this PR. Please also check it out if possible. Thank you.

[LianaHarris360]

No worries! You can keep the current PR for this issue open and I will assign myself and possibly another to review. Apologies if it does not get reviewed straight away.

In regards to the second issue you identified, we will work with our QA team to try and replicate the issue before addressing it with a PR. From here, it would be ideal if you could close the PR you opened for it and add notes about the bug you found to the issue description. Once the issue can be recreated and confirmed, we will assign the issue. Thank you.

[poju3185]

Thank you for the update! I've closed the PR for the second issue.

[LianaHarris360]

Fixed in #11992