HTMLMath widget in JupyterLab doesn't render LaTeX until MathJax has been loaded externally

[jonmmease]

In the process of adding MathJax / LaTeX support to the plotly.py ipywidget, I realized that JupyterLab doesn't seem to automatically initialize MathJax the way the classic notebook did. I was able to reproduce this same situation using the built-in HTMLMath widget.

Steps to reproduce

1. Launch a fresh JupyterLab instance
2. Create a new notebook
3. Create and display an HTMLMath widget that contains LaTeX. It will display in raw form (not typeset)
4. Create and evaluate a markdown cell that contains LaTeX
5. Repeat step (3) and the output will be typeset as expected.

Here is a screenshot of the end-result of this process

Is it possible for a widget (or a general JupyterLab extension for that matter) to request that JupyterLab perform its MathJax initialization?

This is also something I'd like to add to the plotly mime type renderer (https://github.com/jupyterlab/jupyter-renderers/tree/master/packages/plotly-extension) and chart editor (https://github.com/plotly/jupyterlab-chart-editor) extensions, so let me know if this is a discussion we should move somewhere else. Thanks!

[tiagopereira]

Also seeing the same. I have some Latex in widgets to produce plots. Is there any way to initialise Mathjax without using a markdown cell? It would be nice if my widgets could run properly in new notebooks, not needing the users to markdown cells.

[jasongrout]

It seems that window.MathJax is not loaded until the ILatexTypesetter plugin is loaded in JLab. The global MathJax object is what is being used by widgets:

ipywidgets/packages/controls/src/utils.ts

Lines 48 to 50 in 2b91eac

	if ((window as any).MathJax !== void 0) {
	MathJax.Hub.Queue(['Typeset', MathJax.Hub, element]);
	}

A simple fix might be the jupyterlab manager requiring the ILatexTypesetter plugin:

import { ILatexTypesetter } from '@jupyterlab/rendermime';

(which presumably would load mathjax into the global namespace)

A more comprehensive fix might be the widget manager providing the typesetting functionality itself, and taking responsibility for interacting with the environment to get the typesetting done.

As always, PRs are more than welcome. Let me know if someone wants to work on this and I can help them get started.

[jasongrout]

Note that if there are any markdown cells in the notebook, jlab loads mathjax and things work. I don't have to edit the markdown cells and render them explicitly.

[jasongrout]

Is it possible for a widget (or a general JupyterLab extension for that matter) to request that JupyterLab perform its MathJax initialization?

@jonmmease - what I describe above about requiring the ILatexTypesetter plugin should be enough to get jlab to initialize mathjax.

[jonmmease]

Thanks, @jasongrout! I'll give it a try

[vidartf]

what I describe above about requiring the ILatexTypesetter plugin should be enough to get jlab to initialize mathjax.

Except of course if you use an ILatexTypesetter that isn't MathJax 😉

[jasongrout]

Do you want to put in a PR to have the jlab manager do that? Something like what was noted above in #2253 (comment)

[jasongrout]

Perhaps the widget manager should provide a typeset utility function, which could use something instead of mathjax if needed.

[vidartf]

@jasongrout Sure, hopefully next week. For now and until I can rely on this being available I use this workaround (in a project where I know the mathjax implementation is used): https://github.com/vidartf/phoila/blob/1168c4890178c3efad1a0d54431cd21a4fcc61f7/ts/src/plugins.ts#L110-L115

[altimmons]

Hmm.. I possibly have an unrelated issue? Or not. Google brought me here after all.

I have to use the following:

 from IPython.display import display, Math

then it renders my text.
Otherwise I get strings, including opening notebooks from other people with Latex.

I have to then use:
display(Math(latex(e)))

And then it sends that to the renderer.

But tex just sitting there? Nope.

[xEverth]

Hello!
I also stumbled upon this issue. I have a function that calls display(Latex()) and I then want to interact with it, as shown in the image. When I run the function alone from the cell, the output is correctly formatted:
display(Latex(rf'$V_{{\text{{baseline}}}} = {format_error(baseline, baseline_err, "V")}$'))

When I call it from within the widget iframe, it renders as text.

Am I doing something wrong? Is there a workaround to display LaTeX in the interactive iframes?
Thanks