HTML input type="text" element test
Test
- The label should be announced.
- input type="text" elements with required attribute should be announced as "required"
- input type="text" elements with aria-required="true" attribute should be announced as "required"
Example
Code sample
<form method="get" action="#">
<div>
<label for="a">Name</label>
<input id="a" type="text">
</div>
<div>
<label for="b">Address</label>
<input id="b" type="text" required>
</div>
<div>
<label for="c">Phone</label>
<input id="c" type="text" required aria-required="true">
</div>
<div>
<label for="d">Street</label>
<input id="d" type="text" aria-required="true">
</div>
</form>
| OS | Browser | NVDA 2014.4 | JAWS 16 | VoiceOver |
|---|---|---|---|---|
| Windows 7 | IE 11 |
Example 1: Name. Edit. Blank Example 2: Address. Edit. Required. Blank Example 3: Phone. Edit. Required. Blank Example 4: Street. Edit. Required. Blank |
Example 1: Name. Edit. Type in text Example 2: Address. Edit. Type in text Required not announced Example 3: Phone. Edit. Required. Type in text Example 4: Street. Edit. Required. Type in text |
|
| Windows 7 | IE 8 | x | x | |
| Windows 7 | Chrome 39 |
Example 1: Name. Edit. Blank Example 2: Address. Edit. Required. Blank Example 3: Phone. Edit. Required. Blank Example 4: Street. Edit. Required. Blank |
Example 1: Name. Edit. Type in text Example 2: Address. Edit. Required. Type in text Example 3: Phone. Edit. Required. Type in text Example 4: Street. Edit. Required. Type in text |
|
| Windows 7 | Firefox 34 |
Example 1: Name. Edit with autocomplete. Blank Example 2: Address. Edit. Invalid entry. Required. Blank Example 3: Phone. Edit. Invalid Entry. Required. Blank Example 4: Street. Edit. Required. With autocomplete. Blank |
Example 1: Name. Edit. Type in text Example 2: Address. Edit. Required. Invalid entry. Type in text Example 3: Phone. Edit. Required. Invalid entry. Type in text Example 4: Street. Edit. Required. Type in text |
|
| OSX 10.9 | Chrome 39 |
Example 1: Name. Edit. text Example 2: Address. Required. Edit. text Example 3: Phone. Required. Edit. text Example 4: Street. Required. Edit. text |
||
| OSX 10.9 | Firefox 34 |
Example 1: Name. text Example 2: Address. Required. text Example 3: Phone. Required. text Example 4: Street. Required. text |
||
| OSX 10.9 | Safari 7 |
Example 1: Name. Edit. text Example 2: Address. Required. Edit. text Example 3: Phone. Required. Edit. text Example 4: Street. Required. Edit. text |