Ensures Elements With an ARIA Role That Requires Parent Roles Are Contained By Them

Certain ARIA roles must be contained by particular parent roles in order for the necessary accessibility functions to be performed. 

Why It Matters

Elements that contain ARIA role values but are missing the required parent element role values will not allow assistive technology to function as needed.

When conveying context to the user of assistive technology in the form of a hierarchy, and the hierarchy is not the same as the code structure or DOM tree, relationship information cannot be provided without the use of ARIA role parent elements. 

Fixing the Issue

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

The relationship properties available in ARIA are the following:

• 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

Test Cases

For more examples, visit the W3C’s GitHub’s ATC Rules library.