`ActionList.Leading/TrailingVisual` is invisible to screen readers

[iansan5653]

ActionList renders items as a listitem with a button child. That button is labelled (via aria-labelledby) by the main content of the item.

This means that leading & trailing visuals are totally hidden from screen readers. That's fine when the visuals are purely decorative, but this is not always the case. A visual (particularly a trailing one) can indicate important information, such as:

• A keyboard shortcut (ref https://github.com/primer/react/pull/4750#discussion_r1705866754)
• A link vs an action
• Links that open in new tabs
• Links to external sites
• Actions that initiate downloads
• Favorited / emphasized items
• The state of an item
• An item count

Hiding this information from screen readers provides users of these tools with a limited experience compared to sighted users.

Possible solutions

• Add the leading and trailing visuals to the aria-labelledby attribute so they are included in the label. If they are unlabeled icons this should have no effect.
• Build a fully custom label string with the leading and trailing visuals, allowing us to include a separator for punctuation
• Remove the aria-labelledby attribute entirely so the button label is built from its contents as normal, automatically accounting for any text in the visuals

Risks

There is a risk here that consumers will have worked around the suppression by adding the context to the main content as visually-hidden text. Shipping a fix for this issue might then cause the context to be read twice.

[siddharthkp]

Leaving notes for triage

• @TylerJDev made TrailingVisual accessible to screen readers in https://github.com/primer/react/pull/4666
• LeadingVisual remains aria-hidden because we always assume it's decorative, @iansan5653 do you have use cases where that's not true?

[iansan5653]

👍 LeadingVisual is nearly always decorative and I can't think of any counterexamples. It's theoretically possible it could have useful content (maybe an unread indicator?) but probably not a priority to worry about.

[langermank]

Closing as it looks like this has been addressed. Feel free to reopen if necessary!