Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Tab]: VoiceOver does not announce number of tabs #5083

Closed
janhassel opened this issue Jan 17, 2020 · 0 comments · Fixed by #5173
Closed

[Tab]: VoiceOver does not announce number of tabs #5083

janhassel opened this issue Jan 17, 2020 · 0 comments · Fixed by #5173
Labels
browser: chrome component: tabs package: react carbon-components-react severity: 1 https://ibm.biz/carbon-severity type: a11y ♿

Comments

@janhassel
Copy link
Member

Environment

Operating system
macOS 10.14.6

Browser
Chrome 79

Assistive technology used to verify
VoiceOver

Detailed description

What version of the Carbon Design System are you using?
[email protected]

What did you expect to happen?
When tabbing through tabs, VoiceOver should announce the number tabs in this group, e.g. "[label], selected, tab, 4 of 4"

What happened instead?
VoiceOver always announces the current tab as 1 of 1.

What WCAG 2.1 checkpoint does the issue violate?

Steps to reproduce the issue

  1. Open http://react.carbondesignsystem.com/?path=/story/tabs--default
  2. Click a tab
  3. Activate VoiceOver
  4. Tab between the tabs

Additional information

carbon-tab
@abbeyhrt abbeyhrt added component: tabs impact: low severity: 1 https://ibm.biz/carbon-severity browser: chrome package: react carbon-components-react labels Jan 17, 2020
asudoh added a commit to asudoh/carbon-components that referenced this issue Jan 24, 2020
@asudoh
fix(Tab): hoist tab role to upper element
6b4e259 
This change hoists `tab` role and its associated ARIA attributes from
`<a>` to `<li>`, given putting `tab` role to `<a>` makes VoiceOver
think it's a single tab in a container.

No new DAP error is observed by this change.

Fixes carbon-design-system#5083.
@asudoh asudoh mentioned this issue Jan 24, 2020
Merged
asudoh added a commit that referenced this issue Jan 31, 2020
@asudoh
fix(Tab): hoist tab role to upper element (#5173)
d6a36a9 
This change hoists `tab` role and its associated ARIA attributes from
`<a>` to `<li>`, given putting `tab` role to `<a>` makes VoiceOver
think it's a single tab in a container.

No new DAP error is observed by this change.

Fixes #5083.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
browser: chrome component: tabs package: react carbon-components-react severity: 1 https://ibm.biz/carbon-severity type: a11y ♿
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(Tab): hoist tab role to upper element asudoh/carbon-components
2 participants
@abbeyhrt @janhassel