HTML input type="file" element test
Test
- The label should be announced
- The purpose of the element ("file upload" or choose a file") should be announced
- input type="file" elements with required attribute should be announced as "Required"
- input type="file" elements with aria-required="true" attribute should be announced as "Required"
Example
Code sample
OS | Browser | NVDA 2014.4 | JAWS 16 | VoiceOver |
---|---|---|---|---|
Windows 7 | IE 11 |
Example 1: "Portfolio. Edit. Read only. Enter name of file to upload. Blank" "Portfolio button. Browse." Example 1: "Photo. Edit. Read only. Enter name of file to upload. Blank" "Photo button. Browse." Required not announced Example 1: "File. Edit. Read only. Required. Enter name of file to upload. Blank" "File button. Required. Browse. Example 1: "Document. Edit. Read only. Required. Enter name of file to upload. Blank" "Document button. Required. Browse. |
Example 1: "Portfolio. File. Upload. Edit. Enter name of file to upload" "File upload edit. Browse..." Example 1: "Photo. File. Upload. Edit. Enter name of file to upload" "File upload edit. Browse..." Required not announced Example 1: "File. File. Upload. Edit. Required. Enter name of file to upload" "File upload edit. Browse..." Example 1: "Document. File. Upload. Edit. Required. Enter name of file to upload" "File upload edit. Browse..." |
|
Windows 7 | IE 8 |
Example 1: "Portfolio. Edit. Read only. Enter name of file to upload. Blank" "Portfolio button. Browse." Example 1: "Photo. Edit. Read only. Enter name of file to upload. Blank" "Photo button. Browse." Required not announced Example 1: "File. Edit. Read only. Required. Enter name of file to upload. Blank" "File button. Required. Browse. Example 1: "Document. Edit. Read only. Required. Enter name of file to upload. Blank" "Document button. Required. Browse. |
Example 1: "Portfolio. File. Upload. Edit. Enter name of file to upload" "File upload edit. Browse..." Example 1: "Photo. File. Upload. Edit. Enter name of file to upload" "File upload edit. Browse..." Required not announced Example 1: "File. File. Upload. Edit. Required. Enter name of file to upload" "File upload edit. Browse..." Example 1: "Document. File. Upload. Edit. Required. Enter name of file to upload" "File upload edit. Browse..." |
|
Windows 7 | Chrome 39 |
Example 1: "Choose file. Button" Example 1: "Choose file. Button. Required" Example 1: "Choose file. Button. Required" Example 1: "Choose file. Button. Required" |
Example 1: "Portfolio" Does not announce purpose Example 1: "Photo" Does not announce purpose Example 1: "File" Does not announce purpose Example 1: "Document" Does not announce purpose |
|
Windows 7 | Firefox 34 |
Example 1: "Browse. Button" Example 1: "Browse. Button. Invalid entry. Required" Example 1: "Browse. Button. Required" Example 1: "Browse. Button. Invalid entry. Required" |
Example 1: "Portfolio. Frame. Browser. Button. To activate press space bar" Example 1: "Photo. Frame. Required. Invalid entry. Browser. Button. Required. Invalid entry. To activate press space bar" Example 1: "File. Frame. Required. Browser. Button. Required. To activate press space bar" Example 1: "Document. Frame. Required. Invalid entry. Browser. Button. Required. Invalid entry. To activate press space bar" |
|
OSX 10.9 | Chrome 39 |
Example 1: "Choose file. Portfolio. Button" Example 1: "Choose file. Photo. Button" Required not announced Example 1: "Choose file. File. Button" Required not announced Example 1: "Choose file. Document. Button" Required not announced |
||
OSX 10.9 | Firefox 34 |
Example 1: "Browse... Portfolio. Button" Example 1: "Browse... Photo. Button" Required not announced Example 1: "Browse... File. Button" Required not announced Example 1: "Browse... Document. Button" Required not announced |
||
OSX 10.9 | Safari 7 |
Example 1: "No file selected. Portfolio. File. Upload button" Example 1: "No file selected. Photo. File. Upload button" Example 1: "No file selected. File. File. Upload button" Example 1: "No file selected. Document. File. Upload button" |