-
Bug
-
Resolution: Fixed
-
Low
-
5.11.0
-
Severity 3 - Minor
-
Issue Summary
On the "Help center | Approvals" page, the "Reorder by column, type", "Reorder by column, reference", and so on, buttons (that appears on activating the "Edit" button) do not have keyboard support.
Steps to Reproduce
- Navigate onto the above mentioned page.
- Navigate onto the "Edit" button and activate it.
- Navigate onto the mentioned instances with a keyboard.
- Observe that the buttons do not have keyboard support.
Screenshot
Actual Results
The "Reorder by column, type", "Reorder by column, reference", and so on, buttons to rearrange the columns lack keyboard support. As a result, they cannot be operated with a keyboard and screen reader.
Expected Results
All interactive elements should be focusable and operable with a keyboard. Use native <button> elements that have keyboard support by default.
If this is not possible, use custom role="button" and tabindex="0" to make sure that these buttons receive keyboard focus and have an interactive role.
Code Snippet
<button aria-label="Reorder by column, type">...</button>
<span role="button" tabindex="0" aria-label="Reorder by column, type">...</span>
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 Ventura 13.3.1
Chrome - Version 113.0.5672.63 (Official Build) (x86_64)
Firefox- Version 92.0 (64-bit)
Safari- Version 16.4 (18615.1.26.110.1)
JAWS- Version 2023
NVDA- Version 2023.3
Voiceover - Version Latest
[JSDSERVER-14217] Help center | approvals : Missing keyboard support for buttons
| Resolution | New: Fixed [ 1 ] | |
| Status | Original: Waiting for Release [ 12075 ] | New: Closed [ 6 ] |
| Description |
Original:
h3. Issue Summary
On the "Help center | Approvals" page, the "Reorder by column, type", "Reorder by column, reference", and so on, buttons (that appears on activating the "Edit" button) do not have keyboard support. h3. Steps to Reproduce # Navigate onto the above mentioned page. # Navigate onto the "Edit" button and activate it. # Navigate onto the mentioned instances with a keyboard. # Observe that the buttons do not have keyboard support. h3. Screenshot !Screenshot 2023-09-12 at 8.14.44 PM.png|thumbnail! h3. Actual Results The "Reorder by column, type", "Reorder by column, reference", and so on, buttons to rearrange the columns lack keyboard support. As a result, they cannot be operated with a keyboard and screen reader. h3. Expected Results All interactive elements should be focusable and operable with a keyboard. Use native <button> elements that have keyboard support by default. If this is not possible, use custom role="button" and tabindex="0" to make sure that these buttons receive keyboard focus and have an interactive role. *Code Snippet* {code:java} <button aria-label="Reorder by column, type">{code} {code:java} </button> <span role="button" tabindex="0" aria-label="Reorder by column, type">...</span> {code} h3. Workaround Currently there is no known workaround for this behavior. A workaround will be added here when available h3. Environment MacBook Pro (16-inch, 2021) macOs Ventura 13.3.1 Chrome - Version 113.0.5672.63 (Official Build) (x86_64) Firefox- Version 92.0 (64-bit) Safari- Version 16.4 (18615.1.26.110.1) JAWS- Version 2023 NVDA- Version 2023.3 Voiceover - Version Latest |
New:
h3. Issue Summary
On the "Help center | Approvals" page, the "Reorder by column, type", "Reorder by column, reference", and so on, buttons (that appears on activating the "Edit" button) do not have keyboard support. h3. Steps to Reproduce # Navigate onto the above mentioned page. # Navigate onto the "Edit" button and activate it. # Navigate onto the mentioned instances with a keyboard. # Observe that the buttons do not have keyboard support. h3. Screenshot !Screenshot 2023-09-12 at 8.14.44 PM.png|thumbnail! h3. Actual Results The "Reorder by column, type", "Reorder by column, reference", and so on, buttons to rearrange the columns lack keyboard support. As a result, they cannot be operated with a keyboard and screen reader. h3. Expected Results All interactive elements should be focusable and operable with a keyboard. Use native <button> elements that have keyboard support by default. If this is not possible, use custom role="button" and tabindex="0" to make sure that these buttons receive keyboard focus and have an interactive role. *Code Snippet* {code:java} <button aria-label="Reorder by column, type">...</button>{code} {code:java} <span role="button" tabindex="0" aria-label="Reorder by column, type">...</span> {code} h3. Workaround Currently there is no known workaround for this behavior. A workaround will be added here when available h3. Environment MacBook Pro (16-inch, 2021) macOs Ventura 13.3.1 Chrome - Version 113.0.5672.63 (Official Build) (x86_64) Firefox- Version 92.0 (64-bit) Safari- Version 16.4 (18615.1.26.110.1) JAWS- Version 2023 NVDA- Version 2023.3 Voiceover - Version Latest |
| Description |
Original:
h3. Issue Summary
On the "Help center | Approvals" page, the "Reorder by column, type", "Reorder by column, reference", and so on, buttons (that appears on activating the "Edit" button) do not have keyboard support. h3. Steps to Reproduce # Navigate onto the above mentioned page. # Navigate onto the "Edit" button and activate it. # Navigate onto the mentioned instances with a keyboard. # Observe that the buttons do not have keyboard support. h3. Screenshot !Screenshot 2023-09-12 at 8.14.44 PM.png|thumbnail! h3. Actual Results The "Reorder by column, type", "Reorder by column, reference", and so on, buttons to rearrange the columns lack keyboard support. As a result, they cannot be operated with a keyboard and screen reader. h3. Expected Results All interactive elements should be focusable and operable with a keyboard. Use native <button> elements that have keyboard support by default. If this is not possible, use custom role="button" and tabindex="0" to make sure that these buttons receive keyboard focus and have an interactive role. *Code Snippet* {code:java} <button aria-label="Reorder by column, type">...</button> <span role="button" tabindex="0" aria-label="Reorder by column, type">...</span> {code} h3. Workaround Currently there is no known workaround for this behavior. A workaround will be added here when available h3. Environment MacBook Pro (16-inch, 2021) macOs Ventura 13.3.1 Chrome - Version 113.0.5672.63 (Official Build) (x86_64) Firefox- Version 92.0 (64-bit) Safari- Version 16.4 (18615.1.26.110.1) JAWS- Version 2023 NVDA- Version 2023.3 Voiceover - Version Latest |
New:
h3. Issue Summary
On the "Help center | Approvals" page, the "Reorder by column, type", "Reorder by column, reference", and so on, buttons (that appears on activating the "Edit" button) do not have keyboard support. h3. Steps to Reproduce # Navigate onto the above mentioned page. # Navigate onto the "Edit" button and activate it. # Navigate onto the mentioned instances with a keyboard. # Observe that the buttons do not have keyboard support. h3. Screenshot !Screenshot 2023-09-12 at 8.14.44 PM.png|thumbnail! h3. Actual Results The "Reorder by column, type", "Reorder by column, reference", and so on, buttons to rearrange the columns lack keyboard support. As a result, they cannot be operated with a keyboard and screen reader. h3. Expected Results All interactive elements should be focusable and operable with a keyboard. Use native <button> elements that have keyboard support by default. If this is not possible, use custom role="button" and tabindex="0" to make sure that these buttons receive keyboard focus and have an interactive role. *Code Snippet* {code:java} <button aria-label="Reorder by column, type">{code} {code:java} </button> <span role="button" tabindex="0" aria-label="Reorder by column, type">...</span> {code} h3. Workaround Currently there is no known workaround for this behavior. A workaround will be added here when available h3. Environment MacBook Pro (16-inch, 2021) macOs Ventura 13.3.1 Chrome - Version 113.0.5672.63 (Official Build) (x86_64) Firefox- Version 92.0 (64-bit) Safari- Version 16.4 (18615.1.26.110.1) JAWS- Version 2023 NVDA- Version 2023.3 Voiceover - Version Latest |
| Labels | Original: 2.1.1 4.1.2 Level-A WCAG21 ax-at-user ax-bug ax-high-priority ax-jsm-dc-vpat ax-jsm-dc-vpat-helpcentre-approvals ax-jsm-dc-vpat-pg06 ax-jsmdc-helpcenter ax-kb-user ax-qa ril | New: 2.1.1 4.1.2 Level-A WCAG21 ax-at-user ax-bug ax-high-priority ax-jsm-dc-vpat ax-jsm-dc-vpat-helpcentre-approvals ax-jsm-dc-vpat-pg06 ax-jsmdc-helpcenter ax-jsmdc-vpat-2024 ax-jsmdc-vpat-2024-approvals ax-jsmdc-vpat-2024-reused ax-kb-user ax-qa ril |
| Status | Original: In Progress [ 3 ] | New: Waiting for Release [ 12075 ] |
| Fix Version/s | New: 10.4.0 [ 110312 ] |
| Status | Original: Gathering Impact [ 12072 ] | New: In Progress [ 3 ] |
| Labels | Original: 2.1.1 4.1.2 Level-A WCAG21 ax-at-user ax-bug ax-high-priority ax-jsm-dc-vpat ax-jsm-dc-vpat-helpcentre-approvals ax-jsm-dc-vpat-pg06 ax-jsmdc-helpcenter ax-kb-user ax-qa | New: 2.1.1 4.1.2 Level-A WCAG21 ax-at-user ax-bug ax-high-priority ax-jsm-dc-vpat ax-jsm-dc-vpat-helpcentre-approvals ax-jsm-dc-vpat-pg06 ax-jsmdc-helpcenter ax-kb-user ax-qa ril |
| Remote Link | New: This issue links to "Internal ticket (Web Link)" [ 955925 ] |
| Remote Link | Original: This issue links to "A11Y-217 (Bulldog)" [ 931241 ] | New: This issue links to "A11Y-217 (JIRA Server (Bulldog))" [ 931241 ] |