Repository navigation
Clarifying the allowed roles on an li element #1368
Description
ARIA in HTML is clarifying the allowed roles on li elements.
No
roleif the parent list element has an implicit or explicitlistrole.Otherwise, any
role.
NOTE: Seeul,ol, ormenufor allowed roles for list elements.
This update disallows any role on an li element so long as it is a child of a ul, ol or menu element and that element is exposed as an implicit or explicit role=list. Specifying a role of listitem on an li would produce a warning for unnecessary use of a redundant role.
However, if the parent ul, ol or menu has had its implicit list role overwritten, then the li may have any role so long as that role is an allowed role of its ancestor elements.
For example, the following li may have a role=button specified as the parent list element as a role=none
<ul role=none>
<li role="button" ...>...</li>
</ul>However, as the following ul has a role=menu specified, the role=button is not allowed. The only allowed roles for the li would be menuitem, menuitemcheckbox or menuitemradio.
<ul role=menu>
<li role=button>...</button>
</ul>similar to the following, as while the ul has a role=none, it is a child of a role=tablist, so therefor the li may only have a role that is an expected descendant of a tablist.
<div role=tablist>
<ul role=none>
<li role=button>...</li>
</ul>
</div>Finally, even though the following would be flagged for invalid HTML, the li is again allowed any role as it is exposed as a generic role when not correctly nested within a list element:
<article>
....
<li role=paragraph>...</li>
...
</article>Additional test cases provided here.
Activity
sideshowbarker commentedon Nov 30, 2025
Can you point me to exactly where in the ARIA in HTML that requirement is stated?
At https://w3c.github.io/html-aria/#el-li the complete relevant requirements are in full:
Based just on those cited requirements, I would expect that
liis allowed to have any role — per the “the parentlistelement does not expose an implicit or explicitlistrole” condition.What am I missing?
For that also, could you point me to exactly where in the ARIA in HTML that requirement is stated?
…because based just on the
lirequirements above cited from the spec, I’d expect thatliis allowed to have any role.pkra commentedon Dec 1, 2025
It follows from ARIA:
buttonis not an Allowed Accessibility Child Role formenu, cf. https://w3c.github.io/aria/#menusideshowbarker commentedon Dec 1, 2025
OK, thanks — but I think those additional requirements should rightly also be explicitly stated (or referenced) in the ARIA in HTML spec too — at point of use at https://w3c.github.io/html-aria/#el-li.
I think the omission of an explicit such statement or reference at point of use in the ARIA in HTML spec would (mis)lead other checker implementors (not just me) into reasonably assuming that the requirements stated at that point in the ARIA in HTML spec are a complete statement of all the requirements.
pkra commentedon Dec 1, 2025
@sideshowbarker I think this is primarily covered in Section 5 https://w3c.github.io/html-aria/#allowed-descendants-of-aria-roles
However aria-in-html does not seem to use the current ARIA language (after w3c/aria#1454). I filed w3c/html-aria#561 to try to match this in aria-in-html.
sideshowbarker commentedon Dec 1, 2025
Ah indeed — thanks much, that looks like what I need.
Subscribed.
feat: Bring allowed “role” values for the “li” into accord with the spec