Success Criterion 4.1.2
Conformance level A

Live Value Update With No Way for Screen Readers to Detect It

4.1.2 — Name, Role, Value

Scenario

Setting

A bank's mobile money-transfer screen

What’s wrong

Live-updating values (counters, cart totals) changing without any programmatic notification path where the control's value is the thing changing.

Example

<div class="checkbox" onclick="toggle()"></div>

Why it matters

Screen-reader and voice-control users who can operate only what the accessibility tree exposes.

How to test

Change a control's value (e.g., a cart total, a counter) and check whether a screen reader is informed via appropriate role/value semantics or a live region — silent updates fail.

How to fix

Expose value changes programmatically (proper role with value semantics, or a live region (code that makes screen readers announce updates) announcing the update).

<input type="checkbox" id="opt-1">

<label for="opt-1">Email notifications</label>

A native input exposes its role and checked state automatically; a styled div exposes none of that without a lot of manual ARIA.

Outcome

On a bank's mobile money-transfer screen, this barrier is gone for screen-reader and voice-control users who can operate only what the accessibility tree exposes — they get the same result as anyone else here.

Who is affected