Skip to content

Upgrade MathJax support from v2/v3 to v3/v4#7898

Merged
emilykl merged 23 commits into
v4.0from
upgrade-mathjax-v3-v4-2
Jul 16, 2026
Merged

Upgrade MathJax support from v2/v3 to v3/v4#7898
emilykl merged 23 commits into
v4.0from
upgrade-mathjax-v3-v4-2

Conversation

@emilykl

@emilykl emilykl commented Jul 10, 2026

Copy link
Copy Markdown
Contributor

Update plotly.js to be compatible with MathJax v4, and drop support for MathJax v2.

Closes #7598.

Due to some logic improvements, this should also make MathJax rendering faster.

  • Modify src/lib/svg_text_utils.js to use MathJax v3/v4 syntax to render math symbols
    • MathJax v3 and v4 use the same syntax, so we can get rid of the if/else cases we used to handle v2 and v3
  • Improve performance by not calling MathJax.startup.defaultReady() on every individual render
    • This was very slow and also not recommended usage of the MathJax API
    • Instead, create a secondary MathJax document upfront that we can use for our purposes, without affecting the page's main MathJax document, and call MathDocument.convert(tex) rather than MathJax.typeset(tex)
      • Side note: This seems to be more or less the approach proposed here by @akhmerov in 2022
    • This also means we no longer have to reset the config after rendering, since the config is applied only to our internal MathJax document
    • This approach does involve three places where we reference functions/objects in the MathJax._.mathjax namespace. While not officially documented, the pattern is used in several places (one, two, three) in the MathJax docs for advanced configuration
      • The MathJax API is mainly intended for rendering entire documents/pages in one shot, so it doesn't directly expose functions for rendering individual expressions one-at-a-time
    • As a nice side effect, this change should make MathJax rendering in plotly much faster
  • Update image baselines
    • There are visible differences, but no regressions; all the changes are minor typsetting differences in character spacing or line height, which makes sense for a new MathJax version
    • Exception: In the mathjax3__mathjax mock, the pie labels which were previously hidden, are now visible as raw MathJax. We don't support rendering MathJax in pie labels. Now at least the behavior is consistent between v3 and v4. However we could change the behavior to hide MathJax text strings in places where we don't support rendering MathJax.
  • Update all testing infrastructure to use MathJax v3 and v4 rather than v2 and v3.
    • NOTE: I've done this by changing all v2 references to v4. This means that v4 is now the "default" in the CI, unless v3 is explicitly specified
    • This includes some updates to the MathJax devtools dashboard homepages

Steps for testing

  • Check out this branch
  • Run the test dashboard (npm start) which uses MathJax 4
  • Verify that every mock with mathjax in the name (and the other baselines changed here) looks OK and matches the new baselines on this branch
    • Note: The mathjax mock itself contains several strings of TeX which don't render due to us not supporting MathJax in pie labels; this is not new, and it's (somewhat) deliberate, to lock in the fallback behavior
  • Visit the MathJax 3 test dashboard (http://localhost:3000/devtools/test_dashboard/index-mathjax3.html) and verify again that everything looks fine

@emilykl
emilykl changed the base branch from master to v4.0 July 10, 2026 12:18
@emilykl
emilykl force-pushed the upgrade-mathjax-v3-v4-2 branch from 656d638 to 9c0b33c Compare July 10, 2026 12:33
@emilykl
emilykl force-pushed the upgrade-mathjax-v3-v4-2 branch from 9c0b33c to 83bb307 Compare July 10, 2026 12:51
@emilykl
emilykl marked this pull request as ready for review July 10, 2026 13:46
@emilykl
emilykl requested a review from camdecoster July 10, 2026 13:46
Comment thread src/lib/svg_text_utils.js
Comment thread src/lib/svg_text_utils.js
Comment thread src/lib/svg_text_utils.js Outdated
Comment thread src/lib/svg_text_utils.js
Comment thread draftlogs/7898_change.md Outdated
Comment thread test/image/baselines/legend_mathjax_title_and_items.png
Comment thread test/image/baselines/mathjax3___mathjax.png
emilykl and others added 6 commits July 13, 2026 11:15
@emilykl
emilykl force-pushed the upgrade-mathjax-v3-v4-2 branch from dc176ac to 5b03600 Compare July 13, 2026 21:33
Comment thread src/lib/svg_text_utils.js
Comment thread package.json Outdated
Comment thread draftlogs/7898_change.md Outdated

@camdecoster camdecoster left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's working for me. Good work!

Comment thread src/lib/svg_text_utils.js
Comment thread src/lib/svg_text_utils.js
Comment thread test/image/baselines/mathjax3___mathjax.png
Comment thread test/image/baselines/legend_mathjax_title_and_items.png
Comment thread package.json Outdated
@emilykl

emilykl commented Jul 16, 2026

Copy link
Copy Markdown
Contributor Author

Note: While QAing these changes in Jupyter Notebook (v7), I discovered that the latest Plotly release (plotly.py 6.9.0, plotly.js 3.7.0) does not render MathJax equations in Jupyter.

There is an open plotly.py issue plotly/plotly.py#1740 capturing the problem for JupyterLab; I am not sure how long the issue has been present in Jupyter Notebook as well, but possibly since the release of Jupyter Notebook 7. It seems at some point, Jupyter stopped exposing a fully-loaded global MathJax variable, so we're not able to hook into the existing MathJax script loaded on the page.

All this to say, the changes in this PR also don't work in JupyterLab / Jupyter Notebook; however, since the issue is previously existing, this isn't a regression. We will move ahead with these changes while also investigating how to restore MathJax rendering in Plotly charts in Jupyter.

Comment thread test/image/make_baseline.py Outdated
Comment thread test/image/make_exports.py Outdated
Comment thread README.md Outdated
emilykl and others added 2 commits July 16, 2026 13:52
Co-authored-by: Mojtaba Samimi <33888540+archmoj@users.noreply.github.com>
Co-authored-by: Mojtaba Samimi <33888540+archmoj@users.noreply.github.com>
@archmoj

archmoj commented Jul 16, 2026

Copy link
Copy Markdown
Contributor

Thanks @emilykl for the great PR.
It looks like a new baseline titled mathjax3___mathjax-font-size.png is missing in respect to the new mock?

@emilykl

emilykl commented Jul 16, 2026

Copy link
Copy Markdown
Contributor Author

Thanks @emilykl for the great PR. It looks like a new baseline titled mathjax3___mathjax-font-size.png is missing in respect to the new mock?

Good catch, I forgot new mocks had to be manually added to the mathjax3 list. I will fix.

@emilykl
emilykl force-pushed the upgrade-mathjax-v3-v4-2 branch from 351aa83 to ed00b8d Compare July 16, 2026 18:30
@emilykl
emilykl merged commit 125f1b5 into v4.0 Jul 16, 2026
164 of 166 checks passed
@emilykl
emilykl deleted the upgrade-mathjax-v3-v4-2 branch July 16, 2026 18:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants