VoiceOver reads out "selected" after each mat-option inside mat-select

[crisbeto]

I noticed this after updating to Big Sur and trying out mat-select with VoiceOver. While navigating through the list of options, VoiceOver reads out something like "Coffee, selected (5 of 10)" for every single option. My first thought was that it might be due to the fact that we remove aria-selected from unselected options in order to reduce noise, but the behavior got even weirder once I got it to set aria-selected="false". Now VoiceOver started reading out both "not selected" and "selected" for each option, e.g. "Coffee not selected, selected (5 of 10)". We'll have to investigate this, because I don't see anything obvious that could be causing it. My best bet is that there's a random "selected" string somewhere in the DOM that is being picked up by VoiceOver.

[allan-chen]

Probably need to file a bug on voiceover for this one - appears to be a regression since Big Sur. We're able to reproduce this on canonical examples as well: https://codepen.io/smhigley/pen/gObMVzv

[Splaktar]

I emailed this over to [email protected] to report it after not finding it in the list of reported issues on https://www.applevis.com/bugs/macos-active.

[Splaktar]

Response:

Thank you for your email and including a link that provided the technical details we require. We appreciate you taking the time to bring this to our attention, and have passed this information along to the appropriate team for consideration.

Sincerely,

Apple Accessibility

[zarend]

Hello folks,

I looked at the a11y tree that we're producing for Select component. Looks like we're putting aria-selected="true" on every option. That would explain why VoiceOver is reading them all as selected.

For fixing, I recommend changing how we set aria-selected to align with how we did it for MDC Chips and MDC List component.

• If an option is not selectable, omit aria-selected attribute
• If option is not selected, put aria-selected="false"
• If option is selected, put aria-selected="true"

-Zach

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}