Input like "x + \text{a{b}c}" renders parts on top of each other when using Node

[thomasjm]

Issue Summary

The input x + \text{a{b}c} renders visually wrong, with parts piled up on top of each other. This seems to only happen when using the Node demos. I can't reproduce it in MathJax-demos-web by putting the same string into tex-svg.html.

Steps to Reproduce:

git clone git@github.com:mathjax/MathJax-demos-node.git
cd MathJax-demos-node
npm install
./direct/tex2svg "x + \text{a{b}c}" > test.html # No need for the CSS to see the problem
google-chrome test.html

Technical details:

• MathJax Version: 3.1.2
• Client OS: Ubuntu 20.04
• Browser: Chrome 87.0.4280.66

Supporting information:

The result looks like this:

I don't see any other errors.

[thomasjm]

Note: it also happens with nested math such as x + \text{a$b$c}

[dpvc]

Thanks for the report. This is an issue with the textmacros extension, and it is related to #2524. Apparently there are situations that didn't get resolved by the fix for that issue. I'll look into it.

In the meantime, you can disable the textmacros extension (if you aren't using its features) using the --packages option to load only those you need (or the full list minus textmacros), or you can modify the tex2svg script to leave out textmacros automatically.