Strange behavior on MacOS Big Sur with arai-roledescription and web application?

Hi ARIA Experts,

Does anyone have any idea why VoiceOver on MacOS Big Sure would not read out an accessible name and role on a button after interaction?  The button that launches a custom interaction that uses web application.

The strange thing is that on first focus, the experience is correct, I get the accessible name and role:
"Grab Yellow Balloon, button"

After I grab the balloon, release it, move my focus to say the Remove wall button, and then re-focus on the Grab button, I no longer hear the button’s name or proper role. I hear:
“Web Application”

It’s like the release interaction is not ending the web application, or VoiceOver may be having trouble with a highly dynamic HTML situation. In the HTML, once the balloon is grabbed, the grab button disappears and then the user is interacting with a balloon that can be moved in 4 directions - well the balloon is a div with the role web application. When the balloon is released, the grab button returns and the movable balloon is no longer available. Focus is either on the grab button or on the movable balloon.

Here’s a link to the working example that is screen reader accessible. This problem doesn’t seem to happen with NVDA, just VoiceOver. I am not sure if the issue happens on releases between High Sierra and Big Sur. It’s definitely happening on Big Sur 11.4 and not happening on High Sierra.

https://phet-dev.colorado.edu/html/balloons-and-static-electricity/1.5.0-dev.34/phet/balloons-and-static-electricity_en_phet.html <https://phet-dev.colorado.edu/html/balloons-and-static-electricity/1.5.0-dev.34/phet/balloons-and-static-electricity_en_phet.html>

Any thoughts on why the name and role of the button disappear after interaction?


Taliesin Smith
talilief@gmail.com

~.~.~
Also reachable at:
Taliesin.Smith@colorado.edu
Inclusive Design Researcher
PhET Interactive Simulations
https://phet.colorado.edu/en/accessibility
Physics Department
University of Colorado, Boulder