Failed form validation must surface a visible or programmatic error
Rule
form-error-visible· Forms · impact moderate · Live only (static → incomplete)
Why it matters
Static analysis can only inspect error markup already present in the DOM — whether a site actually SURFACES its validation errors is runtime behavior. The engine safely triggers each visible form’s validation (form.checkValidity(), which fires the invalid events frameworks render their error UI from but never submits or navigates) and then checks every invalid field: did it gain aria-invalid="true", or did an error message become readable (an aria-errormessage/aria-describedby target, or new visible text next to the field)? A field left with NEITHER signal — in a form that reacted to the check (rendered some error UI, or suppressed the browser’s native error bubbles by calling preventDefault() on the invalid event) — means the error is not conveyed for this field: screen-reader users hear nothing and sighted users see nothing at that field. Forms that show no reaction at all are not judged (many sites validate only on real submission, which the probe never performs).
How to fix
In your invalid/submit validation handler, set aria-invalid="true" on each failing field and render a text error message associated via aria-errormessage or aria-describedby (visible next to the field).
Example
<form novalidate><label for="fe1">Email</label><input id="fe1" type="email" required><button type="submit">Send</button></form>
<form novalidate><label for="fe2">Email</label><input id="fe2" type="email" required aria-invalid="true" aria-describedby="fe2-err"><span id="fe2-err">Enter your email address.</span><button type="submit">Send</button></form>
Live check: the bad form’s script intercepts validation (e.g. novalidate + a custom handler) but renders no error text and never sets aria-invalid — the user is told nothing about what failed.
WCAG success criteria
3.3.1 Error Identification — Level A
When an input error is detected, the field in error must be identified and the error described to the user in text.
Standards
This rule contributes to the following standards:
WCAG A EN 301 549
| Standard | Criteria |
|---|---|
| EN 301 549 | 9.3.3.1 |