Details
-
Bug
-
Resolution: Unresolved
-
Low
-
None
-
9.7.0
-
9.07
-
Severity 3 - Minor
-
Description
Issue Summary
On the “Burndown Chart” page, the "Chart", and "Estimate type" dropdowns (that appear on activating the "Chart: Sample Sprint 2", and "Estimate type: Story Points" buttons) are not explicitly associated with their visual labels.
Steps to Reproduce
- Navigate onto the above mentioned page.
- Navigate onto the mentioned form fields and inspect their code.
- Observe that there is an attempt to associate the visual labels and the form fields.
- Observe that the form fields are not correctly programmatically associated with their visual labels.
Screenshot
Actual Results
The "Chart", and "Estimate type" dropdowns are not correctly explicitly associated with their visual labels using “for” and “id” attribute. There are <label> elements in the DOM. However, the "for" and "id" values do not match. As a result, users of assistive technologies found it challenging to interact with the form fields.
Expected Results
The labels and the form fields should be correctly explicitly associated. To implement this, use <label> elements. As well, associate the <label> elements with the form fields using “for” and “id” attributes. Make sure that the values within “for” and “id” match appropriately.
Code Snippet:
<label for="d1">Chart</label> <select id="d1" ...> ... </select>
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 Monterey Version 12.4
Chrome - Version 103.0.5060.134 (Official Build) (arm64)
Firefox- Version 93.0 (32-bit)
Safari- Version 15.5 (17613.2.7.1.8)
JAWS- Version 2022
NVDA- Version 2020.3
Voiceover - Version Latest