The right-to-left string test overlaps on the graph on Firefox

[brooklynlash]

Test device Lenovo ThinkPad

Operating System Windows 10

Browser Firefox

Problem description This is for https://github.com/phetsims/QA/issues/575 When using the rtl string test on Firefox, the text overlaps on every graph. Works completely fine on Chrome and does not happen in published.

Visuals

Troubleshooting information: !!!!! DO NOT EDIT !!!!! Name: ‪Atomic Interactions‬ URL: https://phet-dev.colorado.edu/html/atomic-interactions/1.2.0-rc.2/phet/atomic-interactions_en_phet.html Version: 1.2.0-rc.2 2020-11-02 21:58:13 UTC Features missing: touch Flags: pixelRatioScaling User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:82.0) Gecko/20100101 Firefox/82.0 Language: en-US Window: 1536x750 Pixel Ratio: 2.5/1 WebGL: WebGL 1.0 GLSL: WebGL GLSL ES 1.0 Vendor: Mozilla (Mozilla) Vertex: attribs: 16 varying: 30 uniform: 4095 Texture: size: 16384 imageUnits: 16 (vertex: 16, combined: 32) Max viewport: 32767x32767 OES_texture_float: true Dependencies JSON: {}

[DevonQui]

I reproduced this slightly when displaying the forces of Oxygen on my MacBook but otherwise everything else seemed fine in terms of the layout Good find!.

[jbphet]

I'm going to close this as a non-issue. The string that is being translated/tested in this case is a single character, so it is the translator's responsibility to make sure that they don't use a long string that looks bad. While it would be possible to do some scaling in this case, it just doesn't seem worth it to me.

For good measure, I looked at the Persian translation of the current live version, since it's an RTL language. It looks fine. Here's a screen shot.

Closing.