Skip to content

html-aria-role-must-be-valid.md

Latest commit

 

History

History
45 lines (29 loc) · 1.24 KB

html-aria-role-must-be-valid.md

File metadata and controls

45 lines (29 loc) · 1.24 KB

Linter Rule: Disallow invalid values for the role attribute

Rule: html-aria-role-must-be-valid

Description

Disallow invalid or unknown values for the role attribute. The role attribute must match one of the recognized ARIA role values as defined by the WAI-ARIA specification.

Rationale

ARIA role attributes are used to define the purpose of an element to assistive technologies. Using invalid, misspelled, or non-standard roles results in:

  • Screen readers ignoring the role
  • Broken accessibility semantics
  • False sense of correctness

Validating against the official list of ARIA roles prevents silent accessibility failures.

Examples

✅ Good

<div role="button">Click me</div>
<nav role="navigation">...</nav>
<section role="region">...</section>

🚫 Bad

<!-- typo -->
<div role="buton">Click me</div>

<!-- not a valid role -->
<nav role="nav">...</nav>

<!-- not in the ARIA spec -->
<section role="header">...</section>

References