Accessibility features, aria?

[gaby64]

I cannot find anything in the documentation related to this.

what im missing is aria-invalid

[logaretm]

Please make sure to keep questions here in the discussions section instead of creating an issue.

to answer your question, this isn't implemented yet in v4, so you need to apply the aria attributes yourself for now.

[gaby64]

ok, thanks

I did not know about githubs discussion feature

[klmader]

Hello! Just to confirm, aria attributes still aren't implemented yet in v4, correct?

I'm trying to migrate an app from Vue 2 to Vue 3 (and therefore VeeValidate 2 -> 4). I just realized we have some CSS attribute selectors that used to add a red inner border if aria-invalid was set on a given input (done automatically by VeeValidate).

Thoughts on another obvious attribute still available that I might rely on in aria-invalid's absence?

If not, I imagine I'll try to use the meta.valid info to add a conditional class. But would be curious of that sounds like a worse idea than another obvious solution.

Also, thank you kindly for your great work on this package!

[logaretm]

Yes, v4 is minimal on features. However, I will be adding guides to the docs soon on how to add back aria, classes with minimal effort. Should be up by the weekend ends hopefully.

[klmader]

Thank you kindly!

I assume you already have a plan in place for how to make this work, but in case you need to invent one, one way I've found of doing it so far is to add an additional attribute to each of those inputs a la:

aria-invalid="!!errors['name_of_associated_html_element']"

I imagine the ideal API for this would involve some higher-level setting so that you can turn it on / off with all fields, but figured it was worth mentioning in case you or anyone else needs this in lieu of better options.