Rendering LaTeX in Figure Not Working

[xofbd]

Hello,

I've encountered a bug when trying to add LaTeX in a plot through annotation or title. Check out the screenshot below:

As you can see, I'm using JupyerLab so maybe it's a Jupyter specific problem (I still need to check this out). The problem appears in the current version, 6.2.0, as well as the current commit in the main branch, 4cd70adb576433db0f64a7c8883f199f4b6dc62a. The problem is not present in v6.0.1b0. I did a bit of git bisect to narrow down what commit caused the bug but couldn't arrive at one commit because some commits don't result in a successful build. More details from my investigation:

Last working commit: c8b38f41c504e142139f1146caa9ec934e9b5164 First documented broken commit: b4cd36cb476153db726ad8322005334cc8e3e5b1

Skipped commits from bisecting:

# possible first bad commit: [f51b3dc422e5e18f0bb248af941cc99518315c70] Add build file
# possible first bad commit: [525425823cd4cf382f8761165217d4420cd1ee71] Add build step to check for js build changes in CI
# possible first bad commit: [cbfddad7e7780f119d8ebfa83420e048a242df8e] Add CI to check for changes to js build files
# possible first bad commit: [b8cc069559ab1ae8217ae57a946fde56ca188472] Update build files included in output
# possible first bad commit: [4bcbd304c21bf482225a69ac767e313b40cc4457] Black
# possible first bad commit: [1db6c819efcc0759c9a563ca966806987b84d326] Add js build to CI
# possible first bad commit: [1260612f00cb69490939750f2dc6317960a8be19] Update node root path in commands.py
# possible first bad commit: [0859aef980c9cbdce805a47440942ab465ea7f95] Merge branch 'main' of github.com:plotly/plotly.py into notebook-connected-default
# possible first bad commit: [3a6f3ee217721b84d7b12354934756bc0e6bb767] Revert changes to requirements
# possible first bad commit: [62721e90236b66c3d2b4b32b4dbccaf572b98a33] Add js build to dev build
# possible first bad commit: [e3afcf7f89a534cf460e3a94aced0ce4f6372e68] Add version into package
# possible first bad commit: [c67cadac0ed78ee00e1d91c0815e7bf1360baeab] Add metadata about jupyterlab extension
# possible first bad commit: [b827f02795f2a874b434b8989afb4ae321b38425] Update path of js output
# possible first bad commit: [ca54548709c3ffd39c94f00581e0f693809add1b] Update js access to use new filepaths
# possible first bad commit: [18f70acc5e2d9c62a2138ffebbab4d8941a52991] AUpdate file structure and make package include jupyterlab files
# possible first bad commit: [4a2f699ac00f3a846eb9aa92a41f0ffd2fd4101e] Make default renderer in jupyterlab/notebook plotly_mimetype

Let me know if you have any questions or any way I can help with this issue.

[briochh]

@xofbd, a lot of moving parts between Jupyter, Plotly, browser version and all the extensions etc but I recently had something similar with v6.1.2 and Jupyterlab 4.4.5 that may have been related to #4336 . Installing jupyterlab-mathjax2 seemed to sort it for me.

[xofbd]

@briochh Thanks for the reply. There's definitely a lot of moving parts. Unfortunately, installing jupyterlab-mathjax2 did not resolve my issue but that issue you linked was helpful. In one of the comments of that issue, someone suggested explicitly setting the render to "iframe".

import plotly.io as pio
pio.renderers.default = 'iframe'

That actually works, with the annoyance of creating a folder (which was also pointed out in the issue). So perhaps the problem is that the default renderer should be "iframe" when using JupyterLab? One of the skipped commits from my git bisect investigation did change the default renderer for JupyerLab.

[4a2f699ac00f3a846eb9aa92a41f0ffd2fd4101e] Make default renderer in jupyterlab/notebook plotly_mimetype

[gutow]

import plotly.io as pio
pio.renderers.default = 'iframe'

Just verifying that adding this snippet to my Jupyter notebooks in Jupyter lab appears to solve the problem. If there is a way to have that just be the default, it would be much appreciated.

[gutow]

"iframe" mode is still problematic in a Jupyterhub installation, but works in a local install. In that case the "iframe" version ends up rendered as a blank frame. I am in desperate getting ready for class mode, so cannot do more trouble shooting now. My guess is a cross-site problem.

[xofbd]

"iframe" mode is still problematic in a Jupyterhub installation, but works in a local install.

@gutow In other words, it does not work with a deployed JupyterHub server? Is that what you meant? I'd like to verify any behavior you are observing. Thanks for checking things out.

[gutow]

"iframe" mode is still problematic in a Jupyterhub installation, but works in a local install.

@gutow In other words, it does not work with a deployed JupyterHub server? Is that what you meant? I'd like to verify any behavior you are observing. Thanks for checking things out.

The behavior is that things run without error and the html file for the iframe is created. I dug a little more and the frame is not displayed because by default non-local juypyter servers/hubs/notebooks have the following in the CSP header: 'frame-ancestors: none'. I have control of a small Jupyter Hub server and have not been able to find a way of overriding it. All my attempts did nothing or caused user servers to fail to spawn. How to override the CSP header is a discussion for the Jupyter forums. I will take that part there.

Unfortunately, this suggests that Latex + Plotly + Jupyter will require more than implementing 'iframe' mode to work reliably across Jupyter installations.