VO cuts off reading frequently

[KatieWoe]

For phetsims/qa#303. Found on iPad 2018 (6th gen) with iOS 12.
When reading the dialog after moving one of the sliders, part is often cut off. This is usually the part reading the current, but can cut off more, even the entire thing. It seems to happen more often when moving the slider before the previous is finished, but can occur even when being moved slowly. The most severe expression seems to be when moving the R slider down. This behavior can also cut off the end of the reset dialog, as seen in one of the videos below.
https://drive.google.com/file/d/1z4tg_D9MK52r6HDmwbWl_WJNuzbd1m18/view?usp=sharing
https://drive.google.com/file/d/157qvtP-cgA2khYKwVhwZYDbMz5pr7Z1K/view?usp=sharing

[jessegreenberg]

Thanks @KatieWoe I will see if I can reproduce on my iPad2.

Also, just for future reference, we call this content that is getting cut off "alerts" rather than "dialog". A "Dialog" for web content is a visual window that can be popped up to display info so it is a bit of an overloaded term.

[jessegreenberg]

Unfortunately I haven't heard an alert be cut off yet by my iPad2 so I can't reproduce this.

[jessegreenberg]

We had a similar issue with this in our very first a11y prototypes with a number of screen readers due to Heartbeat.js which is a workaround that specifically keeps Safari from "going to sleep". We added aria-hidden to the related element and the problem went away. Maybe that isn't enough for mobile VO.

My next theory is that removing alert content quickly from the DOM is causing the interruptions. This is done now to make it impossible for the alert content to be readable with a virtual cursor. We could try using aria-relevant to assist with this.

[KatieWoe]

I find it a bit odd that it hasn't been reproduced. It happened very frequently for me. I can't test on an Air 2 yet, but when one comes back I will. let me know if there's anything else you want me to try in the mean time @jessegreenberg

[jessegreenberg]

It is odd, but there may be large differences in the way VO works between iOS 9.x and iOS 12.x, so I am not too surprised.

[jessegreenberg]

I got an iPad Air 2 and can reproduce the issue now on iOS 12.

[jessegreenberg]

This version has the Heartbeat.js workaround removed: https://phet-dev.colorado.edu/html/ohms-law/1.4.0-dev.30/phet/ohms-law_en_phet.html

EDIT: The interruption is happening in this version.

[jessegreenberg]

Also, it is odd that when the alert happens we only get the first sentence.

"As letter V grows, letter I Grows."

It should be:

"As letter V grows, Letter I Grows. Current now {{value}} mA".

[KatieWoe]

It also seems to get worse if the speaking rate is faster.

[jessegreenberg]

In this version (https://phet-dev.colorado.edu/html/ohms-law/1.4.0-dev.31/phet/ohms-law_en_phet.html) I replaced the following lines:

      // after a small delay, remove this alert content from the DOM so that it cannot be found again - must occur
      // after a delay for screen reader to register the change in text content
      // timer.setTimeout( () => { liveElement.textContent = ''; }, 200 );
      timer.setTimeout( () => { console.log( 'skipping clear' ); }, 200 );

and this seems to fix the problem. @KatieWoe can you please confirm on your end too?

EDIT: Of course, this means that alerts are readable in the PDOM which isn't good. But at least we have isolated why VO is doing this.

[jessegreenberg]

Replacing textContent = "" with hiding and showing the aria-live elements seems to fix mobile VO. We will want to test this on VO, JAWs, and NVDA to make sure this works there too.

[KatieWoe]

Alerts are readable in the PDOM, that means that swiping two fingers up reads previous alerts instead of the beginning of the scene description,. It only reads the scene description after reading a few alerts. Otherwise, behavior seems to be much better on the iPad. Do you want me to check NVDA, Jaws, and VO on mac in this version, or do you want to fix the alerts in the PDOM issue before I do that?

[KatieWoe]

Update: I did do a quick check of NVDA, Jaws, and Mac VO with that link. I saw some sound distortion on Jaws (not too unusual) and Mac VO had one instance where it read two alerts in a row rather than the latest one. Other than that, they seem to behave identically to mobile VO in terms of Alerts in the PDOM. @jessegreenberg

[jessegreenberg]

Thanks for testing @KatieWoe, that is good to hear. Then we need a different way of hiding the elements other than removing textContent. I tried using hidden

      liveElement.hidden = false;
      AccessibilityUtil.setTextContent( liveElement, textContent );

      timer.setTimeout( () => {
        liveElement.hidden = true;
      }, 200 );

This worked with NVDA for the first 4 alerts and then all alerts stopped working. This means that setting hidden to false synchronously doesn't work, I am going to try to put the setting of content behind a timeout too.

[jessegreenberg]

This works well with NVDA:

      liveElement.hidden = false;

      // after a short delay, set the textContent for the screen reader to anounce, must be done
      // asyncrounously from setting hidden above or else the screen reader will fail to read
      // the content
      timer.setTimeout( () => {
        AccessibilityUtil.setTextContent( liveElement, textContent );

        // after a short delay, hide the content so that it cant be read with the virtual cursor
        // Using `hidden` rather than setting textContent works better
        timer.setTimeout( () => {
          liveElement.hidden = true;
        }, 200 );
      }, 200 );

[jessegreenberg]

We verified this was fixed in phetsims/scenery-phet#490