Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support the HTML inert attribute #3448

Closed
WilcoFiers opened this issue May 4, 2022 · 2 comments · Fixed by #3857 or #3894
Closed

Support the HTML inert attribute #3448

WilcoFiers opened this issue May 4, 2022 · 2 comments · Fixed by #3857 or #3894
Labels
core Issues in the core code (lib/core) feat New feature or enhancement pr A pr has been created for the issue
Milestone

Comments

@WilcoFiers
Copy link
Contributor

In Chrome 102 we're expecting the inert attribute to be supported. This has a number of implications for axe-core. I think we'll need to update a number of internal methods to understand this new attribute. I think since it's not going to be available to a number of other browsers yet a new rule that fails the use of inert unless it's polyfilled is probably also useful here.

@WilcoFiers WilcoFiers added feat New feature or enhancement core Issues in the core code (lib/core) labels May 4, 2022
@WilcoFiers WilcoFiers added this to the Axe-core 4.5 milestone May 4, 2022
@WilcoFiers WilcoFiers modified the milestones: Axe-core 4.5, Axe-core 4.6 May 20, 2022
@straker
Copy link
Contributor

straker commented Oct 11, 2022

This has full browser support without a polyfill except for Firefox, which has it supported in the latest nightly. https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert#browser_compatibility

@padmavemulapati
Copy link

padmavemulapati commented Jan 25, 2023

Validated with the latest axe-core develop branch code base,
inert attribute is a boolean value that, when present, makes the browser "ignore" user input events for the element, including focus events and events from assistive technologies.
Ex:

When not passing inert attribute for the below code snippet to fail for aria-hidden-focus , it is failing.

<div  id="violation" aria-hidden="true">
    <a href="/" style="position:absolute; top:-999em">Link</a>
  </div>

Image

but when we have inert attribute for the same this is allowing.

<div inert id="violation" aria-hidden="true">
    <a href="/" style="position:absolute; top:-999em">Link</a>
  </div>

Image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
core Issues in the core code (lib/core) feat New feature or enhancement pr A pr has been created for the issue
Projects
None yet
3 participants