slider-name-present

Sliders have an accessible name

Checks that sliders (input[type="range"] and role="slider") expose a non-empty accessible name.

Applies to. Applies to elements carrying role="slider" (the attribute must name that role alone, not a fallback list) that are included in the accessibility tree. An element with the matching implicit role but no role attribute is out of scope. A native <input type="range"> without the role belongs to form-control-programmatic-label-present.

Expectation. The element has a non-empty accessible name from aria-label, from an aria-labelledby that resolves to non-empty text, or from title. role="slider" is name-from-author-only, so subtree text is never accepted: text sitting inside a custom slider widget is not reliably exposed as its name. On a labelable element (<input role="slider">) an associated <label> counts as well.

Examples

<input type="range" aria-label="Volume">

<div role="slider" tabindex="0" aria-valuenow="5" aria-valuemin="0" aria-valuemax="10"></div>

View source