valid-role
A misspelled role, or an abstract one browsers ignore.
The same idea as valid-aria, for the role prop, checked against the concrete roles in WAI-ARIA 1.2:
Div({ role: "buton" });
// ^ not an ARIA role. Did you mean "button"?
ARIA lets role hold a space-separated fallback list and uses the first role the browser understands, so every token is checked and the suggestion rewrites only the one that was wrong.
Abstract roles get a message of their own. They exist to organise the ARIA taxonomy, authors are not allowed to use them, and browsers ignore them — but they read like plausible roles, which is exactly why they end up in code:
Div({ role: "widget" });
// ^ abstract role; it does nothing on an element
As with valid-aria, only string literals are checked, and role bound to a signal is left alone.
Options
"implementjs/valid-role": ["error", { extraRoles: ["doc-chapter"] }]
extraRoles adds roles from a vocabulary outside core ARIA — DPUB-ARIA and graphics-aria are the usual reasons.