Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support for <object>s containing MathML #2456

Closed
cpitclaudel opened this issue Jun 16, 2020 · 2 comments
Closed

Support for <object>s containing MathML #2456

cpitclaudel opened this issue Jun 16, 2020 · 2 comments

Comments

@cpitclaudel
Copy link

Firefox supports embedding MathML objects using the <object> tag, with mime type application/mathml+xml. Chromium doesn't support this, so it would be great to use MathJax for this.

This topic was discussed on the mailing list some time ago: https://groups.google.com/forum/#!msg/mathjax-users/5VOt3rJXHms/X1_ovYTCm5MJ, and led to a wiki page in MathJax-docs (https://github.com/mathjax/mathjax-docs/wiki/External-MathML-files-with--object--does-not-work-with-MathJax), but the solution posted there is for MathJax v2.

The feature request is for MathJax to replace <object>s with type application/mathml+xml with its own rendering.

Here is an example:

  • input.mml
    <?xml version="1.0" encoding="UTF-8"?>
    <math xmlns="http://www.w3.org/1998/Math/MathML" alttext="1+2" display="block">
      <mrow>
        <mn>1</mn>
        <mo>+</mo>
        <mn>2</mn>
      </mrow>
    </math>
  • HTML source code
    <object type="application/mathml+xml" data="input.mml"></object>

Alternatives: Including MathML directly works fine, but it's not as convenient for reusing math.

@dpvc
Copy link
Member

dpvc commented Jun 16, 2020

If you are willing to change the type to type="text/html" (which renders essentially the same in Firefox, and allows other browsers to at least load the MathML document and try to display it), then you can use

<script>
MathJax = {
  options: {
    renderActions: {
      objects: [5, (doc) => {
        const objects = Array.from(document.querySelectorAll('object[type="text/html"]'));
        const jax = doc.inputJax[0];
        for (const object of objects) {
          const mml = ((object.contentDocument || {}).documentElement || {});
          if (String(mml.nodeName).toLowerCase() === "math") {
            object.parentNode.replaceChild(document.importNode(mml, true), object);
          }
        }
      }]
    }
  }
}
</script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/mml-chtml.js"></script>

to have MathJax v3 replace the objects by the MathML they contain, and then process that MathML as through it were in the main document originally.

It you leave it as type="application/mathml+xml", then it will work in Firefox (with the native Firefox MathML rendering replaced by MathJax's rendering), but will not work in Chrome or other browsers.

@cpitclaudel
Copy link
Author

Thanks! This snippet is perfect. I have updated the wiki page.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants