canonical / canonical/vanilla-framework
Tabs aria-selected is not supported on role link
- Dominant language
- HTML
- Stars
- 983
- Forks
- 216
- Avg merge
- 3d 13h
- Merged PRs (30d)
- 3
Description
**Describe the bug**
Tabs example suggests using semantics that's not supported and throws an accessibility error.
"aria-selected is not supported on role link"
We should investigate using different semantics when displaying tabs as links. Maybe we could use `aria-current="section"` instead?
**To Reproduce**
Steps to reproduce the behavior:
1. Go to https://vanillaframework.io/docs/patterns/tabs#navigation
2. Validate accessibility e.g. with axe devtools
3. See the error thrown
**Additional context**
https://www.stefanjudis.com/blog/aria-selected-and-when-to-use-it/#how-to-not(!)-use-%60aria-selected%60
https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected
https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current
Contributor guide
Research direction
Start at the tabs navigation example at vanilla-framework.io/docs/patterns/tabs#navigation and reproduce the aria-selected error with axe DevTools. Read the linked ARIA guidance, compare aria-selected with aria-current="section", and confirm the updated example passes accessibility validation.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- html
- Domain
- accessibility, documentation
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100