Page requires refresh to display mathjax formatted data.

[JieqinT]

Here's the screenshot of before a refresh.

and this is after

.

Switching between articles also trigger the same issue, upon returning to an article with mathjax formatted data, a refresh is required.

[kalaider]

+1

[linrongbin16]

same problem:

on website, mathjax need refresh to display formulas, but when mathjax use forceSVG:true or create pdf, it report errors:

Error: TypeError: speech.processExpression is not a function
    at GetSpeech (/Users/linrongbin/devenv/project/Way-to-Algorithm/node_modules/gitbook-plugin-mathjax/node_modules/mathjax-node/lib/mj-single.js:540:29)
    at Function.execute (file:///Users/linrongbin/devenv/project/Way-to-Algorithm/node_modules/mathjax/unpacked/MathJax.js:243:26)
    at cb (file:///Users/linrongbin/devenv/project/Way-to-Algorithm/node_modules/mathjax/unpacked/MathJax.js:225:59)
    at Object.Process (file:///Users/linrongbin/devenv/project/Way-to-Algorithm/node_modules/mathjax/unpacked/MathJax.js:495:38)
    at Object.call (file:///Users/linrongbin/devenv/project/Way-to-Algorithm/node_modules/mathjax/unpacked/MathJax.js:508:37)
    at Function.WAITEXECUTE (file:///Users/linrongbin/devenv/project/Way-to-Algorithm/node_modules/mathjax/unpacked/MathJax.js:348:50)
    at cb (file:///Users/linrongbin/devenv/project/Way-to-Algorithm/node_modules/mathjax/unpacked/MathJax.js:225:59)
    at Object.Process (file:///Users/linrongbin/devenv/project/Way-to-Algorithm/node_modules/mathjax/unpacked/MathJax.js:495:38)
    at Object.call (file:///Users/linrongbin/devenv/project/Way-to-Algorithm/node_modules/mathjax/unpacked/MathJax.js:508:37)
    at Function.WAITEXECUTE (file:///Users/linrongbin/devenv/project/Way-to-Algorithm/node_modules/mathjax/unpacked/MathJax.js:348:50)

[cjdbarlow]

Hacky workaround courtesy of @quangounet, but adding a JS loop fixes the problem:

gitbook.events.bind("page.change", function() {
    MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
}

[hamishwillee]

@Chrisjake Awesome - works fine if added into the page - thanks! Any plans to push a PR for this?

[walkccc]

My "book.json" looks like this
{
"plugins": [
"mathjax",
"splitter",
"toggle-chapters",
"scripts"
],
"pluginsConfig": {
"scripts": {
"files": [
"./fix.js"
]
}
}
}

And my "fix.js" looks like this:

<script> gitbook.events.bind("page.change", function() { MathJax.Hub.Queue(["Typeset", MathJax.Hub]); } </script>

After adding these codes, it still can't work properly.
Anything wrong with the codes?

[cjdbarlow]

Hi @walkccc
Where does the scripts plugin add the JS in the page? If fix.js is loaded before mathjax, it won't work.

I vaguely remember during my troubleshooting process adding both sequentially to the .md file with no luck, so there may also be a race condition occurring.

If your gitbook is small, try manually adding the script to the bottom of each .md file? I ended up placing the script with some other js in a separate plugin that made the site header, but this may not be appropriate in your case.

[walkccc]

Hi @Chrisjake
My gitbook is very big(about 500 .md files)
I've tried a small case to append the <script> .... </script> in the end of the .md file. It still not work and require refresh to show the math equation.

[hamishwillee]

@walkccc Just FYI, you are not alone - the solution did not work for me either (I thought it did, but sadly not). I have not tried to debug this yet.

[hamishwillee]

@SamyPesse The root cause of this problem is that the CDN used for Mathjax changed. PR is here: #39

@walkccc @Chrisjake etc, the above PR isn't much use to anyone else because head revision of this plugin only work for gitbook>4. If you wanted to use this you could see the PR above for changes and/or use my update_cdn branch/fork in your gitbooks:

"mathjax@git+https://github.com/Dronecode/plugin-mathjax.git#update_cdn",

(although I don't guarantee it won't move).

NOTE: You can't also have the script running that is recommended above, as this will render the maths twice!

[southball]

The problem is still occurring, but it seems I was able to 'fix' it by modifying book/plugin.js to this:

require(["gitbook"], function(gitbook) {
  window.addEventListener('load', function (event) {
    MathJax.Hub.Config({
      tex2jax: {}
    });

    gitbook.events.bind("page.change", function() {
      MathJax.Hub.Typeset()
    });
  });
});

I'm not sure if this will affect the functioning of the plugin, could someone take a look at this and see if this fixes the problem? @SamyPesse

It seems that currently the browser warns that MathJax is not defined as MathJax is accessed before the script is loaded.

Edit: I modified it to use load and not DOMContentLoaded.

[hamishwillee]

@JamieChoi I think updating the mathjax CDN as above is probably a better fix #34 (comment)

[Joeeyy]

CDN of mathjax should be changed from cdn.mathjax.org/mathjax to cdnjs.cloudflare.com.

As for gitbook, we can modify one line in {root_of_your_gitbook}/node_modules/gitbook-plugin-mathjax/index.js from 'https://cdn.mathjax.org/mathjax/' + version + '/MathJax.js?config=TeX-AMS-MML_HTMLorMML', to 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.6.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML'. There are also other files using the old cdn url, you can find it by grep command and change it to up-to-date url.

BTW, if you visit https://cdn.mathjax.org/mathjax/2.6-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML and take a look into this code, you'll find why we need to refresh the page to reload those math elements.