Issue Summary

An “Actions/Options” available for the issues present in the Backlog are not accessible for screen reader users and keyboard-only users.

Steps to Reproduce

1. Open the "Backlog" page.
2. Navigate to the issues present in the backlog and right-click the cursor over it.
3. Observe that a list of "Actions/Options" will appear on the page.
4. Try to access this list of options using the keyboard and screen reader.
5. Notice that this list does not receive any keyboard focus and so is missed by the screen reader as well.

Screen Recording

Screen Recording 2024-02-20 at 12.42.39 PM.mov

Screenshot

Actual Results

When the user tries to navigate to the “Action/Options” that are available through the right-click of the mouse on the issues, the keyboard skips this list as this <div> element contains tabindex="-1" and passes through the following components as it is not operable through the keyboard.

This made it difficult for keyboard-only users and screen reader users to access the functionality of the "Actions/Options" that are available for the sighted users.

Expected Results

Every functionality that is available and accessible to the sighted user should be accessible to all users.

Apply the following changes:

• Provide tabindex="0" to the <div> element containing the list of "Actions/Options".
• Also, make sure to provide proper roles and states to the list box and options that are present.
• Additionally, modify the scripts to ensure it's operable with the keyboard and the screen reader.

Code Example:

<div id="gh-ctx-menu-content" class="aui-list" tabindex="0" style="height: 314px; overflow: auto; outline: 0px;">....</div>

Workaround

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

Environment

MacBook Pro (16-inch, 2021)
macOs Sonoma 14.3
Chrome - Version 120.0.6099.109 (Official Build) (arm64)
Firefox- Version 92.0 (64-bit) 
Safari- Version 17.3 (19617.2.4.11.8)
JAWS- Version 2023
NVDA- Version 2021.2 
Voiceover - Version Latest