Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-75762

Retain course page position when pressing back button from activity/resource

XMLWordPrintable

    • MOODLE_400_STABLE, MOODLE_401_STABLE, MOODLE_402_STABLE, MOODLE_403_STABLE
    • MOODLE_403_STABLE
    • MDL-75762-master
    • Hide

      Note: Please perform the test on multiple browsers.

      Course test

      1. Create a course C1  with a lots of activities. Best is to use the the Development/Make test cours/ Size = S
      2. Add several blocks in the C1 page (maybe html blocks with a large size) so to have a scroll bar in the block area
      3.  
      4. On C1, scroll down to an activity and click on the activity A1 link
      5. Press the back Browser button
      6. Ensure that the page is scrolled down to the activity A1 (as it was before we clicked on the link).
      7. Ensure that the same activity is selected in the course menu.
      8. Click on the side bar arrow to make the blocks appear.
      1. Without clicking anywhere, use the middle mouse button to scroll within the side bar
      2. Ensures that the right sidebar does not scroll with the screen (one of the issue was that this action was causing all the screen to scroll but not the sidebar, resulting in a broken layout, see comments on MDL-77314)

      Forum test

      1. In C1, create a forum F1 in with enough threads to have a page scroll in the forum view page
      2. Go to the forum
      3. Scroll down to a forum thread FT1, down in the page
      4. Click on the forum thread FT1
      5. Press the back Browser button
      6. Ensure that the page is scrolled down as it was before we clicked on the FT1, down in the page, to the FT1 thread

      Sticky footer test

      • In C1, create a new database activity
      • Select "Use preset" and select "Journal"
      • Add about 10 entries (just add a letter a, b, c... in the title, you can keep the content empty)
      • Go to the list of the entries (they should be enough to have a vertical scroll).
      • In your web browser go in developer mode and switch to mobile view (horizontal width < 768px)
      • Reload the page (so all is in place for mobile view)
      • Ensure that when you scroll down the sticky footer disappear
      • Ensure that when you scroll up the sticky footer appears

      Gradebook test

      • In C1, go to the gradebook (we assume here that we have about 10 assignment created by the Make test course plugin as well as many users).
      • Scroll up so the header row is close to the top of the page
      • Ensure that when you still scroll up, the header stays sticky and below the top drawer

      Accessibility (Regression test):

      1. Login as admin
      2. Go to Dashboard
      3. Enable 'Edit mode'
      4. Add several blocks to the blocks drawer, e.g.:
        1. Recently accessed courses
        2. Upcoming events
        3. Course overview
      5. Close the drawer and open it again, making sure that the mouse focus does not leave the drawer.
      6. Using the keyboard start tabbing through the content in the blocks drawer
        1. confirm that right before you tab through the content of a given block (e.g. Recently accessed courses) a skip link ("Skip Recently accessed courses") is displayed in the upper left-hand corner of the screen.
      7. Press Enter while the focus is still on the skip link.
        1. confirm that the focus is now shifted to the next block (e.g. Upcoming events)

       

      Show
      Note : Please perform the test on multiple browsers. Course test Create a course C1  with a lots of activities. Best is to use the the Development/Make test cours/ Size = S Add several blocks in the C1 page (maybe html blocks with a large size) so to have a scroll bar in the block area   On C1, scroll down to an activity and click on the activity A1 link Press the back Browser button Ensure that the page is scrolled down to the activity A1 (as it was before we clicked on the link). Ensure that the same activity is selected in the course menu. Click on the side bar arrow to make the blocks appear. Without clicking anywhere, use the middle mouse button to scroll within the side bar Ensures that the right sidebar does not scroll with the screen (one of the issue was that this action was causing all the screen to scroll but not the sidebar, resulting in a broken layout, see comments on MDL-77314 ) Forum test In C1, create a forum F1 in with enough threads to have a page scroll in the forum view page Go to the forum Scroll down to a forum thread FT1, down in the page Click on the forum thread FT1 Press the back Browser button Ensure that the page is scrolled down as it was before we clicked on the FT1, down in the page, to the FT1 thread Sticky footer test In C1, create a new database activity Select "Use preset" and select "Journal" Add about 10 entries (just add a letter a, b, c... in the title, you can keep the content empty) Go to the list of the entries (they should be enough to have a vertical scroll). In your web browser go in developer mode and switch to mobile view (horizontal width < 768px) Reload the page (so all is in place for mobile view) Ensure that when you scroll down the sticky footer disappear Ensure that when you scroll up the sticky footer appears Gradebook test In C1, go to the gradebook (we assume here that we have about 10 assignment created by the Make test course plugin as well as many users). Scroll up so the header row is close to the top of the page Ensure that when you still scroll up, the header stays sticky and below the top drawer Accessibility (Regression test): Login as admin Go to Dashboard Enable 'Edit mode' Add several blocks to the blocks drawer, e.g.: Recently accessed courses Upcoming events Course overview Close the drawer and open it again, making sure that the mouse focus does not leave the drawer. Using the keyboard start tabbing through the content in the blocks drawer confirm  that right before you tab through the content of a given block (e.g. Recently accessed courses) a skip link ("Skip Recently accessed courses") is displayed in the upper left-hand corner of the screen. Press Enter while the focus is still on the skip link. confirm  that the focus is now shifted to the next block (e.g. Upcoming events)  
    • 3
    • HQ 2023 Planning I3 Moppies

      It's a change that has been noticed by our teachers in Moodle and annoys them when building their courses.

      To reproduce:

      • Create a course
      • Add an activity or a resource to a section that need scroll to arrive to them
      • Visit the activity or the resource just added
      • Click the browser's back button

      Alternate reproduction

      • Visit a forum post
      • Click the "Permalink" link for one of the posts down the page and copy the URL
      • Paste it into a private browsing tab
        • Confirm that you're scrolled to the correct post
      • Press the browser button
        • Expected: you're scrolled to the correct post
        • Actual: You're at the top of the page

      Observed behaviour

      *the page scrolls to top*

      Expectation (and the case prior to Moodle 4.0)

      *the page stays at the same scroll position*

       
      This is happening because we now scroll the <div id="page"> instead of the <html> node like we did in 3.11 and earlier.

        1. 75762-helppopover.png
          212 kB
          Jun Pataleta
        2. Accessibility.png
          259 kB
          Ron Carl Alfon Yu
        3. drawer_under_primary_navbar.png
          298 kB
          Jun Pataleta
        4. facebook_double_scroll.png
          282 kB
          Ferran Recio
        5. gradebook.png
          272 kB
          Ron Carl Alfon Yu
        6. image-2023-02-08-10-40-26-501.png
          46 kB
          Laurent David
        7. image-2023-02-08-10-41-48-865.png
          43 kB
          Laurent David
        8. image-2023-05-22-09-58-00-608.png
          6 kB
          Laurent David
        9. image-2023-05-24-14-38-00-873.png
          95 kB
          Laurent David
        10. image-2023-05-29-09-31-15-127.png
          28 kB
          Laurent David
        11. image-2023-07-17-19-41-56-686.png
          29 kB
          Laurent David
        12. image-2023-07-20-10-20-34-977.png
          21 kB
          Laurent David
        13. image-2023-07-20-10-43-05-191.png
          41 kB
          Laurent David
        14. image-2023-07-20-10-43-11-222.png
          41 kB
          Laurent David
        15. image-2023-07-20-10-43-50-455.png
          17 kB
          Laurent David
        16. image-2023-07-28-10-28-33-870.png
          154 kB
          Laurent David
        17. MDL-75762-accessibility.png
          553 kB
          Ron Carl Alfon Yu
        18. MDL-75762-course test.png
          1.75 MB
          Ron Carl Alfon Yu
        19. MDL-75762-forum test.png
          2.92 MB
          Ron Carl Alfon Yu
        20. MDL-75762-gradebook test.png
          757 kB
          Ron Carl Alfon Yu
        21. MDL-75762-sticky footer test.png
          830 kB
          Ron Carl Alfon Yu
        22. screencast-MDL-75762-2023.02.13-12_26_37.webm
          27.39 MB
          Laurent David
        23. screenshot-1.png
          114 kB
          Laurent David
        24. tab behaviour.mp4
          2.81 MB
          Ron Carl Alfon Yu
        25. testing behaviour.mp4
          13.55 MB
          Ron Carl Alfon Yu

            Votes:
            71 Vote for this issue
            Watchers:
            57 Start watching this issue

              Created:
              Updated:
              Resolved:

                Estimated:
                Original Estimate - 0 minutes
                0m
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 2 weeks, 1 hour, 36 minutes
                2w 1h 36m

                  Error rendering 'clockify-timesheets-time-tracking-reports:timer-sidebar'. Please contact your Jira administrators.