O with occluded right edge to appear also as a C Open Web Components Guides Docs Blog Toggle darkmode

EsLint Plugin Lit A11y: role-has-required-aria-attrs

Enforce that elements with ARIA roles must have all required attributes for that role. Some ARIA roles require certain ARIA attributes to be present.

Rule Details

This rule aims to ensure the validity of the Accessibility Object Model.

Examples of incorrect code for this rule:

html` <span role="checkbox"></span> `;
html` <div role="combobox"></div> `;
html` <div role="slider"></div> `;

Examples of correct code for this rule:

html` <span role="alert" aria-atomic="foo" aria-live="foo"></span> `;
html` <span role="checkbox" aria-checked="false" aria-labelledby="foo" tabindex="0"></span> `;
html` <span role="row"></span> `;
html` <input type="checkbox" role="switch" aria-checked="true" /> `;
html` <div role="combobox" aria-controls="foo" aria-expanded="foo"></div> `;

When Not To Use It

If you do not use ARIA roles in your lit-html templates.

Further Reading