-
Bug
-
Resolution: Unresolved
-
Low (View bug fix roadmap)
-
None
-
9.12.2
-
9.12
-
2
-
Severity 3 - Minor
-
Issue Summary
On "Find an issue" page, the identical accessible label "Actions" is provided for buttons in the table.
Note : This issue is found on "Basic" and "Advanced" mode.
Steps to Reproduce
- Open above page.
- Navigate through page using screen reader or inspect the code.
- Observe that the links have identical labels.
Screenshot
Actual Results
The identical label "Actions” is provided for multiple buttons which is present in "Search issues" table.
As a result, screen reader users will not understand the purpose of these buttons.
Also, screen reader users tend to pull a list of buttons for faster navigation, thus the buttons with similar labels appearing multiple times in their list will create confusion for them.
Expected Results
Unique and descriptive labels should be provided for the buttons
Apply following changes:
- Add an "id" attribute with a unique values to the "Action" links and summary links (List, Heading, text and so on). Similarly, add an "id" attribute with a unique value to the link element.
- Add the "aria-labelledby" attribute to <a> element.
- Reference values of "id" attributes of the <a> element and the summary links in the "aria-labelledby" attribute.
<td> <a href="#" id="a1" ...>List</a> </td> ... <td> <a href="#" id="a2" aria-labelledby="a1 a2" ...> <span>Actions</span> </a> </td>
Workaround
Not available
Environment
MacBook Pro (16-inch, 2021)
macOS Sonoma Version 14.1
Chrome - Version 119.0.6045.159 (Official Build) (arm64)
Firefox- Version 93.0 (32-bit) Safari- Version 17.1 (19616.2.9.11.7)
JAWS- Version 2023
NVDA- Version 2020.3
Voiceover - Version Latest
[JRASERVER-77308] Find an issue : Identical label for links
| Support reference count | New: 2 |
| Labels | Original: 2.4.4 Accessibility Level-A WCAG21 a11y-triaged ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-vpat2024 ax-jiradc-vpat2024-findanissue ax-jiradc-vpat2024-pg14 ax-macos-safari ax-qa ax-windows-chrome ax-windows-firefox | New: 2.4.4 Accessibility Level-A WCAG21 a11y-triaged ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-vpat2024 ax-jiradc-vpat2024-findanissue ax-jiradc-vpat2024-pg14 ax-macos-safari ax-qa ax-qa-partially-fixed ax-qa-verified ax-windows-chrome ax-windows-firefox |
| Attachment | New: Screenshot 2025-01-22 at 1.19.19 PM.png [ 480780 ] |
| Component/s | New: Navigation - Search [ 43404 ] |
| Component/s | Original: Accessibility [ 62490 ] | |
| Component/s | New: Accessibility - Future VPAT consideration [ 74493 ] |
| Status | Original: Needs Triage [ 10030 ] | New: Long Term Backlog [ 12073 ] |
| Labels | Original: 2.4.4 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-vpat2024 ax-jiradc-vpat2024-findanissue ax-jiradc-vpat2024-pg14 ax-macos-safari ax-qa ax-windows-chrome ax-windows-firefox | New: 2.4.4 Accessibility Level-A WCAG21 a11y-triaged ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-vpat2024 ax-jiradc-vpat2024-findanissue ax-jiradc-vpat2024-pg14 ax-macos-safari ax-qa ax-windows-chrome ax-windows-firefox |
| Labels | Original: 2.4.4 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-vpat2024 ax-jiradc-vpat2024-findanissue ax-jiradc-vpat2024-pg14 ax-jiradc-vpat2024-searchallissues ax-macos-safari ax-qa ax-windows-chrome ax-windows-firefox | New: 2.4.4 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-vpat2024 ax-jiradc-vpat2024-findanissue ax-jiradc-vpat2024-pg14 ax-macos-safari ax-qa ax-windows-chrome ax-windows-firefox |
| Labels | Original: 2.4.4 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-vpat2024 ax-jiradc-vpat2024-pg14 ax-jiradc-vpat2024-searchallissues ax-macos-safari ax-qa ax-windows-chrome ax-windows-firefox | New: 2.4.4 Accessibility Level-A WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-at-user ax-bug ax-desktop ax-high-priority ax-jiradc-vpat2024 ax-jiradc-vpat2024-findanissue ax-jiradc-vpat2024-pg14 ax-jiradc-vpat2024-searchallissues ax-macos-safari ax-qa ax-windows-chrome ax-windows-firefox |
| Description |
Original:
h3. Issue Summary
On "Find an issue" page, the identical accessible label "Actions" is provided for buttons in the table. h3. Steps to Reproduce # Open above page. # Navigate through page using screen reader or inspect the code. # Observe that the links have identical labels. h3. Screenshot !Screenshot 2024-02-08 at 1.16.53 PM.png|width=384,height=223! h3. Actual Results The identical label "Actions” is provided for multiple buttons which is present in "Search issues" table. As a result, screen reader users will not understand the purpose of these buttons. Also, screen reader users tend to pull a list of buttons for faster navigation, thus the buttons with similar labels appearing multiple times in their list will create confusion for them. h3. Expected Results Unique and descriptive labels should be provided for the buttons Apply following changes: * Add an "id" attribute with a unique values to the "Action" links and summary links (List, Heading, text and so on). Similarly, add an "id" attribute with a unique value to the link element. * Add the "aria-labelledby" attribute to <a> element. * Reference values of "id" attributes of the <a> element and the summary links in the "aria-labelledby" attribute. {noformat} <td> <a href="#" id="a1" ...>List</a> </td> ... <td> <a href="#" id="a2" aria-labelledby="a1 a2" ...> <span>Actions</span> </a> </td>{noformat} h3. Workaround Not available h3. Environment MacBook Pro (16-inch, 2021) macOS Sonoma Version 14.1 Chrome - Version 119.0.6045.159 (Official Build) (arm64) Firefox- Version 93.0 (32-bit) Safari- Version 17.1 (19616.2.9.11.7) JAWS- Version 2023 NVDA- Version 2020.3 Voiceover - Version Latest |
New:
h3. Issue Summary
On "Find an issue" page, the identical accessible label "Actions" is provided for buttons in the table. *Note :* This issue is found on "Basic" and "Advanced" mode. h3. Steps to Reproduce # Open above page. # Navigate through page using screen reader or inspect the code. # Observe that the links have identical labels. h3. Screenshot !Screenshot 2024-02-08 at 1.16.53 PM.png|width=384,height=223! h3. Actual Results The identical label "Actions” is provided for multiple buttons which is present in "Search issues" table. As a result, screen reader users will not understand the purpose of these buttons. Also, screen reader users tend to pull a list of buttons for faster navigation, thus the buttons with similar labels appearing multiple times in their list will create confusion for them. h3. Expected Results Unique and descriptive labels should be provided for the buttons Apply following changes: * Add an "id" attribute with a unique values to the "Action" links and summary links (List, Heading, text and so on). Similarly, add an "id" attribute with a unique value to the link element. * Add the "aria-labelledby" attribute to <a> element. * Reference values of "id" attributes of the <a> element and the summary links in the "aria-labelledby" attribute. {noformat} <td> <a href="#" id="a1" ...>List</a> </td> ... <td> <a href="#" id="a2" aria-labelledby="a1 a2" ...> <span>Actions</span> </a> </td>{noformat} h3. Workaround Not available h3. Environment MacBook Pro (16-inch, 2021) macOS Sonoma Version 14.1 Chrome - Version 119.0.6045.159 (Official Build) (arm64) Firefox- Version 93.0 (32-bit) Safari- Version 17.1 (19616.2.9.11.7) JAWS- Version 2023 NVDA- Version 2020.3 Voiceover - Version Latest |