Uploaded image for project: 'Jira Service Management Data Center'
  1. Jira Service Management Data Center
  2. JSDSERVER-12282

Help center: Dropdown not accessible to the screen reader & Keyboard-only users.

      Issue Summary

      The "Created by me", "Open requests" and "Any request type", etc dropdowns are inaccessible to the screen reader & Keyboard-only users.

      Steps to Reproduce

      1. In the Jira left-hand sidebar for the opened project, select the "Raise a request" link.
      2. In the Available portal, navigate to the Request menu and select "All requests".
      3. Navigate to the "Created by me" dropdown keeping the screen reader on.
      4. Observe the dropdown is inaccessible with the keyboard & screen reader.

      Actual Results

      While navigating with Keyboard & screen reader, when user navigate to the "Created by me", "Open requests" and "Any request type", etc dropdowns and press enter the dropdown expands but user can not navigate inside it with arrow keys.

      Additionally they are coded using role="menu" inappropriately. And list mark is used incorrectly for the options.

      This makes Keyboard & screen reader users difficult to access the functionality associated with them.

      Expected Results

      These dropdowns should be announced as "combobox" elements by the screen reader instead of menu. And the users should be able to navigate through all options with up/down arrow keys & by pressing enter key should select an option.

      Code these elements using native HTML <select> & <option> elements and use CSS to maintain the current visual presentation.

      Alternatively use ARIA role, state & properties of "Select only combobox" elements. Refer to the following example for more details about the behaviour & code implementation.

      https://www.w3.org/WAI/ARIA/apg/example-index/combobox/combobox-select-only.html

      Screenshot

       

      Workaround

      Currently, there is no known workaround for this behavior. A workaround will be added here when available

            [JSDSERVER-12282] Help center: Dropdown not accessible to the screen reader & Keyboard-only users.

            Bartosz Ornatowski made changes -
            Priority Original: High [ 2 ] New: Highest [ 1 ]
            Divyanshi made changes -
            Remote Link New: This issue links to "Page (Confluence)" [ 912193 ]
            Satej Mirpagar made changes -
            Resolution New: Fixed [ 1 ]
            Status Original: Waiting for Release [ 12075 ] New: Closed [ 6 ]
            Oleksandr Zghonnyk (Inactive) made changes -
            Fix Version/s New: 5.10.1 [ 105791 ]
            Oleksandr Zghonnyk (Inactive) made changes -
            Status Original: In Review [ 10051 ] New: Waiting for Release [ 12075 ]
            ssuryavanshi (Inactive) made changes -
            Labels Original: 2.1.1 4.1.2 AXSR-60 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-critical ax-critical-priority ax-customer-escalated ax-dev-ready ax-esc-ssa ax-qa ax-qa-prioritised New: 2.1.1 4.1.2 AXSR-60 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-critical ax-critical-priority ax-customer-escalated ax-dev-ready ax-esc-ssa ax-qa ax-qa-prioritised ax-qa-verified
            Oleksandr Zghonnyk (Inactive) made changes -
            Status Original: In Progress [ 3 ] New: In Review [ 10051 ]
            Martin Ma made changes -
            Status Original: Ready for Development [ 10049 ] New: In Progress [ 3 ]
            Oleksandr Zghonnyk (Inactive) made changes -
            Assignee Original: Yurii Travenko [ 36a811bdd856 ] New: Oleksandr Zghonnyk [ ac25cb55d206 ]
            Oleksandr Stoliar made changes -
            Assignee New: Yurii Travenko [ 36a811bdd856 ]

              ac25cb55d206 Oleksandr Zghonnyk (Inactive)
              beeebe6f29a3 Siddharaj Suryavanshi
              Affected customers:
              0 This affects my team
              Watchers:
              2 Start watching this issue

                Created:
                Updated:
                Resolved: