MathJax 3.2.0 Lazy Loading - mtd error

[bthomale]

Issue Summary

When using load: ['ui/lazy'] with mathml tables, some mtd elements load as yellow mtd text instead of loading correctly. When you load it without lazy typesetting, it renders just fine.

This is happening in a variety of browsers. I'm testing on macOS, looking at Safari, MS Edge, and FireFox.

Steps to Reproduce:

1. Open the attached zip file.
2. Open mtd-lazy-error.xhtml in Safari (or, any other browser).
3. See the yellow mtd text in place of some of the cells.
4. Open mtd-no-lazy-no-error.xhtml and see that it renders fine.

Technical details:

• MathJax Version: 3.2.0
• Client OS: macOS 11.6
• Browser: Safari Version 15.0 (16612.1.29.41.4, 16612)
• Browser: FireFox 93.0 (64-bit)
• Browser: Microsoft Edge Version 94.0.992.50 (Official build) (x86_64)

Supporting information:

See attached zip archive for screenshots and sample xhtml.

MathJax-3.2.0-lazy-mtd-bug.zip

[dpvc]

Thanks for the report. It turns out that this is due to the combination of XHTML, the m namespace, empty mtd elements, and lazy loading. Changing any one fo them lets it work.

The reason turns out to be that lazy loading causes the original MathML to be serialized and when it shows up again, it is re-parsed. But with the explicit m namespace in an XHTML document, the serialization is as XML, and so empty nodes use the <tag/> format rather than <tag></tag>. By default, MathJax's re-parsing is HTML parsing, and so those tags are not handled as self-closing tags, and the nesting structure gets corrupted.

You can tell MathJax to do xml parsing with the parseAs: 'xml' option in the mml configuration block, but it turns out there is an issue with that as well. In an XHTML document, the result of the XML parsing is not the same as in an HTML document, and MathJax ends up not finding the MathML properly.

Fortunately, there is an easy work-around. This configuration will allow your example to work properly in a lazy-loaded XHTML document:

  MathJax = {
    loader: {load: ['ui/lazy']},
    mml: {
      parseAs: 'xml'
    },
    startup: {
      ready() {
        const {HTMLAdaptor} = MathJax._.adaptors.HTMLAdaptor;
        HTMLAdaptor.prototype.body = function(doc) {return doc.body || doc};
        MathJax.startup.defaultReady();
      }
    }
  };

[bthomale]

That seems to be working for me. Thanks!