Fix aria-allowed-attr axe errors
An element uses an ARIA attribute that its current role does not support, so the intended state may not be exposed consistently.
Кого затрагивает
Screen-reader and other assistive-technology users who depend on role-specific states and properties.
Связь с WCAG
4.1.2 Name, Role, Value (A)
Обнаружение
wcagc checks each rendered element's role against the ARIA attributes that axe-core permits for that role.
Почему возникает эта ошибка
- A checkbox-specific state is copied onto a button or link.
- A component changes its role but retains attributes from the old role.
- A generic prop spread applies every ARIA state to every element.
Проблемная разметка
<button aria-checked="true">Mute</button>Исправленный код
<button type="button" aria-pressed="true">Mute</button>Проверьте исправление вручную
Inspect the accessibility tree and toggle the control. Confirm that its role and changing state are announced together and that the same state is visually apparent.
Границы автоматизации
Passing this rule does not show that the chosen role is appropriate for the interaction or that state changes are kept synchronized by application code.
Источники и стандарты
Метаданные правила и ссылка Deque генерируются из axe-core 4.12.1. Ссылка W3C ведёт на нормативное руководство WCAG для соответствующего критерия.
Вопросы разработчиков
Should I change the role or remove the attribute?
Start from the intended interaction. Prefer the matching native element; otherwise use the correct ARIA role and only the states that role supports.
Is aria-checked valid on a button?
Not for a native button. A toggle button normally uses aria-pressed, while checkbox-style widgets use checked semantics.
Одно нарушение редко встречается в одиночку
Запустите проверку страницы в wcagc, чтобы найти это правило, связанные проблемы WCAG, затронутые селекторы и пункты, требующие ручной оценки.
Проверить страницу