aria-conditional-attr

aria-errormessage requires aria-invalid to be set to a non-false value

automaticWCAG 4.1.2 (A)confidence: highseverity: moderaterobust

Checks that elements with aria-errormessage also have aria-invalid set to "true", "grammar", or "spelling"; otherwise the error message is dropped from the accessibility tree.

Applies to. Elements with a non-empty `aria-errormessage` attribute.

Expectation. Per the ARIA specification, `aria-errormessage` is only exposed to assistive technology when `aria-invalid` is present with a value other than `"false"` (i.e. `"true"`, `"grammar"`, or `"spelling"`). An element with `aria-errormessage` but `aria-invalid` absent or `"false"` silently drops the error message from the accessibility tree, authors almost always intend it to be exposed. Reported at CANTTELL rather than FAIL: aria-errormessage is only exposed once aria-invalid is set, so the reference is currently inert. Whether that costs the user anything depends on whether the message is conveyed some other way (visible text next to the field, aria-describedby), which static markup does not settle.

Examples

pass
<input type="text" aria-invalid="true" aria-errormessage="err1">
<span id="err1">Enter a valid email address.</span>

`aria-invalid="true"` means `aria-errormessage` is actually exposed to assistive technology.

can't tell
<input type="text" aria-errormessage="err1">
<span id="err1">Enter a valid email address.</span>

Without `aria-invalid` set to a non-`"false"` value, `aria-errormessage` is never exposed — the reference is currently inert.

View source