Success Criterion 4.1.2
Conformance level A
W3C reference F79

Assistive Technology Never Told Which Element Currently Has Focus

4.1.2 — Name, Role, Value

Scenario

Setting

A music streaming app's playlist screen

What’s wrong

Assistive technology is never told which element currently has focus, or that focus changed — screen readers lose track of the user's position.

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

Tab to a control and check DevTools' Accessibility panel: if the focused/unfocused state isn't exposed or announced, it fails.

How to fix

Use focusable native elements (or manage tabindex (keyboard-focus setting) + ARIA) so focus position and changes are exposed to assistive technology.

<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 music streaming app's playlist 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