Plotly with LaTeXString triggers error in Pluto notebook

[melonedo]

trafficstars

notebook link. Reproduce on my machine with Firefox or Edge.

As can be seen from the notebook, Plotly + LaTexStrings (plot(sin, label=L"s")) will trigger uncaught error in the console, and the plot is not displayed. The error message is

Uncaught (in promise) TypeError: window.MathJax.Callback is not a function
    Queue http://localhost:1235/common/SetupMathJax.js:18
    convertToTspans https://cdn.plot.ly/plotly-2.6.3.min.js:37
    convertToTspans https://cdn.plot.ly/plotly-2.6.3.min.js:37
    convertToTspans https://cdn.plot.ly/plotly-2.6.3.min.js:37
    A https://cdn.plot.ly/plotly-2.6.3.min.js:37
    w https://cdn.plot.ly/plotly-2.6.3.min.js:37
    call https://cdn.plot.ly/plotly-2.6.3.min.js:7
    exports https://cdn.plot.ly/plotly-2.6.3.min.js:37
    each https://cdn.plot.ly/plotly-2.6.3.min.js:7
    ut https://cdn.plot.ly/plotly-2.6.3.min.js:7
    each https://cdn.plot.ly/plotly-2.6.3.min.js:7
    exports https://cdn.plot.ly/plotly-2.6.3.min.js:37
    exports https://cdn.plot.ly/plotly-2.6.3.min.js:37
    drawMarginPushers https://cdn.plot.ly/plotly-2.6.3.min.js:37
    A https://cdn.plot.ly/plotly-2.6.3.min.js:37
    syncOrAsync https://cdn.plot.ly/plotly-2.6.3.min.js:37
    _doPlot https://cdn.plot.ly/plotly-2.6.3.min.js:37
    newPlot https://cdn.plot.ly/plotly-2.6.3.min.js:37
    anonymous http://localhost:1235/components/CellOutput.js line 221 > Function:5
    anonymous http://localhost:1235/components/CellOutput.js line 221 > Function:328
    execute_dynamic_function http://localhost:1235/components/CellOutput.js:221
    execute_scripttags http://localhost:1235/components/CellOutput.js:286
    RawHTMLContainer http://localhost:1235/components/CellOutput.js:394
    run http://localhost:1235/components/CellOutput.js:321
    RawHTMLContainer http://localhost:1235/components/CellOutput.js:392
    Preact 9
    apply_notebook_patches http://localhost:1235/components/Editor.js:570
    apply_notebook_patches http://localhost:1235/components/Editor.js:566
    on_update http://localhost:1235/components/Editor.js:663
    on_message http://localhost:1235/common/PlutoConnection.js:362
    last_task http://localhost:1235/common/PlutoConnection.js:128
    onmessage http://localhost:1235/common/PlutoConnection.js:122
SetupMathJax.js:18:49

[lucifer1004]

Related:

https://github.com/plotly/plotly.js/issues/4563 https://github.com/plotly/plotly.js/pull/6073

[lucifer1004]

With the setting here replacing the current SetupMathJax.js, plotly can run while LaTeXString is used, but it still cannot display LaTeX symbols.

[akhmerov]

This is surprising—I thought that the workaround should be fairly universal; do you see any errors in the browser dev console?

Also an efficient way to debug this is to set a breakpoint after mathjax finished evaluating and see if its output is as plotly expects.

[j-fu]

See also #1500. Nice that this is moving. Once I can get an updated plotly version I also would try this out with https://github.com/j-fu/PlutoVista.jl ...

[Cognitohazard]

I seem to be able to get it to work with this

html"""
<script async src="https://cdn.jsdelivr.net/npm/mathjax@2/MathJax.js?config=TeX-AMS-MML_CHTML"></script>
"""
import PlotlyJS
using Plots, LaTeXStrings
plotlyjs()
plot(1:10, 1:10, xlabel = L"\frac{R_A}{R_B}", extra_plot_kwargs = KW(
        :include_mathjax => "cdn"
   ))

NVM, it seems to work with just the "cdn" kwargs as long as I force refresh the page. However, this seems to break the LaTeX rendering in Julia Markdown.