MathJax 4.0.0 is not displaying math in iOS/iPadOS 17 and some versions of 18

[stnor]

Issue Summary

MathJax 4.0.0 is not displaying math in iOS/iPadOS 17 and at least some versions of 18 (eg 18.1)

4.0.0 works fine on iOS 12.5.7 though. I had no issues on 4.0.0-beta.7 (on any OS).

Steps to Reproduce:

1. Open Safari on an iPad running iOS 17
2. go to the v4 demo page: https://mathjax.github.io/MathJax-demos-web/page/tex-chtml.html

(no math expressions are visible, only vertical dividers)

3. Go here: (v3) https://franklinjl.org/demos/mathjax/

(all math is visible)

Technical details:

• MathJax Version: 4.0.0
• Client OS: iPadOS 17.5.1 (validated by me), 17.7.10 (customer reported issue). and 18.1 (customer reported issue)
• Browser: Safari (built in)

[stnor]

I reverted to beta7 for now.

@dpvc Let me know if I can help out more with validation etc.

[dpvc]

I don't have ready access to iOS 17 or 18, but I do know that MathJax v4 uses some CSS that MacOS 14 doesn't properly process, and it may be that iOS suffers from the same problem. Can you try adding

mjx-mo > mjx-c, mjx-mi > mjx-c, mjx-mn > mjx-c, mjx-ms > mjx-c, mjx-mtext > mjx-c {
        clip-path: padding-box polygon(
          -1em -2px, calc(100% + 1em) -2px,
          calc(100% + 1em) calc(100% + 2px), -1em calc(100% + 2px)
        ) ! important;
      }
      mjx-stretchy-h {
        clip-path:  padding-box polygon(
          0 -2px, 100% -2px, 100% calc(100% + 2px), 0 calc(100% + 2px)
        ) ! important;
      }
      mjx-stretchy-v {
        clip-path: padding-box polygon(
          -2px 0, calc(100% + 2px) 0, calc(100% + 2px) 100%, -2px 100%
        ) ! important;
      }
      mjx-stretchy-h > mjx-ext {
        clip-path: padding-box polygon(
          0 -1em, 100% -1em, 100% calc(100% + 1em), 0 calc(100% + 1em)
        ) ! important;
      }
      mjx-stretchy-v > mjx-ext {
        clip-path: padding-box polygon(
          -1em 0, calc(100% + 1em) 0, calc(100% + 1em) 100%, -1em 100%
        ) ! important
      }

to your page's CSS and see if that resolves the issue?

If that fails, then try switching to SVG output (either using the MathJax contextual menu, or via the configuration in the page).

[stnor]

Yup that worked great @dpvc.

Will this roll into 4.0.1?

edit: Just read #3444.

[dpvc]

Yes, there is already a PR that does it. Thanks for confirming that it works.

I'm hoping that we will have 4.0.1 (or probably 4.1.0) out by sometime next week.