On Chrome OS, letter A overlaps with vinculum, no red background

[ghost]

Test Device

Feynman

Operating System

Chrome OS Version 68.0.3440.25

Browser

Chrome

Problem Description

For phetsims/QA/issues/130. Do we care about this?

1. The A overlaps with the vinculum.
2. There's no red background when rho and L are large and A is small.

Steps to Reproduce

For 1. a. Make denominator as large as possible.

For 2. a. Make numerator as large as possible.

Visuals

1 on Chrome OS

1 on macOS with Chrome

2 on Chrome OS

2 on macOS with Chrome

Troubleshooting Information

Name: ‪Resistance in a Wire‬ URL: https://bayes.colorado.edu/dev/html/resistance-in-a-wire/1.5.0-rc.6/phet/resistance-in-a-wire_all_phet.html Version: 1.5.0-rc.6 2018-06-14 20:52:34 UTC Features missing: generatedcontent Flags: pixelRatioScaling User Agent: Mozilla/5.0 (X11; CrOS aarch64 10718.22.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.25 Safari/537.36 Language: en-US Window: 1536x727 Pixel Ratio: 1.25/1 WebGL: WebGL 1.0 (OpenGL ES 2.0 Chromium) GLSL: WebGL GLSL ES 1.0 (OpenGL ES GLSL ES 1.0 Chromium) Vendor: WebKit (WebKit WebGL) Vertex: attribs: 16 varying: 15 uniform: 256 Texture: size: 8192 imageUnits: 16 (vertex: 16, combined: 96) Max viewport: 8192x8192 OES_texture_float: true Dependencies JSON: {"assert":{"sha":"928741cf","branch":"HEAD"},"axon":{"sha":"cc053b4d","branch":"HEAD"},"brand":{"sha":"89d28f63","branch":"HEAD"},"chipper":{"sha":"fe3cb370","branch":"HEAD"},"dot":{"sha":"0dd6ee8e","branch":"HEAD"},"joist":{"sha":"f047fb1b","branch":"HEAD"},"kite":{"sha":"b6071478","branch":"HEAD"},"phet-core":{"sha":"f35ff65e","branch":"HEAD"},"phet-io":{"sha":"d54be499","branch":"HEAD"},"phet-io-website":{"sha":"28284828","branch":"HEAD"},"phet-io-wrapper-classroom-activity":{"sha":"c84e3046","branch":"HEAD"},"phet-io-wrapper-lab-book":{"sha":"ebf7c7dc","branch":"HEAD"},"phet-io-wrappers":{"sha":"ce57c3e2","branch":"HEAD"},"phetcommon":{"sha":"a5a7478c","branch":"HEAD"},"query-string-machine":{"sha":"485e174e","branch":"HEAD"},"resistance-in-a-wire":{"sha":"9a2b480e","branch":"HEAD"},"scenery":{"sha":"33290b5e","branch":"HEAD"},"scenery-phet":{"sha":"42b0cff2","branch":"HEAD"},"sherpa":{"sha":"9c6ec322","branch":"HEAD"},"sun":{"sha":"6a7c923a","branch":"HEAD"},"tandem":{"sha":"7f499d9e","branch":"HEAD"}}

[ghost]

I'm seeing 1 on Android, but not 2.

[zepumph]

1. I don't think is a problem, but I defer to @ariel-phet as lead designer.

2. We have run into before, https://github.com/phetsims/resistance-in-a-wire/issues/28, there we fixed this by manipulating to original font and the scale applied to that font size (originally it was 115 and scaled down). I can mess with some of those scalars to see if this is fixed in chrome, but I do not have a chrome os device to test with, so things may get messy with dev versions.

@lmulhall-phet can you answer a few questions for me? (that was the first one).

Does this seem like the same issue described in https://github.com/phetsims/resistance-in-a-wire/issues/28#issue-13379242?

When you stay in the state where the red is not showing up for over 15 seconds, does it ever show up? Are there any errors in the console?

Thanks!

[ariel-phet]

@zepumph @lmulhall-phet

Agreed (1) is not a problem, a bit aesthetically sub-optimal, but I don't think anyone will get confused.

[ghost]

@lmulhall-phet can you answer a few questions for me?

Yes.

Does this seem like the same issue described in #28 (comment)?

No, I think it has to do with the font being different and when the R is really big, you're not actually zooming in on the R, whereas you are actually zooming in on the R for other fonts.

When you stay in the state where the red is not showing up for over 15 seconds, does it ever show up?

No.

Are there any errors in the console?

I'll find out.

[ghost]

Are there any errors in the console?

No.

[ghost]

@ariel-phet, @zepumph, here's a video:

https://www.useloom.com/share/287d612c364142eab6fdc565aa6a98e8

As you can see in the video, it looks like we're "zooming in" on the negative space and not the R itself.

(This was taken on my Mac for illustrative purposes.)

The black circle is roughly where I think we're zooming in.

@ariel-phet, if my theory is correct, this is a design issue. How to proceed?

[ariel-phet]

@zepumph if this seems reasonable to solve (the zoom in) please proceed, but do not let it turn into a "rat hole". Obviously I would prefer if the R does not disappear, but since it grows and grows, I doubt it will cause confusion. However, I know you previously put a fair bit of work into this behavior, so I don't want it to indefinitely delay the finishing off of this simulation. Feel free to bug a few other devs if you want some fresh ideas (like SR or JO).

[zepumph]

After looking at this with @lmulhall-phet, we saw that there is no predictable way to manipulate the R on chrome os. I originally tried to move the R down a bit when it got big enough. Then we tested on firefox on chrome OS and found that the font was actually lower (meaning to compensate we would need to move up).

Basically the only solution I can think of would be to actually change the scale of the R, which, IIRC last we worked on this, made things difficult. We need to to get that big in order to have a scale that is sufficiently pedagogically different enough for the small values (up to 10 ohms).

Basically, I'm trying to say. . . I foresee a rabbit hole. @lmulhall-phet and I both feel ok marking this as a won't fix. @ariel-phet please reopen if you would like to talk more.