New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Test form elements with assistive technology #3

Open
rianrietveld opened this Issue Jan 23, 2017 · 7 comments

Comments

Projects
None yet
4 participants
@rianrietveld
Member

rianrietveld commented Jan 23, 2017

Research how well assistive technology handles form elements.
This research will be used to improve the Settings API in WordPress Admin.

Related: https://make.wordpress.org/accessibility/2017/01/16/testing-form-functionality-with-different-assistive-technology/

The current forms and part of the forms are translated into plain HTML on
https://wpaccessibility.github.io/test-forms/ for testing.

NB: if you join the tests:

  • For NVDA: only test with FireFox
  • You don't have to test with ChromeVox
@rianrietveld

This comment has been minimized.

Member

rianrietveld commented Jan 23, 2017

@ewaccess did Dragon testing on http://www.456bereastreet.com/lab/html5-input-types/ with the conclusion: Dragon fails several HTML5 input types. Several require keydown.

@StommePoes

This comment has been minimized.

Collaborator

StommePoes commented Jan 23, 2017

I'm going to fork the wp page version with some more input variation (just haven't had time, $work is crunching) and see if there are some Dragon differences. Might as well test Orca too :)

@ewaccess

This comment has been minimized.

ewaccess commented Jan 24, 2017

Here's a quick video of my testing HTML5 <input type="date">.

I found the following on Chrome 55 and Firefox 51:

Supported

  • search

  • tel

Not Supported

  • color

  • date

  • datetime

  • datetime-local

  • number

  • range

  • time

  • url

  • week

Partially Supported

  • email

Supported: I could set focus to the input by voice and dictate text within it.
Not Supported: I could not set focus to the input by voice. Once focused (using the "press tab" command) I could not input text by voice. I could only send keystrokes by voice using the "press [key]" command.
Partially Supported I could set focus to the input by voice, but could only enter text by sending keystrokes.

I also did testing on Edge (Windows 10, version 1607) even though Dragon is not compatible with Edge. Using Edge, <input type="email"> will accept freeform text input using Windows Speech Recognition. The other HTML5 input types all require keyboard interaction.

Hope this helps!

@rianrietveld

This comment has been minimized.

Member

rianrietveld commented Jan 30, 2017

@ewaccess I just send out an additional test to the test team, stole/forked the page you made for this.
If we have more data I'll write an additional post with the results for it after February 11.

@abrightclearweb

This comment has been minimized.

abrightclearweb commented Jan 30, 2017

I've tested the Settings > General and Settings > Discussion forms with VoiceOver on Safari. Using a Scottish female voice. :)

Videos of testing

General Settings: https://youtu.be/natQHmHooUw
Discussion Settings: https://youtu.be/LrMeWik7QWY

Most of the time I tabbed through the forms with the keyboard. Here's what I noticed.

General Settings

  • Legend is read out after the form control.

  • After checking a checkbox control, tabbing to the next control seemed to miss out a control e.g. I went from checked Anyone can register checkbox to Site Language, missing out New User Default Role.

  • Site Language menu

  1. has 90 items!
  2. Installed is not read out
  3. VoiceOver doesn't read text it doesn't recognise e.g. Russian or Arabic. Blind users wouldn't know what these options are.
  • The text "Universal time (UTC) is 2017-01-16 17:54:13. Local time is 2017-01-16 18:54:13. This timezone is currently in standard time. Daylight saving time begins on: March 26, 2017 1:00 am." is not read out when tabbing through the form.

  • Date format - VoiceOver doesn't read out dashes, but does read slashes.

  • Custom date format - can tab to this field without selecting an option from the radio buttons above. It shouldn't be selectable unless that option is selected, otherwise it won't be applied.

  • No distinction made by VoiceOver between 6:54 pmg:i a (lowercase pm) and 6:54 PMg:i A (uppercase PM). An unsighted user wouldn't know the difference.

  • Documentation on date and time formatting link is too far down, after the date and time group selections.

  • Text is read differently when typed ("one two") as opposed to stepped through with the arrow keys ("twelve").

Discussion Settings

  • Similar issues with checked checkboxes and tabbing to the next - the cursor moves down but the focus does not.

  • I didn't hear the form label for the Comments page displayed by default, just the dropdown options (might just have been tabbing too fast).

  • The text "An avatar is an image that follows you from weblog to weblog appearing beside your name when you comment on avatar enabled sites. Here you can enable the display of avatars for people who comment on your site." is not read out when tabbing through the controls.

@rianrietveld

This comment has been minimized.

Member

rianrietveld commented Feb 6, 2017

Thanks @abrightclearweb !

@yatil yatil referenced this issue Feb 12, 2017

Closed

Label guidance #416

@rianrietveld

This comment has been minimized.

Member

rianrietveld commented Feb 13, 2017

Results for testing HTML5 type attributes are on make/accessibility now: https://make.wordpress.org/accessibility/2017/02/13/testing-html5-type-attributes-in-forms-with-different-browsers-and-at/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment