← All rules

ARIA

ARIA attribute values must be valid

• Rule: aria-valid-attr-value
• Severity: Critical
• WCAG level A

Why it matters

aria-labelledby pointing at an id that does not exist leaves the element with no name at all, and an invalid state value ("aria-expanded=‘open’") is treated as absent. The markup looks right and does nothing.

How to fix it

1. Check that every id referenced by aria-labelledby, aria-describedby or aria-controls exists on the page.
2. Use the exact token values the specification allows: true, false, mixed, undefined.
3. Watch for ids generated per component — a duplicated or re-rendered id is the usual cause.

In markup

<input aria-labelledby="email-label">
<!-- no element with id="email-label" -->

<span id="email-label">Email</span>
<input aria-labelledby="email-label">

The requirement behind it

This rule is one way of failing the following WCAG 2.2 success criteria. The W3C, which writes the standard, explains each of them:

• 4.1.2 Name, Role, Value (opens in new tab) — WCAG level A

Further reading

Deque University on aria-valid-attr-value (opens in new tab)

Deque maintains axe-core, the open-source engine our scanner runs. Their page documents the rule as the engine implements it.

Automated checks find failures a browser can prove. They cannot judge whether a caption is accurate, whether an alt text is useful, or whether a page can be operated end to end with a keyboard — those need a person.