
ARIA Required Children
Checks composite ARIA widgets contain the child roles they need.
Install
npx skills add thedaviddias/Front-End-Checklist --skill aria-required-children -g -a claude-code -y- Repository
- thedaviddias/Front-End-Checklist74.6k
- Category
- Engineering
- Updated
- 4d ago
- License
- MIT
- Context cost
- Lightabout 772 tokens
- Runs scripts
- No, instructions only
What it does
Use when applies to custom ARIA widgets using composite roles: tablist, list, listbox, menu, menubar, tree, treegrid, grid, rowgroup, row, radiogroup. Use when reviewing components built with div/span elements that replace native HTML list, select, or nav elements.
Ensure ARIA roles contain required child roles
Screen readers like NVDA and VoiceOver navigate composite widgets (menus, tabs, trees) by moving between the required child roles. If a tablist contains <div> elements instead of role='tab', the user hears no tabs at all. JAWS announces 'list of 5 items' only when role='listitem' children exist inside role='list'. Without correct nesting, the entire widget becomes opaque to keyboard-only and screen reader users.
Quick Reference
- Container roles mandate specific owned child roles:
tablist→tab,list/listbox→listitem/option,menu/menubar→menuitem,tree→treeitem,grid/rowgroup→row - Missing required children break the accessibility tree so screen readers cannot enumerate items or announce counts
- Use
role='none'orrole='presentation'on purely structural wrapper elements inside the container to avoid invalid nesting - Applies to WAI-ARIA 1.2 required owned elements for composite widget roles
Check
Identify all elements with ARIA container roles (tablist, list, listbox, menu, menubar, tree, treegrid, grid, rowgroup, radiogroup). For each, verify it contains the required owned child roles per the WAI-ARIA spec: tablist must own tab elements; list must own listitem; listbox must own option; menu/menubar must own menuitem, menuitemcheckbox, or menuitemradio; tree must own treeitem; grid must own row (which owns gridcell); radiogroup must own radio. Flag any container roles missing required children.
