a11yNumResults and a11yNumSelected called too many times

[RichCaloggero]

a11yNumResults and a11yNumSelected called too many times

The functions a11yNumResults and a11yNumSelected are being called too many times.
From what I can gather from the docs, they should be called when either the result set changes or when the selection set changes, respectively, they they should only be called once when the change occurs.

Steps to reproduce

Using the following typeahead:

• open the page after dropping it into a new react project
• type the letter "c" into the input
• immediately switch to the javascript console and examine the log; you can clearly see the a11yNumResults function being called twice

This produces duplicate screen reader announcements -- very annoying!

expected behavior

• log should only contain one message
• screen reader should only announce number of matches once each time match set changes

<Typeahead
  emptyLabel=""
  //a11yNumSelected={() => ""}
  a11yNumResults={(results) => {
    let n = results.length;
    console.log (`a11yNumResults: ${n}`);
    return `${n.toString()} matches.`;
  }}
  onChange={(selected) => {
    this.setState({selected})
  }}
  options={["chocolate", "vanilla", "strawberry", "coconut"]}
  minLength={1}
  inputProps={{"aria-label": "Choose your favorite flavor:"}}
  placeholder="Choose your favorite flavor:"
/>

[ericgio]

I see that the initial keypress triggers 2 console logs, but after that it's just 1, as expected. That said, when I turn VoiceOver on, I still only hear 1 announcement.

[RichCaloggero]

What browser are you using with VoiceOver?
Chrome works, but is flakey.
Firefox doesn't really work at all.
The only truly usable browser with VoiceOver is Safari!

[ericgio]

The only truly usable browser with VoiceOver is Safari!

The examples seem to work just fine for me with Safari + VoiceOver. No repeat announcements, and #301 is not an issue either.

Given that, it's unclear to me whether blame for the bugginess lies with the component itself or with poor interaction between VoiceOver and browsers other than Safari. I also have no idea how other screen readers interact with different browsers and the component, since I currently don't have any way to test other screen readers.

[ericgio]

Note that I'm planning on removing a11yNumResults and a11yNumSelected in the next major release (v4.0), since they're not part of the authoring practices. If this functionality is desired, you'll be able to add it yourself via a children render function.