Allow aria-invalid on any element?

[RoyalIcing]

Currently the toBeValid matcher whitelists what elements are allowed:

jest-dom/src/to-be-invalid.js

Line 4 in 5c9e8e5

const FORM_TAGS = ['form', 'input', 'select', 'textarea']

However, AFAIK the ARIA specification allows it on any element:

https://www.w3.org/TR/html-aria/#IDL-ValidityState

The aria-invalid attribute may be used on any HTML element that allows global aria-* attributes except for a submittable element that does not satisfy its validation constraints.

I propose removing the element tag check and allowing it on any element.

My specific issue is with a ol with role radiogroup that I am setting aria-invalid on.

[gnapse]

Yes, I agree. The script element type check should be only when considering the element's checkValidity() return value. But when checking for the presence of aria-invalid any element is ok.

[RoyalIcing]

How would you check if it supports checkValidity() — 'checkValidity' in element?

I am happy to work on this!

[gnapse]

How would you check if it supports checkValidity()

The part that checks what .checkValidity() returns should only be used if the element's type is one of those listed in the FORM_TAGS array. If it's not one of those, the only check that should be tested is the one about the presence of aria-invalid.

I am happy to work on this!

Go for it! And thanks! Thanks a lot.

[missilev]

@BurntCaramel Did you have a chance to work on it? If you are a bit busy now I can take it, I've just come up with a possible solution.

[gnapse]

🎉 This issue has been resolved in version 5.10.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀