countAloud query parameter inconsistent across platforms

[Nancy-Salpepi]

Test device MacBook Air (m1 chip) Dell Operating System MacOS 12.0.1 Win10

Browser Safari, Chrome, Firefox

Problem description For https://github.com/phetsims/qa/issues/771

When using the query parameter, countAloud, each platform behaves differently when the number of objects in the play area is changed rapidly. On Mac + Safari--only the final number is read. Win10 + Firefox will count through each number. Mac + chrome does something in between. It sometimes says only the final number and sometimes is counts through a couple of numbers.

Steps to reproduce For each platform:

1. Add the countAloud query parameter.
2. Go to either the Ten or Twenty screen.
3. Rapidly increase the number of objects in the play area (fire on hold).
4. Rapidly decrease the number of objects in the play area.

Visuals

• Win 10 + Firefox:

https://user-images.githubusercontent.com/87318828/152048037-2a1bdc57-262a-4cfd-9a80-0257ee490769.mov

• Mac + Safari:

https://user-images.githubusercontent.com/87318828/152048197-664ab73c-79dd-4ec4-9912-84561728696f.mov

• Mac + Chrome:

https://user-images.githubusercontent.com/87318828/152048218-1a5b4c4a-cf2f-4dee-af79-acb9a42e86ae.mov

Troubleshooting information: !!!!! DO NOT EDIT !!!!! Name: ‪Number Play‬ URL: https://phet-dev.colorado.edu/html/number-play/1.0.0-dev.45/phet/number-play_all_phet.html?screens=1,2,3&countAloud Version: 1.0.0-dev.45 2022-01-31 11:53:19 UTC Features missing: touch Flags: pixelRatioScaling User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.1 Safari/605.1.15 Language: en-US Window: 1409x687 Pixel Ratio: 2/1 WebGL: WebGL 1.0 GLSL: WebGL GLSL ES 1.0 (1.0) Vendor: WebKit (WebKit WebGL) Vertex: attribs: 16 varying: 30 uniform: 1024 Texture: size: 16384 imageUnits: 16 (vertex: 16, combined: 32) Max viewport: 16384x16384 OES_texture_float: true Dependencies JSON: {}

[chrisklus]

From design meeting, we think the voicing should not start while the buttons are held, so there should be some small delay while the number settles. I'll reach out to @jessegreenberg to investigate browser specific problems.

[chrisklus]

@jessegreenberg and I setup an utterance queue for Number Play to address this issue, and we think it sounds pretty good now. We used the default delay time of 200 ms. @Nancy-Salpepi could you check the behavior for consistency across platforms? For holding the buttons now, there should only be a readout of the last number.

[Nancy-Salpepi]

@chrisklus This looks good now across several platforms (Mac+ safari/chrome, Win10+ chrome/firefox, Chromebook) on screens 1 and 2. When holding the button only the last number is read aloud.

[chrisklus]

Awesome, thanks much @Nancy-Salpepi! Closing.