[rating] Screen reader announces incorrect value for maximum amount of stars
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 99.1k
- Forks
- 32.5k
- Avg merge
- 2d 17h
- Merged PRs (30d)
- 106
Description
Steps to reproduce
Link to live example: https://codesandbox.io/embed/dazzling-surf-4dgzp6?fontsize=14&hidenavigation=1&theme=d
Prerequisites
- A screen reader application, e.g. NVDA (Windows) or Voiceover (IOS), is used
Steps:
- Click on one of the stars (1-5) to give a rating, say the 2nd star to give a two-star rating
Current behavior
The screen reader announces the maximum value of the rating incorrectly.
Firefox
The screen reader announces "two of six", when max amount is actually 5.
Presumably, the value 6 comes from the number of radio inputs (on for each star, one for zero stars) in the component. By adding aria-hidden="true" with developer tools to the zero input, the max value is read correctly.
Chrome, Edge
The screen reader announces "two of seventeen" (!).
For these browsers, the number 17 perhaps comes from the number of inputs on the page?
Expected behavior
The screen reader should announce the max. value correctly, "two of five" in this case.
Context
We use MUI Rating to allow users to provide feedback on the digital services of a large public sector institution. The accessibility of the services is naturally very important.
Your environment
npx @mui/envinfo
System:
OS: Windows 10 10.0.19045
Binaries:
Node: 20.5.1 - C:\Program Files\nodejs\node.EXE
npm: 9.8.0 - C:\Program Files\nodejs\npm.CMD
pnpm: Not Found
Browsers:
Chrome: Not Found
Edge: Chromium (123.0.2420.97)
npmPackages:
@emotion/react: 11.10.5 => 11.10.5
@emotion/styled: 11.10.5 => 11.10.5
@mui/base: 5.0.0-beta.18
@mui/core-downloads-tracker: 5.14.10
@mui/icons-material: 5.11.9 => 5.11.9
@mui/material: 5.11.9 => 5.11.9
@mui/private-theming: 5.14.10
@mui/styled-engine: 5.14.10
@mui/system: 5.14.10
@mui/types: 7.2.5
@mui/utils: 5.14.12
@mui/x-date-pickers: 6.16.1 => 6.16.1
@types/react: 18.2.20 => 18.2.20
react: 18.2.0 => 18.2.0
react-dom: 18.2.0 => 18.2.0
typescript: 5.2.2 => 5.2.2
Search keywords: rating nvda reader
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Assessment
This issue has not been assessed yet.