Issue Summary
The content associated with the "More" expandable link in the modal dialog (that becomes available on activating the "Show user information" button) does not have an appropriate reading order.
Note: A similar issue is found on the View issue in the queue view & comments page.
Steps to Reproduce
- Open the "Project - All open" page.
- Navigate to the table in main content.
- Navigate to the "Show user information" button and activate any of these.
- A modal dialog appears on the page.
- Using screen reader, navigate to the "More" link and activate it.
- Arrow down onto the expandable content from the link.
- Note that the content associated with it is available at the end of the page.
Screen Recording 1
JSM_ All open - Google Chrome 2023-09-11 15-35-14.mp4
Screen Recording 2
[JSM-1] What am I looking at_ - InstEnv Jira - Google Chrome 2023-09-14 15-00-33.mp4
Actual Results
When the "More" link is expanded, the expanded content of this link is available at the end of the page for screen reader users. This is because this content is not coded directly after the link in the DOM. It is instead coded at the end of the page. This inappropriate reading order might disorient the users of screen readers. That the content is available at the end might confuse or mislead them.
Expected Results
Content must have an appropriate reading order. Assistive technologies navigate content using the order in which elements appear in the DOM. Hence, make sure that the content is programmatically ordered in such a way that it provides an appropriate reading order to the users of assistive technologies.
Make sure that the content that gets available on expanding the link is coded directly after the expandable link in the DOM. This will create an appropriate reading order for the users of assistive technologies. For instance, this will enable them to arrow down onto the expanded content when the buttons are expanded.
Code Snippet
<a id="user-hover-more-trigger" class="user-hover-more lnk aui-dd-link standard" href="#" hidefocus="" title="More" aria-controls="user-hover-more-trigger_drop" aria-haspopup="true" aria-expanded="true"><span>More</span></a> <a class="aui-list-item-link" id="uh_view_profile" title="View this user's profile" href="/secure/ViewProfile.jspa?name=admin&selectedTab=jira.user.profile.panels:user-profile-summary-panel" tabindex="0" role="menuitem">Profile</a>
Workaround
Currently there is no known workaround for this behavior. A workaround will be added here when available
Environment
MacBook Pro (16-inch, 2021)
macOs Monterey Version 12.3.1
Chrome - Version 101.0.4606.81 (Official Build) (64-bit)
Firefox- Version 93.0 (32-bit)
Safari- Version 15.3 (17612.4.9.1.5)
JAWS- Version 2022
NVDA- Version 2020.3
Voiceover - Version Latest