spectrum-web-components icon indicating copy to clipboard operation
spectrum-web-components copied to clipboard

[Bug][a11y]: Tabs overflow component has action buttons that don't necessarily need keyboard focus

Open dineshy87 opened this issue 1 year ago • 2 comments

Code of conduct

  • [X] I agree to follow this project's code of conduct.

Impacted component(s)

sp-tabs-overflow

Expected behavior

Please take overflow related previous and next buttons out of taborder by using tabindex="-1" on them. They're also not labelled, so please add aria-label to both the buttons.

Actual behavior

Having tabstops before the tabs component to reveal any hidden tabs seems unnecessary. Keyboard users are able to use arrow keys to navigate through all the tabs and the visual affordance allows them to know that there are more tabs. For screen reader users, the number of tabs is already conveyed by the tablist. So, overall addition of two tabstops (for back and forward buttons) is not necessary. Even on mobile, using a screenreader, a user can go through all the tabs without needing to use these buttons.

Screenshots

No response

What browsers are you seeing the problem in?

No response

How can we reproduce this issue?

No response

Sample code that illustrates the problem

No response

Logs taken while reproducing problem

No response

dineshy87 avatar Jun 02 '23 20:06 dineshy87

@monkeyjabs, looks like I took us a little too far on this one 🙈. Could I convince you to check this out in you cozy post release haze that you've got coming up?

Westbrook avatar Jun 02 '23 20:06 Westbrook

@monkeyjabs, looks like I took us a little too far on this one 🙈. Could I convince you to check this out in you cozy post release haze that you've got coming up?

Can you provide some context on this comment @Westbrook ? 😅

najikahalsema avatar Jun 12 '23 21:06 najikahalsema