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

Hi Jonathan,
Just following up, we tried Firefox and VoiceOver and the behavior does not exist there. I didn’t think to try Firefox and VoiceOver because that combination has never worked well for me before.

The issue is a Safari problem. It might be happening because we dynamically remove the grab button from the actual DOM when the balloon is grabbed, and then put it back when the balloon is released.

In our former implementation, we just moved focus from the grab button to the movable balloon and hid the button.

We thought removing the grab button was a cleaner implementation, but unfortunately VoiceOver can’t handle it - at least not yet.

Thanks for your help. We have some things to try out.
Taliesin

~.~.~
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




> On Jul 28, 2021, at 4:27 PM, Jonathan Cohn <jonathan.cohn@cambiumassessment.com> wrote:
> 
> Hello,
> I have found that sometimes the name of elements does not change when the VoiceOver cursor is in them, but that I have to stop interacting and then start interacting for an update to occur. I mostly found this to be the case in older versions of MacOS, especially if group navigation is turned on instead of DOM navigation in.
> I suggest you try the same simulation in Firefox 90 or newer on the Macintosh. Mozilla has made significant improvements in the past year with regard to making Firefox communicate with accessible layers of the Macintosh OS. This would let you know if it is a Safari or VoiceOver that is causing you issues.
>  
> Jonathan
> 
> 
>> On Jul 28, 2021, at 11:59 AM, Taliesin Smith <talilief@gmail.com <mailto:talilief@gmail.com>> wrote:
>> 
>> 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 <mailto:talilief@gmail.com>
>> 
>> ~.~.~
>> Also reachable at:
>> Taliesin.Smith@colorado.edu <mailto:Taliesin.Smith@colorado.edu>
>> Inclusive Design Researcher
>> PhET Interactive Simulations
>> https://phet.colorado.edu/en/accessibility <https://phet.colorado.edu/en/accessibility>
>> Physics Department
>> University of Colorado, Boulder
>> 
>> 
>> 
>> 
>