carbon icon indicating copy to clipboard operation
carbon copied to clipboard

Accessibility: Screen reader not prioritising multi-action button drop down buttons when shown - Serious

Open adamfsage opened this issue 4 months ago • 1 comments

Description

When using a screenreader on Mac, after clicking on a multiaction button and moving forward it will go through the rest of the DOM first before reading the drop down buttons

Reproduction

https://carbon.sage.com/?path=/story/multi-action-button--button-types

Steps to reproduce

Start screenreader and open first drop down, then cycle through elements. Should look like this

https://github.com/user-attachments/assets/4b5eb6c7-f440-421b-a587-39ad37262837

JIRA ticket numbers (Sage only)

SBS-109907

Suggested solution

It looks like using absolute styling on this might be causing ordering issues in the DOM, further more it looks the dropdown options seems to appear in the HTML much further down than the initial button. Making it so that these are together should resolve this

Carbon version

142.13.5

Design tokens version

4.29.0

Relevant browsers

Chrome, Safari

Relevant OSs

MacOS

Additional context

No response

Confidentiality

  • [X] I confirm there is no confidential or commercially sensitive information included.

adamfsage avatar Oct 09 '24 10:10 adamfsage