ariaUnsupportedElements

Reports ARIA attributes on elements that don't support them.

✅ This rule is included in the jsx logical preset.

Specific reserved DOM elements do not support ARIA roles, states, and properties. Those elements generally are either not visible (like meta, script, style) or have specific semantic meaning (like body or html).

This is required for WCAG 4.1.2 compliance.

Examples

❌ Incorrect

<meta charset="UTF-8" aria-hidden="false" />

<script role="application" />

<style aria-label="styles" />

✅ Correct

<meta charset="UTF-8" />

<script src="app.js" />

<div role="button" />

When Not To Use It

You should always use this rule to ensure ARIA attributes are only applied to elements that support them.

Further Reading

• WCAG 4.1.2: Name, Role, Value
• Chrome Audit Rules, AX_ARIA_12

Equivalents in Other Linters

• ESLint: jsx-a11y/aria-unsupported-elements
• Oxlint: jsx_a11y/aria-unsupported-elements