Issue Summary
"Expand/Collapse" state is not defined for the "Link to major incident", "Link", "Comment" and so on buttons.
Steps to Reproduce
- Open "JSM System Dashboard" page.
- Navigate to the "Projects" in the header section and choose any ITSM project from the options.
- Select the "Waiting for support queue" from the queues list.
- Navigate and select the "Select All Issues" checkbox in main content.
- Using screen reader, navigate to the "Link to major incident", "Link", "Comment" and so on buttons in the main content area and activate it.
- Listen that the expand/collapse state is not announced for the button.
Screen Recording
Screen Recording 2024-12-18 at 6.50.54 PM.mov
Actual Results
On activating "Link to major incident", "Link", "Comment" and so on buttons, the content dynamically gets expanded and collapsed below. The dynamically updating button's state is not defined programmetically.
As a result, screen reader users are not able to understand the button's functionality.
Expected Results
The screen reader should announce the expand / collapse state for the button. Set 'aria-expanded' attribute to 'false' for the button by default as the button is in the collapsed state. Ensure that the value of 'aria-expanded' attribute changes to 'true' in expanded state on user interaction via scripting.
Code Snippet
<button aria-expanded="false" aria-label="Link to major incident" tabindex="0" type="button" ...>
(...)
<div ...>Link to major incident</div>
</button>
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 14.7 (23D56)
Chrome - Version 131.0.6778.86
Firefox- Version 122.0.1 (64-bit)
Safari- Version 18.1.1 (19619.2.8.111.7, 19619)
JAWS- Version 2024
NVDA- Version 2023.3
Voiceover - Version Latest