Placeholder Text should be read in TextArea

[aphelionz]

Steps to reproduce (assumes ChromeVox or similar)

1. Open https://elastic.github.io/eui/#/forms/form-controls in a new tab.
2. Tab to the first textarea under the "Textarea" heading.

Actual Result

"textarea"

Expected Result

"Placeholder text textarea"

Category: #781: Elastic UI Form Controls Accessibility
Relevant WCAG Criteria: 3.3.2 Labels or Instructions

[timroes]

This is the regular HTML5 placeholder attribute. So if the screenreader doesn't read it, that's just the way it works. I think the actual issue here is, that people often consider the placeholder to be an equivalent to the label, which it isn't. I think this issue falls in the general category: force people to label their input fields. I am not sure if we can build up a proper prop validation for that, since when being inside a EuiFormRow the label should be set by this, if not we would require the author to manually specify an aria-label that labels the textarea.

For whoever fixes that ticket: we should at least add aria-label to all of those textareas.

[snide]

Think you might have a chromevox bug. This works fine in generic mac voiceover and reads the placeholder. Agree with tim, but that's more policy / guideline than code.

I'll add aria-labels to these examples without form row though.