Details
-
Bug
-
Resolution: Unresolved
-
Low
-
None
-
5.2.0
-
Severity 3 - Minor
-
Description
Issue Summary
On the "Audit Log" page, Inaccurate accessible name is provided for combo box.
Steps to Reproduce
- Open the above mentioned page.
- Navigate to the main content area, Find "Configure" button and activate it.
- Observe the modal dialog gets available on the page.
- Using screen reader, navigate to the "Retention period" combo box.
- Listen that inaccurate accessible name is announced.
Screen Recording
Screen Recording 2023-11-17 at 12.48.04 PM.mov
Screenshot
Actual Result
Inaccurate accessible name "some-aria-label" is provided for "Retention Period" combo box using "aria-label" attribute. as a result, screen reader users would not understand the exact purpose of the form control and difficult to comprehend which option have to choose.
as well, even though the visual label is provided using <label> element, but the explicit association is not done programmatically.
Expected Result
Ensure that screen reader should announce accurate and appropriate accessible name for the form control. In this instance, Remove "aria-label" and "aria-labelledby" attributes from <input> element in the DOM.
Since, A visual label is provided using <label> element, so make programmatic explicit association with it's corresponding input field.
Additionally, specify “for” and “id” attributes. Make sure that the values within “for” and “id” match appropriately.
Code Snippet
<label for="retention-uid1">Retention Period</label>
<input id="retention-uid1" ..>
A workaround will be added here when available
Environment
MacBook Pro (14-inch, 2021)
macOs Ventura 13.5
Chrome - Version 115.0.5790.114 (Official Build) (x86_64)
Firefox- Version 93.0 (32-bit)
Safari- Version 15.3 (17612.4.9.1.5)
JAWS- Version 2023
NVDA- Version 2023.2
Voiceover - Version Latest