-
Bug
-
Resolution: Unresolved
-
Medium (View bug fix roadmap)
-
None
-
8.20.30, 9.12.2, 9.4.17
-
8.2
-
Severity 3 - Minor
-
Issue Summary
The state information is not defined programmatically for few elements in the main content area.
Steps to Reproduce
- Navigate to the "Plans" dropdown and select any plan.
- Navigate the page using screen reader.
- Using screen reader navigate the page content.
- Verify that state is not defined programmatically.
Screenshot
Actual Results
The current state is not programmatically defined for the currently active “3M”, "1Y", "Fit", and "Custom" button.
As a result, screen reader users will not be aware of the currently selected state of the button.
Expected Results
Ensure that the current state of the active element is defined using the "aria-pressed" attribute with an appropriate token value.
Apply the following changes:
- Add the aria-pressed="true" attribute to <button> element.
- Ensure that the "aria-pressed" attribute is updated as per user interaction using scripting.
Code Snippet
<button aria-pressed="true" class="_13IoD sc-fAjcbJ dKHlbz" spacing="default" type="button"> <span style="align-self: center; display: inline-flex; flex-wrap: nowrap; max-width: 100%; position: relative;"> <span style="align-items: center; align-self: center; flex: 1 1 auto; margin: 0px 4px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: opacity 0.3s ease 0s; opacity: 1;">3M</span> </span> </button>
Workaround
Currently there is no known workaround for this behavior. A workaround will be added here when available
Environment
MacBook Pro (16-inch, 2019)
macOS Ventura Version 13.6.1
Chrome - Version 120.0.6099.234 (Official Build) (x86_64)
Firefox- Version 112.0.1 (64-bit)
Safari- Version 17.3 (18617.2.4.11.9, 18617)
JAWS- Version 2022
NVDA- Version 2020.3
- links to