Autocomplete accessibility: limit number of matches and highlighted items announced

[marcysutton]

Upon re-testing the autocomplete component, something happened to the messages array sent to our <aria-status> child directive causing all of the text to be appended and never removed. Inside of that component is an ng-repeat checking for messages:

<aria-status>
    <p ng-repeat="message in $mdAutocompleteCtrl.messages">{{message.display}}</p>\
</aria-status>

The messages array in autocompleteController.js now keeps appending messages without clearing upon change. Right now on focus the input reads "There are 50 matches available. There are 50 matches available." When you start typing and the list filters, it reads "There are 4 matches available. There are 2 matches available." in the same letter. States are also repeated as you arrow through the list.

It should read the "There are X matches available" when there is a change in the count, and only once for that count until another filter happens. The highlighted state only should read aloud as you arrow through the list (not a notice about matches available).

We also need to announce when there are no matches available.

See what happens in Voiceover in Safari (the same happens in Chrome):

[marcysutton]

After reviewing the latest changes, I think that message should only come up when the count changes. maybe like this:

Initial focus:
Input label / "There are 50 matches available"

Arrow down:
"Alabama" (lose the "x matches" text)

Type C:
"There are 3 matches available."

Arrow down:
"California"

[robertmesserle]

@marcysutton Can you try again with the latest code in master?

[marcysutton]

It works a lot better! The only case we still have to handle is announcing "There are no matches".

[marcysutton]

@robertmesserle should I open a new issue for the "no matches" announcement or is that in master now?