Ensures Elements with ARIA roles Have All Required ARIA Attributes

Yotam Flohr
Researcher
Blind Low vision Hearing Mobility
WCAG 2.1 Level A

Written and researched for humans by humans

Yotam Flohr
Researcher
Ritvik Shrivastava
Expertly reviewed by
Comments: 0
Your entire domain
Get detailed instructions on how to resolve every accessibility issue on your website

Web accessibility standards state that ARIA widget roles must have appropriate attributes describing the state or properties of the widget.

Why It Matters

ARIA widget roles require additional attributes that describe the state of the widget. The state will not be communicated to users who rely on screen readers if a required attribute is omitted.

Fixing the Issue

Check that all elements with the role attribute to ensure the required attributes are defined and add them where necessary.

More information about which ARIA role, state, and property attributes are allowed by role, can be found here: Accessible Rich Internet Applications (WAI-ARIA) 1.1 – Supported States and Properties.

When widget roles are mapped to platform accessibility API states, any property or state attributes that are required must be specified so that assistive technologies can relay the purpose of the element to users.

These properties and states apply to user interface elements such as alert, alertdialog, menu, progressbar, tooltip, and other widgets.

  • Properties
    • aria-autocomplete
    • aria-haspopup
    • aria-label
    • aria-level
    • aria-multiline
    • aria-multiselectable
    • aria-orientation
    • aria-readonly
    • aria-required
    • aria-sort
    • aria-valuemax
    • aria-valuemin
    • aria-valuenow
    • Aria-valuetext
  • States
    • aria-checked
    • aria-disabled
    • aria-expanded
    • aria-hidden
    • aria-invalid
    • aria-pressed
    • aria-selected

Test Cases

For further examples, visit W3C’s GitHub’s ATC Rules library