-
Notifications
You must be signed in to change notification settings - Fork 1.1k
Closed
Labels
Affects: Accessibility 🟡Relates to the accessibility of our componentsRelates to the accessibility of our componentsAffects: Markup 🟡Suggestion would change the markup of a componentSuggestion would change the markup of a componentPackage: Range SliderRole: DevDevelopment/engineering skills neededDevelopment/engineering skills needed
Milestone
Description
Describe the bug
When using the range slider with a screen reader, users are left without context. Because sliders rely on context from their implementation, we should allow devs to provide additional context to for screen readers.
Steps to reproduce the bug
- Visit the range slider component page // This link is from USWDS - Range: Remove redundant ARIA attributes #5413 which improved screen reader functionality of the component
- Turn on screen reader
- Increase/decrease slider
- Listen to readouts
There currently is no way to add units of measurement to these readouts
Expected Behavior
Devs should be able to customize callouts to fit the need of their component.
Examples:
- Percentages
- Satisfaction rating (4 out of 5)
- Temperature
Really any context that visual users might have, the screen reader should readout on input changes
An additional potential enhancement discussed with @amycole501 would be to also read out the position of the slider in terms of how far along the range it is.
For example, "4 out of 5 stars (80% of available range)".
Related code
No response
Screenshots
No response
System setup
No response
Additional context
No response
Code of Conduct
- I agree to follow this project's Code of Conduct.
- I checked the current issues for duplicate bug reports.
Metadata
Metadata
Assignees
Labels
Affects: Accessibility 🟡Relates to the accessibility of our componentsRelates to the accessibility of our componentsAffects: Markup 🟡Suggestion would change the markup of a componentSuggestion would change the markup of a componentPackage: Range SliderRole: DevDevelopment/engineering skills neededDevelopment/engineering skills needed
Type
Projects
Status
Done