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

Boost theme: Primary menu focus indicator lags behind mouse clicks for parent items

XMLWordPrintable

    • MOODLE_400_STABLE
    • MOODLE_311_STABLE
    • MDL-74117-master
    • Hide

      Test 1

      1. Log in as admin
      2. Go to Site administration > Appearance > Themes > Theme Settings
      3. Set "Custom menu items" to the following and save changes.

        Theme
        -Boost|/?theme=boost
        -Classic|/?theme=classic
        Courses
        -All courses|/course/
        -Course search|/course/search.php
        

      4. Make sure to stay on the current page, as you'll need to click on the "Theme list" edit box (it's the first setting on the page) later on step 12
      5. Click on "Courses" in the menu bar
      6. Verify that "Courses" is active with a focus outline
      7. Click on "Theme" in the menu bar
      8. Verify that "Theme" is active with a focus outline
      9. Click on a blank area on the page
      10. Verify that no element is focused
      11. Click on "Theme" in the menu bar
      12. Click inside the "Theme list" edit box
      13. Verify that the "Theme list" edit box is focused
      14. Go to your Dashboard
      15. Turn editing mode on.
      16. Click on "Courses" in the menu bar
      17. Verify that "Courses" is active with a focus outline
      18. Click on the cog icon of the timeline block (add the block to the main area on the page if it's not there)
      19. Verify that the cog icon is active with a focus outline
      20. Click on a blank area on the page
      21. Verify that no element is focused
      22. Click on the cog icon of the timeline block
      23. Click inside the "Search by activity or name" edit box in the timeline block

      Test 2 (master only)

      1. Log in as admin
      2. Click on "Site administration" on the primary nav
      3. Narrow the page so some of the secondary tabs move inside a "more" menu
      4. Refresh the page
      5. Press Tab several times until you reach the secondary menu tabs
      6. Press "End" to go to the "More" tab
      7. Press Space
      8. Using the Down Arrow key on the keyboard, go to "Development" and press Space
      9. Verify that you see the content of the "Development" tab
      10. Verify that the "More" tab is active (there should be a thick line underneath)
      11. Verify that the "More" tab is focused

       

      Show
      Test 1 Log in as admin Go to Site administration > Appearance > Themes > Theme Settings Set "Custom menu items" to the following and save changes. Theme -Boost|/?theme=boost -Classic|/?theme=classic Courses -All courses|/course/ -Course search|/course/search.php Make sure to stay on the current page, as you'll need to click on the "Theme list" edit box (it's the first setting on the page) later on step 12 Click on "Courses" in the menu bar Verify that "Courses" is active with a focus outline Click on "Theme" in the menu bar Verify that "Theme" is active with a focus outline Click on a blank area on the page Verify that no element is focused Click on "Theme" in the menu bar Click inside the "Theme list" edit box Verify that the "Theme list" edit box is focused Go to your Dashboard Turn editing mode on. Click on "Courses" in the menu bar Verify that "Courses" is active with a focus outline Click on the cog icon of the timeline block (add the block to the main area on the page if it's not there) Verify that the cog icon is active with a focus outline Click on a blank area on the page Verify that no element is focused Click on the cog icon of the timeline block Click inside the "Search by activity or name" edit box in the timeline block Test 2 (master only) Log in as admin Click on "Site administration" on the primary nav Narrow the page so some of the secondary tabs move inside a "more" menu Refresh the page Press Tab several times until you reach the secondary menu tabs Press "End" to go to the "More" tab Press Space Using the Down Arrow key on the keyboard, go to "Development" and press Space Verify that you see the content of the "Development" tab Verify that the "More" tab is active (there should be a thick line underneath) Verify that the "More" tab is focused  
    • 0
    • HQ Team International CIH2-220, HQ Team International CIH2-221

      When you click on a menu item that is a parent to a child/sub-menu, the active item indicator (underline) lags one step behind the item which was actually clicked even though the correct dropdown menu opened.

      The best way to demonstrate the issue is using the following animation:

      Steps to reproduce the issue

      1. Login to Moodle 4.0 as a site administrator.
      2. Ensure that you are using the Boost theme.
      3. Navigate to Site Administration > Appearance > Themes > Theme Settings
      4. Add the following to the Custom Menu Items field and click Save Changes at the bottom of the page:
        Theme
        -Boost|/?theme=boost
        -Classic|/?theme=classic
        Help
        -FAQ|/mod/page?id=23
        -About us|/mod/page?id=25
        -Latest news|/mod/page?id=27
      1. Click Help in the primary navigation
      2. Verify that the Help dropdown menu appears. A focus box should appear around the top level Help menu item.
      3. Click Theme in the primary navigation.
      4. Verify that the Theme dropdown menu appears. A box should appear around the top level Theme menu item... but the focus box remains around the Help menu.
      5. From this point on, you can continue to click back and forth and even outside the menu and the focus box will always be one step behind what you just clicked.

      This example only has 2 parent menu items however the same symptoms happen when you have more dropdown menus in the primary navigation.

      Note that this does not affect single-level menu items (no dropdown) as they usually load a new page with every click.

      Let me know if you have any questions.

      Michael Milette

        1. boost-menu-navigation-issue.gif
          boost-menu-navigation-issue.gif
          112 kB
        2. MDL-74117_master_1.webm
          2.64 MB
        3. MDL-74117_master_2.webm
          1.04 MB
        4. MDL-74117_v311.webm
          2.20 MB

            rezaie9 Shamim Rezaie
            michael-milette Michael Milette
            Simey Lameze Simey Lameze
            Andrew Lyons Andrew Lyons
            Angelia Dela Cruz Angelia Dela Cruz
            Votes:
            0 Vote for this issue
            Watchers:
            7 Start watching this issue

              Created:
              Updated:
              Resolved:

                Estimated:
                Original Estimate - 0 minutes
                0m
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 1 day, 3 hours, 56 minutes
                1d 3h 56m

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