vscode-jupyter: Plotly output generated with 'notebook' renderer not shown after re-opening notebook

Environment data

  • VS Code version: 1.58.0-insider
  • Jupyter Extension version (available under the Extensions sidebar): v2021.7.978384885
  • Python Extension version (available under the Extensions sidebar): v2021.7.969414671-dev
  • OS (Windows | Mac | Linux distro) and version: Win 10.0.19043
  • Python and/or Anaconda version: 3.9.0 64-bit
  • Type of virtual environment used (N/A | venv | virtualenv | conda | …): N/A
  • Jupyter server running: Local

Expected behaviour

Plotly graphs are shown after re-opening a saved Jupyter notebook with these graphs

Actual behaviour

The ouput is blank after re-opening a notebook that contains cell output using the Plotly ‘notebook’ renderer. The graphs are shown correctly after re-executing the affected cells. Related to the fix for #6334 and merge #6318 with which support for the ‘notebook’ renderer was added.

Log output:

VM12:5 Uncaught TypeError: require.undef is not a function
    at <anonymous>:5:17
    at h (vscode-webview://f620ad82-e8b9-40f2-a1ab-808101a5c2a2/notebookWebviewPreloads.js:3)
    at vscode-webview://f620ad82-e8b9-40f2-a1ab-808101a5c2a2/notebookWebviewPreloads.js:3
resourceLoading.ts:82 Error: Unable to read file 'c:\Temp\plotly.js' (Error: Unable to resolve non-existing file 'c:\Temp\plotly.js')
    at ai.doReadFileStream (fileService.ts:539)
    at async Object.w [as loadLocalResource] (resourceLoading.ts:68)
    at async u.loadResource (baseWebviewElement.ts:530)
plotly.js:1 Failed to load resource: the server responded with a status of 404 ()
VM14:4 Registering custom require.js for Jupyter Kernel

The logs indicate that require.js is available only after the initial try to display the cell content which fails with 404.

Steps to reproduce:

import plotly.express as px
df = px.data.gapminder()
fig = px.scatter(df, x="gdpPercap", y="lifeExp", animation_frame="year", animation_group="country",
           size="pop", color="continent", hover_name="country",
           log_x=True, size_max=55, range_x=[100,100000], range_y=[25,90])
fig.show(renderer='notebook')
  1. Run notebook confirming that graphs are working normal
  2. Save notebook
  3. Close and re-open notebook
  4. Only blank cell output is shown where the graph should be
  5. Re-running the notebook creates the graph again

Logs

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

XXX

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Reactions: 1
  • Comments: 22 (18 by maintainers)

Most upvoted comments

LGTM now, thanks!

@DonJayamanne I tried to run the original code snippet in the issue description but the output is not rendered and here are the logs in devtools

Failed to load resource: the server responded with a status of 404 ()
loader.js:277 Loading "plotly" failed
_ @ loader.js:277
loader.js:278 Error: [object Event]
    at Object.E [as ensureError] (loader.js:260:22)
    at s._createLoadError (loader.js:1512:33)
    at s._onLoadError (loader.js:1523:30)
    at a (loader.js:1669:27)
    at Object.errorback (loader.js:1689:25)
    at e.triggerErrorback (loader.js:635:36)
    at loader.js:622:151
    at HTMLScriptElement.a (loader.js:658:17)
_ @ loader.js:278
loader.js:279 Here are the modules that depend on it:

@jackthepanisher This will be fixed in the next version (I’ve tested this and it now works in the latest dev bits). Fixed here https://github.com/microsoft/vscode-notebook-renderers/pull/130

Closing with instructions for testing in the next pre-release of the Jupyter exesnion and latest version of Jupyter Notebook Renderers

Instructions for testing - see the instructions at the top of the issue.

@rchiodo I might have been wrong about not needing require.js in the notebook renderers. Having it there might do the trick for when the preloads have not run yet.