feat(ngAria): Announce ngMessages with aria-live #9834

Closed
wants to merge 1 commit into
from

Projects

None yet

8 participants

@marcysutton
Member

To be accessible, error messages shown with ngMessages should be read aloud in a screen reader. This can be easily accomplished by adding aria-live="assertive" to the ngMessages directive via ngAria.

Proof of concept in this Plunkr: http://plnkr.co/edit/6iFNWiSiRWz9y871v7oq

@mary-poppins mary-poppins added cla: yes and removed cla: no labels Oct 29, 2014
@Narretz Narretz added this to the Backlog milestone Nov 2, 2014
@matsko
Member
matsko commented Nov 3, 2014

@marcysutton what do you think?

@marcysutton
Member

@matsko I'm not sure why this got added to the backlog...it's such an easy win, and it has test coverage. Does it need benchmarks or something?

@kentcdodds
Member

+1

@matsko
Member
matsko commented Nov 5, 2014

@marcysutton not sure who triaged this one, but if you're good to take it over then go for it :)

@marcysutton
Member

@matsko I don't think I have Collaborator rights on this repo, only Angular Material. Is there someone else who can review and merge it?

@caitp
Contributor
caitp commented Nov 5, 2014

I'll take a look

@caitp
Contributor
caitp commented Nov 5, 2014

The proof of concept works for me (it's extremely annoying when typing in the field though!), that's pretty cool.

I'll land it.

@caitp caitp added a commit that closed this pull request Nov 5, 2014
@caitp Marcy Sutton + caitp feat(ngAria): announce ngMessages with aria-live
By including the `ngAria` module, `ngMessages` will automatically include the aria-live
attribute with an assertive voice, allowing validation messages to be spoken throuhg a
screenreader.

Closes #9834
187e431
@caitp caitp closed this in 187e431 Nov 5, 2014
@marcysutton
Member

Hmm, it read at an okay frequency when I made the demo. We could always change it to polite if assertive proves to be rude. :)

@caitp
Contributor
caitp commented Nov 5, 2014

the tone actually sounds okay, it's just the way it continuously repeats numbers you type in the field. I'm sure it would be less annoying if I couldn't see what I typed, though.

@realityking
Contributor

polite vs. assertive is not about the tone but whether the user should be interrupted (assertive) or to wait until the user is idle (polite).

I guess it depends a bit on how validation messages are used. We only show them after the first blur event or after the first attempt to submit, assertive is probably fine in this case. If the message is shown after the first user entry it might be very annoying.

@caitp
Contributor
caitp commented Nov 5, 2014

TIL, thanks! (however, I'm talking about the reading of the value in the input field, not the reading of the messages --- those sounded great on my mac with VoiceOver. The reading of the value got a bit crazy)

@joe-watkins

I'm wondering if there could be a way to allow for the author to choose Polite or Assertive rather than hardcode one or the other into ngAria?

Assertive interrupts everything that is being spoken.. and for form validation, or other use cases for that matter, could prove to be disorientating for some end users.

@marcysutton
Member

We can totally do that! It probably should have been configurable from the start, but that's an easy change.

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