Enable MathML support for Chrome 109+

[Xyene]

This feature tracks everything that must be done in order to enable MathML support on Chrome.

---

Chrome 109 added support for MathML Core.

• https://www.w3.org/TR/mathml-core/
• https://caniuse.com/?search=mathml

Nominally, this means we can use MathML to render equations in Chrome, after merging https://github.com/DMOJ/online-judge/pull/1663.

@int-y1 did some early testing and discovered that spacing does not work as expected in Chrome 109. For example, in https://dmoj.ca/problem/fibonacci:

Chrome 109

Firefox

Notably, Chrome isn't rendering \, as a thin space. This is because Mathoid (through MathJax) is generating markup that looks like

<mrow>
<mn>1</mn>
<mspace width="thinmathspace"></mspace>
<mn>000</mn>
<mspace width="thinmathspace"></mspace>
<mn>000</mn>
<mspace width="thinmathspace"></mspace>
<mn>007</mn>
</mrow>

and the shorthands thinmathspace etc. are not supported in MathML Core. thinmathspace, for instance, should be written as 0.1667em instead, and this renders correctly in both Chrome and Firefox.

The instance of Mathoid on https://dmoj.ca has been untouched since 2017, so I figured I could just update it and things would Just Work. After all, the MathJax codebase has no more references to thinmathspace. How wrong I was.

First off, Mathoid has slightly changed its config format, in a backwards-incompatible way. Old configs will fail to load with Cannot read property 'displayMessages' of undefined errors on every request.

Next, Mathoid has removed the ability to generate PNGs recently, in https://github.com/wikimedia/mathoid/commit/b152b3c45bd96f5a08598d8232493f9a9b646032. This makes DMOJ's renderer complain with messages like

ERROR 2023-01-16 04:29:32,343 mathoid Mathoid did not return required information (mml, png, svg, mathoidStyle needed):

Running git revert b152b3c45bd96f5a08598d8232493f9a9b646032 within Mathoid was a good enough stopgap, but we should consider dropping PNG fallback support. SVGs are well supported ~everywhere now: https://caniuse.com/?search=svg

After resolving all these issues, I discovered that the latest Mathoid actually still generates the shorthands. This turned out to be because Mathoid depends on https://www.npmjs.com/package/mathoid-mathjax, which ships an ancient version of MathJax that hasn't been updated in two years.

To fix this, I opened up node_modules/mathoid-mathjax/unpacked/jax/element/mml/jax.js, and changed

  LENGTH: {
    VERYVERYTHINMATHSPACE: "veryverythinmathspace",
    VERYTHINMATHSPACE: "verythinmathspace",
    THINMATHSPACE: "thinmathspace",
    MEDIUMMATHSPACE: "mediummathspace",
    THICKMATHSPACE: "thickmathspace",
    VERYTHICKMATHSPACE: "verythickmathspace",
    VERYVERYTHICKMATHSPACE: "veryverythickmathspace",
    NEGATIVEVERYVERYTHINMATHSPACE: "negativeveryverythinmathspace",
    NEGATIVEVERYTHINMATHSPACE: "negativeverythinmathspace",
    NEGATIVETHINMATHSPACE: "negativethinmathspace",
    NEGATIVEMEDIUMMATHSPACE: "negativemediummathspace",
    NEGATIVETHICKMATHSPACE: "negativethickmathspace",
    NEGATIVEVERYTHICKMATHSPACE: "negativeverythickmathspace",
    NEGATIVEVERYVERYTHICKMATHSPACE: "negativeveryverythickmathspace"
  },

to

  LENGTH: {
    VERYVERYTHINMATHSPACE: ".0556em",
    VERYTHINMATHSPACE: ".1111em",
    THINMATHSPACE: ".1667em",
    MEDIUMMATHSPACE: ".2222em",
    THICKMATHSPACE: ".2778em",
    VERYTHICKMATHSPACE: ".3333em",
    VERYVERYTHICKMATHSPACE: ".3889em",
    NEGATIVEVERYVERYTHINMATHSPACE: "-.0556em",
    NEGATIVEVERYTHINMATHSPACE: "-.1111em",
    NEGATIVETHINMATHSPACE: "-.1667em",
    NEGATIVEMEDIUMMATHSPACE: "-.2222em",
    NEGATIVETHICKMATHSPACE: "-.2778em",
    NEGATIVEVERYTHICKMATHSPACE: "-.3333em",
    NEGATIVEVERYVERYTHICKMATHSPACE: "-.3889em",
  },

I've done all of the above on the https://dmoj.ca Mathoid instance, but this really sucks. We can't expect other instances to go through with this, and I don't want to maintain this hack ourselves.

Upgrading Mathoid to use MathJax 3 won't solve this issue either. MathJax 3 has dropped MathML output. From https://docs.mathjax.org/en/latest/output/mathml.html:

While MathJax version 2 included a NativeMML output jax for producing MathML output in the web page, because MathML is not available in the Chrome, Edge, and IE browsers, because the MathML support in Safari and Firefox don’t include all the features needed by MathJax (e.g., the element needed for labeled equations), and because the quality of the results in Safari and Firefox are not always comparable to the output from MathJax, the NativeMML output jax is no longer provided in MathJax version 3.

Moving forward, we should:

• [ ] Do more testing with MathML on Chrome 109+ to ensure there aren't more broken things.
• [ ] Drop PNG fallback support. New users following https://docs.dmoj.ca/#/site/mathoid today do not get a working install at the end.
• [ ] Figure something out???
• [ ] Merge https://github.com/DMOJ/online-judge/pull/1663 to enable MathML autodetection on Chrome 109+.