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

Boost: User Profile menu does not function as a menu

    XMLWordPrintable

Details

    • MOODLE_33_STABLE, MOODLE_34_STABLE
    • MOODLE_34_STABLE, MOODLE_35_STABLE
    • MDL-62144-master
    • Hide

      Log into Moodle using the boost theme.

      Go to the dashboard.

      Verify the accessibility of the "user profile menu" (menu opened from the user picture in the top right corner of the page). 

      • Use tab key to focus on the user profile menu button. 
      • Verify the menu opens with "enter" key. 
      • Verify the menu closes with "escape" key.
      • Verify the menu does not reopen with "escape" key.
      • Verify the menu opens with "spacebar" key. 
      • Verify when the menu is opened, focus is on the first menu item.
      • Verify the up and down arrow keys move the focus up and down in the menu.
      • Verify that the home and end keys focus on the first and last entry in the menu.
      • Verify that pressing up on the first menu item, will move focus to the last menu item.
      • Verify that pressing down on the last menu item, will move focus to the first menu item.
      • Verify that typing the first letter of an entry in the menu will move focus to the first item that starts with that letter (case insensitive).
      Show
      Log into Moodle using the boost theme. Go to the dashboard. Verify the accessibility of the "user profile menu" (menu opened from the user picture in the top right corner of the page).  Use tab key to focus on the user profile menu button.  Verify the menu opens with "enter" key.  Verify the menu closes with "escape" key. Verify the menu does not reopen with "escape" key. Verify the menu opens with "spacebar" key.  Verify when the menu is opened, focus is on the first menu item. Verify the up and down arrow keys move the focus up and down in the menu. Verify that the home and end keys focus on the first and last entry in the menu. Verify that pressing up on the first menu item, will move focus to the last menu item. Verify that pressing down on the last menu item, will move focus to the first menu item. Verify that typing the first letter of an entry in the menu will move focus to the first item that starts with that letter (case insensitive).

    Description

      The User Profile menu (div with class=dropdown-menu dropdown-menu-right menu  align-tr-br) attempts to use ARIA roles to structure this content as a menu. However, this does not properly navigate as a menu. Users of screen reading software should be able to expand/collapse and navigate the menu/menuitems using arrow keys.

      Suggestion: Modify these menus as needed to ensure expected support for keyboard navigation. See the example at https://www.w3.org/TR/wai-aria-practices-1.1/examples/menubar/menubar-1/menubar-1.html# for a demonstration of proper keyboard navigation in a menu.

      Attachments

        Issue Links

          Activity

            People

              damyon Damyon Wiese
              kedgar Kim Edgar
              Peter Dias Peter Dias
              David Monllaó David Monllaó
              Anna Carissa Sadia Anna Carissa Sadia
              Votes:
              0 Vote for this issue
              Watchers:
              6 Start watching this issue

              Dates

                Created:
                Updated:
                Resolved:
                12/Nov/18