Characters partially disappear when zooming on iOS devices

[loopspace]

Issue Summary

When using "pinch to zoom" on an iOS device (iPad/iPhone) on a page with MathJaX rendered as "CommonHTML" (such as the MathJaX test page) then characters flicker and if the zoom is stopped in the right place then they can (partially) disappear.

This does not happen with the SVG renderer.

Steps to Reproduce:

1. Open up the samples page https://www.mathjax.org/#samples on an iOS device - I tested with safari and chrome. Make sure it is set to render as "CommonHTML"
2. Use the "pinch to zoom" facility to zoom in on a piece of Mathematics. You should see a noticeable flicker.
3. You can "catch" the flicker in the act if you stop the zoom carefully.

Although most of the time it's really obvious that something weird is happening, if the zoom is just right then it can turn a plus into a minus.

Technical details:

• MathJax Version: 2.3 (latest commit: f3aaf3a)
• Client OS: iPadOS 13.4.1, also confirmed on an iPhone (iOS version unknown)
• Browser: Chrome 81.0.4044.124, Safari (latest version - can't find version number)

Supporting information:

Screenshots from the MathJaX samples page.

[dpvc]

We have seen this with Safari, and other WebKit based browsers. See for example this post. We do not currently know of a work-around. This summer we are working on the font support for v3, and will be looking into this issue at that time.

[michaeldaltonau]

There appears to be something weird going on with the fonts. See this codepen, in which I have copied the font declarations from MathJax and just displayed some text. I can still reproduce this issue on iOS with just the fonts. (Note that you can't always reproduce it inside the iframe, but if you enter debug view (fork it), then you can see it).

[michaeldaltonau]

I converted one of the fonts to TTF and then back to WOFF2, and this seems to have fixed the issue. Could something be wrong in the font generation process?

Edit: If I use the source font directly, I still have this problem. Are these files manually generated?

[michaeldaltonau]

@dpvc
How are the TEX fonts generated?

[dpvc]

I converted one of the fonts to TTF and then back to WOFF2, and this seems to have fixed the issue. Could something be wrong in the font generation process?

The MathJax fonts have some font metrics set in an unusual way in order to be able to position them more easily in math formulas. Your conversion process probably reset those parameters, so they worked better as text fonts.

We are in the middle of doing a font overhaul and will be replacing the MathJax fonts with newer versions. We hope to address this problem at that time. Doing so may require changes to MathJax internals, however.