ARIA
Some roles require a specific parent
- Rule:
aria-required-parent - Severity: Critical
- WCAG level A
Why it matters
A role="tab" outside a tablist, or a listitem outside a list, has no context. Assistive technology cannot say "tab 2 of 5" because it does not know what the element belongs to.
How to fix it
- Wrap the children in an element with the parent role the specification requires.
- Keep the relationship direct — an intervening div needs role="presentation".
- If there is no such parent in the design, the child role is the wrong one.
In markup
<div>
<button role="tab">Overview</button>
</div><div role="tablist">
<button role="tab" aria-selected="true">Overview</button>
</div>The requirement behind it
This rule is one way of failing the following WCAG 2.2 success criteria. The W3C, which writes the standard, explains each of them:
- 1.3.1 Info and Relationships (opens in new tab) — WCAG level A
Further reading
Deque University on aria-required-parent (opens in new tab)
Deque maintains axe-core, the open-source engine our scanner runs. Their page documents the rule as the engine implements it.
Automated checks find failures a browser can prove. They cannot judge whether a caption is accurate, whether an alt text is useful, or whether a page can be operated end to end with a keyboard — those need a person.