A single-select listbox must not have multiple selected options

Rule listbox-single-select · Component patterns (best practice) · impact serious · Static + live

↩ Back to the rules index · WCAG cross-reference

Why it matters#

A listbox that is not aria-multiselectable allows only one selected option. Multiple aria-selected="true" options send a contradictory state to assistive technology.

How to fix#

Set aria-multiselectable="true" if multiple selection is intended; otherwise keep aria-selected="true" on a single option.

Example#

<ul role="listbox"><li role="option" aria-selected="true">A</li><li role="option" aria-selected="true">B</li></ul>

<ul role="listbox"><li role="option" aria-selected="true">A</li><li role="option" aria-selected="false">B</li></ul>

WCAG success criteria#

4.1.2 Name, Role, Value — Level A#

Every UI component must expose a correct name, role, and (where relevant) state/value to assistive technology.

Understanding 4.1.2

Standards#

This rule contributes to the following standards:

WCAG A EN 301 549 Best practice

References#

• APG — Listbox