Form errors are not read by the screen reader

[aphelionz]

Steps to reproduce (assumes ChromeVox or similar)

1. Open https://elastic.github.io/eui/#/forms/form-validation in a new tab.
2. Tab to the first (or any) field with an error indicator

Actual Result

The textarea is read as if it were a normal text area with no indicators

Expected Result

"text input error" at a minimum, "text input [informative error message]" would be ideal

Category: #781: Elastic UI Form Validation Accessibility
Relevant WCAG Criteria: 3.3.1 Error Identification

[timroes]

That's weird that they are not read out at all for you, because they are aria-describedby to the input field. Also the input field is in an invalid state, so VoiceOver usually at least reads out "invalid" to it.

Nevertheless in my opinion we should add aria-errormessage to the input element that reference the error messages (even though that is not yet supported by all screen readers). And use aria-describedby only for the actual description text.

[aphelionz]

"Invalid" technically passes, but is next to nothing in terms of helpful, operable feedback to a non-sighted user