bug(material/select): when linear navigating to combobox element with voiceover, screen reader focus is lost when opening popup menu

[zarend]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

This issue is about when navigating to the select element a specific way, screen reader focus is lost when opening the popup menu. When linear navigating to the combobox element with VoiceOver, opening the popup causes screen reader focus to stay on the trigger

Reproduction

StackBlitz link:
Steps to reproduce:

1. with VoiceOver enabled, open https://material.angular.io/components/select/overview
2. Navigate to "Basic Select" demo
3. Tab to "Favorite Food"
4. (AT announces that it's the favorite food popup combobox)
5. CTRL + OPTION + SPACE + RIGHT
6. CTRL + OPTION + SPACE + LEFT
7. (AT gives same or very similar announcement to step 4)
8. "Click" or press space or CTRL + OPTION + SPACE to open menu

If unable to reproduce, try navigating using different methods with voiceover. Try navigating from before the popup to the popup and also try navigating pass the popup then back to it.

Expected Behavior

Popup menu opens and focus is on the popup menu

Actual Behavior

Popup menu visual opens but screen reader focus stays on the trigger. No communication made to screen reader.

This is confusing for Voice Over users. Expecting information to be communicated with two or more senses. Expecting focus to be handled correctly.

Environment

N/A

[zarend]

Hello, I looked into this today, and I am unable to find a fix.

Here's the approaches I've tried:

• tried putting aria-hidden on extraneous a11y tree nodes inside the combobox element. Sometimes voiceover gets confused on which a11y tree node to focus on, but that doesn't seem to be the cause of this bug
• tried adding a timeout of different lengths. this doesn't seem to be a timing issue to me
• tried removing aria-label and for/id references. I have VoiceOver get confused by extra arrow or circular references in a11y tree, but that doesn't seem to be happening here.

Focus is managed by using an aria-activedescendent to point from the combobox to the listbox options. It seems that VoiceOver is aware of the relationship, but it is strange that it works unless I navigate paste the combobox then back to the combobox.

This may be an issue with VoiceOver.

-Zach