Open
Conversation
nbviewer injects RequireJS; when plotly.js is loaded via a plain CDN <script>, it can be treated as an anonymous AMD/CommonJS module, triggering "Mismatched anonymous define()" and leaving `window.Plotly` undefined. - Wrap the CDN script tag with a guard that temporarily disables AMD/CommonJS detection and then restores it. - Drop the redundant connected renderer global-init module import. - Update renderer tests to cover the RequireJS guard and new init output.
Author
|
I have attempted a fix of this - full disclosure I used codex to do most of the work because I don't know the library well enough to attempt a fix myself. The original issue has been sitting around for a while so I thought it was better to attempt a fix with AI than leave it unresolved. I hope that's ok. I'm happy to take input/feedback. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fix Plotly CDN rendering in nbviewer (RequireJS “mismatched anonymous define()”)
Related issue: #5314 (reported by @mklilley)
Summary
This PR fixes a bug where Plotly figures render correctly in Google Colab, but fail to render when the same notebook is viewed on nbviewer. The failure presents as:
Uncaught Error: Mismatched anonymous define() module(RequireJS)Uncaught ReferenceError: Plotly is not definedRoot Cause
nbviewer loads RequireJS on the page. When Plotly is included via a plain CDN
<script src="/api/proxy?url=https%3A%2F%2Fcdn.plot.ly%2Fplotly-...min.js">, the Plotly bundle may detect an AMD/CommonJS environment (e.g.define.amd,module,exports) and register as an anonymous AMD module. RequireJS then throws the “mismatched anonymous define()” error, and Plotly does not end up attached towindow.Plotly, causing subsequentPlotly.newPlot(...)calls to fail.What This PR Changes
Guard Plotly CDN loading against RequireJS/AMD/CommonJS detection
plotly/io/_html.py, wheninclude_plotlyjs="cdn", the generated HTML now:define.amd,module, andexports.plotly-*.min.js.window.Plotlyis reliably defined in nbviewer.Remove redundant connected renderer global-init module import
plotly/io/_base_renderers.py,HtmlRenderer.activate()no longer injects an extra<script type="module">import ...</script>for connected renderers.Tests updated
tests/test_io/test_renderers.pyupdated to validate:Why This Approach
include_plotlyjs="cdn"behavior (still uses versioned CDN URL + SRI), while making it robust in AMD loader contexts.Files Changed
plotly/io/_html.pyplotly/io/_base_renderers.pytests/test_io/test_renderers.pyHow To Reproduce / Verify (from the issue)
pio.renderers.default = "notebook_connected+colab").Plotly is not defined, plot doesn’t render.Code PR
plotly.graph_objects, my modifications concern the code generator and not the generated files.include_plotlyjs="cdn"to avoid nbviewer/RequireJS breakage).