2023-10-16 09:40:32 +00:00

32 lines
1.0 KiB
Plaintext

== Why is this an issue?
include::../../../shared_content/jsts/aria-intro-1.adoc[]
This rule checks that ARIA roles or `aria-*` attributes are not used in unsupported DOM elements, which are mostly invisible such as `meta`, `html` or `head`.
== How to fix it in JSX
Check if you are using ARIA roles or `aria-*` attributes in unsupported DOM elements.
[source,javascript,diff-id=1,diff-type=noncompliant]
----
<title aria-hidden="false">My beautiful web page</title>
----
To fix the code, remove the extra ARIA role or `aria-*` attributes from the unsupported DOM elements.
[source,javascript,diff-id=1,diff-type=compliant]
----
<title>My beautiful web page</title>
----
== Resources
=== Documentation
* https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques[MDN - Using ARIA: Roles, states, and properties]
* https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles[MDN - ARIA roles (Reference)]
=== Standards
* https://www.w3.org/TR/wai-aria-1.2/[W3C - Accessible Rich Internet Applications (WAI-ARIA) 1.2]