Plots not shown in HTML export for default Plotly renderer

Environment data

• VS Code version: 1.59.0
• Jupyter Extension version (available under the Extensions sidebar): v2021.8.1195043623
• Python Extension version (available under the Extensions sidebar): v2021.8.1105858891
• OS (Windows | Mac | Linux distro) and version: Windows 10 20H2
• Python and/or Anaconda version: 3.9.5
• Type of virtual environment used (N/A | venv | virtualenv | conda | …): NA
• Jupyter server running: Local

Expected behaviour

Plots are visible when exporting to HTML

Actual behaviour

Plots are not shown (and there is no track of it in the HTML source code)

Steps to reproduce:

import plotly.express as px
fig = px.scatter(x=[0, 1, 2, 3, 4], y=[0, 1, 4, 9, 16])
fig.show()

The temporary notebook for exporting (%localappdata%\temp<UUID>\export.ipynb) already misses the expected output.

Switching the Plotly renderer to notebook using fig.show(renderer='notebook') provides the expected plot output in the exported HTML

On a side note, the iframe / iframe_connected renderer types don’t produce any plot output in VS Code but the export to HTML works as expected. It seems that iframes are not working/are not supported in VS Code right now (it has worked a while back) - maybe worth another bug entry.

Export to PDF probably has the same issue - not checked.

Logs

Output for Jupyter in the Output panel (View→Output, change the drop-down the upper-right of the Output panel to Jupyter)

XXX

[congyiwu]

~The best~ (EDIT: another) workaround I’ve found is to enable multiple renders in Plotly. With the snippet below, I see a single interactive plot in both the VS Code UI and exported HTML.

• The Plotly docs suggest that enabling multiple renderers is the intended solution, although it would be nice if it just magically worked by default.
• The main downside (if you commit ipynb files to Git) is probably that this bloats the ipynb file, but I’m using the Jupytext for Notebooks VS Code extension to automatically strip outputs.
  • Actually I’m using a fork ofteh extension with some tweaks I’m trying to upstream.

import plotly.express as px
import plotly.io as pio

# This ensures Plotly output works in multiple places:
# plotly_mimetype: VS Code notebook UI
# notebook: "Jupyter: Export to HTML" command in VS Code
# See https://plotly.com/python/renderers/#multiple-renderers
pio.renderers.default = "plotly_mimetype+notebook"

fig = px.line(...)
fig.show()

[mikayla-eckelcifrese]

~The best~ (EDIT: another) workaround I’ve found is to enable multiple renders in Plotly. With the snippet below, I see a single interactive plot in both the VS Code UI and exported HTML.

• The Plotly docs suggest that enabling multiple renderers is the intended solution, although it would be nice if it just magically worked by default.

• The main downside (if you commit ipynb files to Git) is probably that this bloats the ipynb file, but I’m using the Jupytext for Notebooks VS Code extension to automatically strip outputs.

  • Actually I’m using a fork ofteh extension with some tweaks I’m trying to upstream.

import plotly.express as px
import plotly.io as pio

# This ensures Plotly output works in multiple places:
# plotly_mimetype: VS Code notebook UI
# notebook: "Jupyter: Export to HTML" command in VS Code
# See https://plotly.com/python/renderers/#multiple-renderers
pio.renderers.default = "plotly_mimetype+notebook"

fig = px.line(...)
fig.show()

Thank you SO MUCH for this!