Header - Login page : Role not defined for menu button

XMLWordPrintable

    • Severity 3 - Minor

      Issue Summary

      The role "menuitem" is defined for the sub-menu items. 

      Elements name: Sub menu elements in all menus
      Ex: All build plans, Build activity, Branch status options, under the "Build menu.
      Menus: Linked Applications, Build, Deploy, Help menus

      Location of the elements: Menu buttons, in the header.

      Additional details: After expanding the menus, the keyboard focus is not moving into the submenu elements.

      Steps to Reproduce

      1. Open the home page
      2. Turn on the screen reader and navigate the sub-menu links of "Build", "Deploy", and so on menu buttons.
      3. Observe that role "menuitem" is not announced for the screen reader user.   

      Actual Results

      The role “menuitem“ is not programmatically defined for the sub-menu links present in “Build”, “Deploy“, and so on links in the header section.

      As a result, screen reader users will not be aware of the role information of the link.

      Expected Results

      • Remove role "menu" from <div> element and set it to the <ul> element of the submenu items list
      • Set role "menuitem" to the submenu links such as "All Build Plans", "Build Activity", and so on. 
      • Replaced tabindex=-1 with the tabindex="0" attribute.

      Code Snippet:

      <div id="bamboo.global.header-build.menu" class="aui-dropdown2 aui-style-default aui-layer aui-alignment-side-bottom aui-alignment-snap-auto" resolved="" tabindex="0" style="z-index: 1; margin: 0px;" data-aui-alignment="bottom auto" data-aui-alignment-static="true" x-placement="bottom-start">
      <div class="aui-dropdown2-section">
      <ul class="aui-list-truncate" role="menu">
      <li><a href="/allPlans.action" id="allPlansTab" tabindex="0" role="menuitem>All build plans</a></li>
      <li><a href="/currentActivity.action" id="currentTab" tabindex="0" role="menuitem>Build activity</a></li><li><a href="/branchStatus?source=header" id="branch_builds" tabindex="0" role="menuitem>Branch status</a></li>
      </ul>
      </div>
      </div>

      Working examples and information on implementing accessible ARIA menus can be found at: https://www.w3.org/WAI/ARIA/apg/example-index/menu-button/menu-button-links

      Screenshot

      Workaround

      Not Available

      Bug Ref: 459201

            Assignee:
            Vadym Ohyr
            Reporter:
            Matthew Brennan
            Votes:
            0 Vote for this issue
            Watchers:
            4 Start watching this issue

              Created:
              Updated:
              Resolved: