phetsims / greenhouse-effect

"Greenhouse Effect" is an educational simulation in HTML5, by PhET Interactive Simulations.
GNU General Public License v3.0
4 stars 4 forks source link

VO mislabels checkbox for Layer 1 thermometer #385

Closed Nancy-Salpepi closed 4 months ago

Nancy-Salpepi commented 5 months ago

Test device MacBook Air M1 chip

Operating System 14.1.2

Browser Safari 17.1.2

Problem description For https://github.com/phetsims/qa/issues/1033, on the Layer Model Screen VO calls the Layer 1 thermometer checkbox, the Layer 2 thermometer checkbox. The other checkboxes are correctly labeled.

Steps to reproduce

  1. Turn on VO
  2. On the Layer Model Screen tab to and increase the amount of Absorbing Layers by any amount
  3. Tab to the Thermometer checkbox for Layer 1

Visuals

Screenshot 2024-01-30 at 4 41 34 PM
Troubleshooting information: !!!!! DO NOT EDIT !!!!! Name: ‪Greenhouse Effect‬ URL: https://phet-dev.colorado.edu/html/greenhouse-effect/1.3.0-dev.3/phet/greenhouse-effect_all_phet.html Version: 1.3.0-dev.3 2024-01-23 21:58:15 UTC Features missing: applicationcache, applicationcache, touch Flags: pixelRatioScaling User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.2.1 Safari/605.1.15 Language: en-US Window: 1356x710 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: {}
Nancy-Salpepi commented 5 months ago

When the checkbox is checked or unchecked, VO correctly states that the thermometer has been added/removed from layer 1.

Screenshot 2024-01-30 at 4 58 29 PM
arouinfar commented 5 months ago

This is really bizarre @Nancy-Salpepi. I see the incorrect VO output in your first screenshot, but I am unable to reproduce it.

Nancy-Salpepi commented 5 months ago

hmmm...are you using chrome or safari with VO @arouinfar? I will try again, but I'm pretty sure I cleared my cache after I heard it wrong the first time.

Nancy-Salpepi commented 5 months ago

I think you should be able to reproduce if you follow these steps @arouinfar:

  1. Go to the Layer Model Screen and turn on VO
  2. Tab to the Absorbing layers and increase to 3
  3. Tab to the Layer 1 Thermometer Checkbox and uncheck it
  4. Tab back to the Absorbing layers and decrease back to 0 and then increase back to 3
  5. Tab to the layer 1 Thermometer Checkbox
Nancy-Salpepi commented 5 months ago

And if you follow these similar steps you get VO calling it the Energy Balance Checkbox:

  1. Go to the Layer Model Screen and turn on VO
  2. Tab to the Absorbing layers and increase to 1
  3. Tab to the Layer 1 Thermometer Checkbox and uncheck it
  4. Tab back to the Absorbing layers and decrease back to 0 and then increase back to 1
  5. Tab to the layer 1 Thermometer Checkbox Screenshot 2024-02-01 at 2 49 55 PM

EDIT: Another oddity I have also seen (but can't figure out how to reproduce reliably) is that 1 or all of the layer thermometer checkboxes will no longer have a title. It will just be "checkbox."

arouinfar commented 5 months ago

@Nancy-Salpepi I've been using VO on Safari, but I haven't been able to reproduce any of your examples.

Here's my troubleshooting info:

Name: ‪Greenhouse Effect‬ URL: https://phet-dev.colorado.edu/html/greenhouse-effect/1.3.0-dev.3/phet/greenhouse-effect_en_phet.html Version: 1.3.0-dev.3 2024-01-23 21:58:15 UTC Features missing: touch User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.5 Safari/605.1.15 Language: en-US Window: 1324x875 Pixel Ratio: 1/1 WebGL: WebGL 1.0 GLSL: WebGL GLSL ES 1.0 (1.0) Vendor: WebKit (WebKit WebGL) Vertex: attribs: 16 varying: 30 uniform: 256 Texture: size: 16384 imageUnits: 16 (vertex: 16, combined: 32) Max viewport: 16384x16384 OES_texture_float: true Dependencies JSON: {}

arouinfar commented 4 months ago

@Nancy-Salpepi and I paired on this, and it turns out we have different versions of macOS. I upgraded to the latest, and I am now able to reproduce.

jbphet commented 4 months ago

I am unable to reproduce any part of this on Windows+NVDA. This seems like a VoiceOver-specific problem. @Nancy-Salpepi - can I request that you try it in the a11y view and see how what you're hearing relates to what you're seeing being selected in the PDOM at the right? Here's a screenshot from my Windows machine to illustrate:

image

Nancy-Salpepi commented 4 months ago

It is definitely a VO issue. The focus is on Layer 1 thermometer in the pdom but VO says layer 2:

Screenshot 2024-02-07 at 8 38 11 AM
jbphet commented 4 months ago

@jessegreenberg and I reviewed this, and he is going to try to duplicate with a simple HTML example to make sure it isn't something PhET-specific and to potentially report the problem to Apple.

jbphet commented 4 months ago

@arouinfar - See the comment above. Do we need to wait until there is some resolution on this, or can we proceed with interviews with the problem present?

arouinfar commented 4 months ago

@jbphet I'd like to wait until @jessegreenberg determines if this is a PhET problem or an Apple problem. It's a fairly serious issue, so if it's something we can fix, I'd like to fix it before interviews.

jessegreenberg commented 4 months ago

I couldn't reproduce this on macOS 11.7.6 + Safari, but it sounds like this is specific to a recent version of macOS.

@Nancy-Salpepi or @arouinfar are you able produce this bug here? https://bayes.colorado.edu/dev/html/jg-tests/checkbox-test.html

Nancy-Salpepi commented 4 months ago

I was not able to reproduce using the link above. In the sim, it has something to do with the visibility of the checkboxes and not just checking/unchecking them.

jessegreenberg commented 4 months ago

I see, thanks @Nancy-Salpepi - I just read https://github.com/phetsims/greenhouse-effect/issues/385#issuecomment-1922131097 and https://github.com/phetsims/greenhouse-effect/issues/385#issuecomment-1922139063 more carefully. Ill make a new simple test.

jessegreenberg commented 4 months ago

@Nancy-Salpepi or @arouinfar can you please try this one? In this simple demo there are buttons to add/remove checkboxes. If it happens here we know its related to the hidden attribute. If not, it could be something totally different about PhET's context and we will need to investigate more thoroughly.

https://bayes.colorado.edu/dev/html/jg-tests/checkbox-test.html

Nancy-Salpepi commented 4 months ago

I wasn't able to reproduce with the new test. 😕

jessegreenberg commented 4 months ago

Bummer! Alright, thanks for testing. Then it is not clear what is causing this yet. But that means there is a chance we can find out and fix it. There is a chance though that we will identify a macOS bug that is not fixable.

This is also definitely not specific to greenhouse, and probably happens in many sims. I wouldn't be surprised if it happens for other buttons/components.

I think to keep investigating this, I will need to debug on a Mac with the latest macOS.

jessegreenberg commented 4 months ago

Since this impacts all sims I moved next steps to https://github.com/phetsims/scenery/issues/1606.

arouinfar commented 4 months ago

Thanks @jessegreenberg!

@jbphet this no longer blocks interviews.

jbphet commented 4 months ago

In the related common code GitHub issue, @jessegreenberg said that he found a "hacky workaround" for this problem. I just checked in with him via Slack to see if he thinks it's worth committing to main, and will update this based on what I find out.

jessegreenberg commented 4 months ago

OK, a workaround for https://github.com/phetsims/scenery/issues/1606 has been committed and this should be fixed.

arouinfar commented 4 months ago

Thanks @jessegreenberg! I am no longer able to reproduce in VO on main and in dev.6 (interview version). Closing.