Registering a custom plugin breaks html export #2950
Description
Bug Report
When a custom plugin is registered on a perspective viewer and the view is exported as html,
on opening the html an error is thrown since perspective tries to load the plugin from a cdn (but since it's a custom plugin it doesn't exist there)
Steps to Reproduce:
Can be reproduced in a perspective viewer by registering a custom plugin and then opening the exported html file.
I have an example at https://github.com/aszenz/data-viz.
Actual Result:
Using v3.4.0 on chromium linux i get a console error on opening the exported html file
console error
Loading module from “https://cdn.jsdelivr.net/npm/@finos/perspective-viewer-summary@3.4.0/dist/cdn/perspective-viewer-summary.js” was blocked because of a disallowed MIME type (“text/plain”).
untitled(1).html
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://cdn.jsdelivr.net/npm/@finos/perspective-viewer-summary@3.4.0/dist/cdn/perspective-viewer-summary.js. (Reason: CORS request did not succeed). Status code: (null).
Module source URI is not allowed in this document: “https://cdn.jsdelivr.net/npm/@finos/perspective-viewer-summary@3.4.0/dist/cdn/perspective-viewer-summary.js”. untitled(1).html
Loading failed for the module with source “https://cdn.jsdelivr.net/npm/@finos/perspective-viewer-datagrid@3.4.0/dist/cdn/perspective-viewer-datagrid.js”. untitled(1).html
Loading failed for the module with source “https://cdn.jsdelivr.net/npm/@finos/perspective-viewer-d3fc@3.4.0/dist/cdn/perspective-viewer-d3fc.js”.
Environment:
For JavaScript (browser):
- v3.4.0
- Firefox/Chromium (generic issue)
- Linux
Additional Context:
Perspective's custom plugin api is lacking a way to specify how to load external plugins (outside @finos) inline.
Since html export solution uses cdn to load libs, I suggest adding a way to specify the cdn url of the plugin when registering it with the viewer.
Something like this
customElements
.get('perspective-viewer')
.registerPlugin('perspective-viewer-plugin', 'https://cdn.jsdeliver.net/npm/@custom/plugin.js')
;This is a short term solution, a long term option might be to create a plugin registry where the community could upload plugins, and the viewer can easily download them from a known source.