KatiePUX
commented
2 weeks ago We need a mechanism to have aria - label without rendering the label text Current thoughts - new prop to prevent render and don't render a label if no label text Updates examples on design system web page to state check box should always have a label unless using in a context where the label is clear like a table.
developernm
Describe the Bug
An accessibility issue has been identified where a form control lacks an associated label text. This issue causes screen readers and assistive technologies to struggle in conveying the purpose of the control, violating WCAG 2.2 Success Criterion 1.3.1 (Info and Relationships).
To Reproduce
Steps to reproduce the behavior:
Open the web application.
Navigate to the "Confirm exchange set content" page.
Use a web accessibility testing tool (e.g., ARC Toolkit).
Observe the error regarding empty label text for checkboxes.
Expected Behavior
Each checkbox should have an associated
<label>element with a clear and descriptive text to explain its function, enhancing accessibility and user experience.Screenshots
Additional Context
This issue affects the accessibility of checkboxes used for selecting ENC items. The checkboxes lack proper label associations, making it difficult for users who rely on screen readers to understand the purpose of these controls. Ensure that each checkbox has an associated
<label>element with a descriptive text to resolve this issue.