-
Type:
Bug
-
Resolution: Unresolved
-
Priority:
Medium
-
None
-
Affects Version/s: 9.12.2
-
Component/s: Accessibility, Project - Core Boards
-
- 1.3.2
- Level-A
- WCAG2.1
- a11y-triaged
- ax-at-JAWS
- ax-at-NVDA
- ax-at-VO
- ax-at-user
- ax-bug
- ax-desktop
- ax-dev-ready
- ax-high-priority
- ax-jira-dc-vpat
- ax-jira-dc-vpat-AllBoards
- ax-jiradc-vpat2024
- ax-jiradc-vpat2024-allboard
- ax-jiradc-vpat2024-pg13
- ax-macos-safari
- ax-qa
- ax-qa-not-fixed
- ax-qa-verified
- ax-shipped-pre2024
-
9.12
-
Severity 3 - Minor
Issue Summary
On the All Boards page, the content associated with the "More actions for [0] Copy of Copy of Copy of DEMO board", "More actions for [0] Copy of Copy of DEMO board", "More actions for [0] Copy of DEMO board", etc. expandable buttons in the main content area do not have an accurate reading order.
Steps to Reproduce
- Open the "All Boards" page.
- Navigate to the main content.
- Using screen reader, navigate to the mentioned buttons and activate any of these.
- Notice that the content associated with the mentioned button is getting update at the end of the page.
Screen Recording
Boards - InstEnv Jira - Google Chrome 2024-02-09 11-06-49.mp4![]()
Actual Results
When the "More actions for [0] Copy of Copy of Copy of DEMO board", "More actions for [0] Copy of Copy of DEMO board", "More actions for [0] Copy of DEMO board", etc. buttons are expanded, the expanded content of these buttons is available at the end of the page for screen reader users. This is because this content is not coded directly after the buttons in the DOM. It is instead coded above the activated buttons. 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 buttons is coded directly after the expandable buttons 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 to the expanded content when the buttons are expanded.
Code Snippet:
<button aria-haspopup="true" id="ghx-manage-boards-operation-trigger-16" class="aui-dropdown2-trigger aui-dropdown2-trigger-arrowless aui-style-default aui-button aui-button-subtle" aria-labelledby="ghx-manage-boards-operation-trigger-16 board16" resolved="" aria-controls="ghx-manage-boards-operation-popup-16" aria-expanded="true">
<span class="ghx-iconfont aui-icon aui-icon-small aui-iconfont-more ghx-clickable">More actions for {0}</span>
</button>
<ul class="aui-list-truncate"><li><a class="js-edit-view" title="View configuration of board" href="/secure/RapidView.jspa?rapidView=16" tabindex="-1">Configure</a></li><li><a class="js-copy-board-action" data-board-id="16" data-board-name="Copy of Copy of Copy of DEMO board" title="Copy this board" href="#" tabindex="-1">Copy</a></li><li><a class="js-delete-board-action" href="#" title="Delete this board" data-board-id="16" data-board-name="Copy of Copy of Copy of DEMO board" data-board-sprint-enabled="false" tabindex="-1">Delete</a></li></ul>
<li><a class="js-edit-view" title="View configuration of board" href="/secure/RapidView.jspa?rapidView=16" tabindex="-1">Configure</a></li>
<li><a class="js-copy-board-action" data-board-id="16" data-board-name="Copy of Copy of Copy of DEMO board" title="Copy this board" href="#" tabindex="-1">Copy</a></li>
<li><a class="js-delete-board-action" href="#" title="Delete this board" data-board-id="16" data-board-name="Copy of Copy of Copy of DEMO board" data-board-sprint-enabled="false" tabindex="-1">Delete</a></li>
</ul>
Workaround
Required, if there is no workaround please state:
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