fix(material/select): don't announce selected value multiple times #24831
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
mhaertwig
force-pushed
the
feature/select-accessibility2
branch
from
d29c328 to
bc44d03
Compare
mhaertwig
force-pushed
the
feature/select-accessibility2
branch
from
bc44d03 to
5144f43
Compare
Screen readers announce the selected value multiple times. NVDA e.g. reads "Favorite food Pizza Pizza combobox Pizza collapsed". 1. First, the Screen Reader (SR) reads the value of the label (see 1st `aria-labelledby`): "Favorite food" 2. SR reads the content of the combobox: "Pizza" 3. SR reads the value of the combobox (see 2nd `aria-labelledby`): "Pizza" 4. SR reads the content of the combobox again: "Pizza" To fix this, an `aria-hidden` attribute is added to the element containing the selected value. NVDA e.g. now reads "Favorite food Pizza combobox collapsed"
mhaertwig
force-pushed
the
feature/select-accessibility2
branch
from
5144f43 to
8f4d839
Compare
|
The accessible name of the combobox shouldn't contain the dropdown value as well. This is not best practice. Same for the label tag, it's unnecessary since it only works for native html (select and input). The aria-owns lets the screen reader know that despite the element being lower on the DOM, it should be focused on it first before the element it owns. So this should be kept. My suggestion for the fix would be:
|
|
bump |
josephperrott
requested review from
crisbeto and
amysorto
and removed request for
a team
|
Closing in favor of #30374 which tries to stop adding the selected option as an |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Screen readers announce the selected value multiple times. NVDA e.g. reads "Favorite food Pizza Pizza combobox Pizza collapsed".
aria-labelledby): "Favorite food"aria-ownsattribute): "Pizza"aria-labelledby): "Pizza"To fix this, an
aria-hiddenattribute is added to the element containing the selected value. NVDA e.g. now reads "Favorite food Pizza combobox collapsed".Successfully tested with NVDA, JAWS, Narrator and the Screen Reader Chrome plugin.
Closes #24899