aria-required-parent

Ensures elements with an ARIA role that require parent roles are contained by them.

Description

For the accessibility features to work as intended, specific ARIA roles must be contained by specific parent roles.

Why is it important?

To direct assistive technologies to handle an element differently than its default HTML element type, an element can be given an ARIA role property. For instance, a listbox control should consider a li element with the role="option" as a selectable option rather than a static list item.

If a child control’s managing control lacks the necessary parent function, people who use assistive technologies may find it challenging or impossible to use it.

Examples

• Success:
  • The role="menu" tag is used to identify the parent of the “menuitem” children. Users of assistive technologies are informed that a menu is the managing control. The parent element also has an “aria-label" attribute to give the menu a visible name. To eliminate the implied listitem role, all li elements should be marked with role="none".
• Failure:
  • The managed a elements have the necessary "parent" roles (for example menu or menubar), but the managing ul element is lacking the necessary "child" roles (menuitem). Some users are unable to interact with this code because assistive technologies cannot recognise it as a menu.

How to fix?

Ensure all ARIA roles are contained by their required parent element, if any.

The following relationship properties are available in ARIA:

• aria-activedescendant
• aria-controls (used primarily by elements where the role is group, region, or widget)
• aria-describedby
• aria-flowto (used primarily to provide alternate reading/tab order to skip past ads or complementary regions)
• aria-labelledby
• aria-owns (used primarily to identify which elements belong to the group)
• aria-posinset
• aria-setsize

Tags

cat.aria, wcag2a, wcag131

References

• WCAG 1.3.1: Info and Relationships
• Deque University: aria-required-parent
• Accessibility Insights: aria-required-parent
• Evinced Digital Accessibility Knowledge Base: aria-required-parent