跳转到内容

useValidAriaRole

Diagnostic Category: lint/a11y/useValidAriaRole

Since: v1.4.0

Sources:

Elements with ARIA roles must use a valid, non-abstract ARIA role.

<div role="datepicker"></div>
code-block.jsx:1:1 lint/a11y/useValidAriaRole  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

Enforce that elements with ARIA roles must use a valid, non-abstract ARIA role.

> 1 │ <div role=“datepicker”></div>
^^^^^^^^^^^^^^^^^^^^^^^
2 │

Check WAI-ARIA for valid roles or provide options accordingly.

Unsafe fix: Remove the invalid role attribute.
Check the list of all valid role attributes.

1 │ <div·role=datepicker></div>
-----------------
<div role="range"></div>
code-block.jsx:1:1 lint/a11y/useValidAriaRole  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

Enforce that elements with ARIA roles must use a valid, non-abstract ARIA role.

> 1 │ <div role=“range”></div>
^^^^^^^^^^^^^^^^^^
2 │

Check WAI-ARIA for valid roles or provide options accordingly.

Unsafe fix: Remove the invalid role attribute.
Check the list of all valid role attributes.

1 │ <div·role=range></div>
------------
<div role=""></div>
code-block.jsx:1:1 lint/a11y/useValidAriaRole  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

Enforce that elements with ARIA roles must use a valid, non-abstract ARIA role.

> 1 │ <div role=""></div>
^^^^^^^^^^^^^
2 │

Check WAI-ARIA for valid roles or provide options accordingly.

Unsafe fix: Remove the invalid role attribute.
Check the list of all valid role attributes.

1 │ <div·role=""></div>
-------
<Foo role="foo"></Foo>
code-block.jsx:1:1 lint/a11y/useValidAriaRole  FIXABLE  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

Enforce that elements with ARIA roles must use a valid, non-abstract ARIA role.

> 1 │ <Foo role=“foo”></Foo>
^^^^^^^^^^^^^^^^
2 │

Check WAI-ARIA for valid roles or provide options accordingly.

Unsafe fix: Remove the invalid role attribute.
Check the list of all valid role attributes.

1 │ <Foo·role=foo></Foo>
----------
<>
<div role="button"></div>
<div role={role}></div>
<div></div>
</>
{
"//": "...",
"options": {
"allowInvalidRoles": ["invalid-role", "text"],
"nonIgnoreDom": true
}
}