Screenreader navigation for flyouts with labels

[maribethb]

Check for duplicates

• I have searched for similar issues before opening a new one.

Description

Navigating flyouts with labels have problems:

• We announce labels as headings, so then experienced screenreader users expect to be able to navigate through them with the h key, but that doesn't work since they're not true headings and/or possibly because of using application role (I'm not sure of the technical details here)
• Confusion between headings and blocks, users try to press enter on a heading and nothing happens

Solutions:

• Create h/shift+h shortcuts to jump between headings in currently open flyout
• If enter is pressed on flyout heading (not a button or block), toast a hint that says "press h to skip to next label"

Things we considered but not choosing to implement at this time:

• It's potentially confusing that labels are included in the count of the number of items in the flyout (screenreaders read the number of items due to the aria role being list item). Potentially we could only include blocks, but flyouts can contain arbitrary items now, and we should be careful about special casing blocks like this. For now, leave it alone.
• Consider setting the label as "Heading, x" instead of "x, heading". This might make the difference between a heading called "Volume" and a block called volume more clear. But screenreaders usually announce the role after the name, so it's less consistent. Consider trying this later if the above changes don't help.

Reproduction steps

Priority

No response

Stack trace

Screenshots

No response

Browsers

No response