fast-reflexes / better-react-mathjax

MIT License
132 stars 16 forks source link

Better-react-mathjax doesn't seem to work reliably with Firefox #22

Closed hardyoyo closed 2 years ago

hardyoyo commented 2 years ago

On pages where Better-react-mathjax loads just fine in Chrome, I see the following error in the Firefox console:

image

Text of error: Uncaught (in promise) Error: Typesetting failed: t is null. MathJax MathJax.js:1

Firefox version 103.0 (updated today), MathJax version 3.2.0 and 3.2.2 (both tested, same problem with both versions).

Now, the interesting thing: some pages on our site do render MathJax in Firefox correctly. I suspect the difference is that part of the page that is not working correctly is changing dynamically (via AJAX calls), and thus impacting the functioning of MathJax.

Some clues I've found in my searching so far:

This issue: https://github.com/studyhub-co/components-library/issues/15 Seems to be the same issue.

This issue: https://github.com/mathjax/MathJax/issues/2191 Mentions that MathJax.typesetClear() needs to be called if already-rendered MathJax is being changed on the page... I can confirm that we utilize jQuery's dotdotdot function to truncate some long content on the same page that is manifesting the error I'm reporting. I will see if I can get dotdotdot to call MathJax.typesetClear() after it's done changing content on the page.

I will try to get you minimal test implementation to demonstrate this error.

fast-reflexes commented 2 years ago

Thanks for reporting!

You shouldn't have to worry about typesetClear in your code as it's already called by better-react-mathjax.

However, as always, minimal demonstrating example is needed, otherwise it's impossible to troubleshoot anything.

hardyoyo commented 2 years ago

Hi, good news/bad news: it looks like this bug was a result of a sloppy implementation on our part: we had multiple invocations of MathJaxConfig, and were still using the MathJax component, despite no longer needing it because the MathJaxContext can render MathJax all on its own. By simply removing the code we were no longer using, and relying on only one MathJax config, Firefox started to work as expected. Sorry for the false alarm.

fast-reflexes commented 2 years ago

You can typeset without MathJax components but then all the math that you want to render during the lifetime of your app should be on the page whenever MathJax first loads. It is recommended to use MathJax components as a general rule to avoid this and spend time on troubleshooting when this scenario is not applicable. If you run into problems when using MathJax components but NOT when you remove them, then something else is off with your setup. But as long as it works for you :)

hardyoyo commented 2 years ago

This is good info, thanks!

hardyoyo commented 2 years ago

I apparently was confused, we do in fact still use the MathJax component, I must have been misremembering an earlier state of our work. Things were working without it, but a colleague talked some sense into me, and we added it back.