Dynamically load IPyWidgets 7 (#21)

.azure-pipelines/pipeline.yml

@@ -4,6 +4,7 @@ trigger:
   branches:
     include:
       - main
+      - release/ipywidgets7.2
 pr: none
 
 resources:

.gitignore

@@ -7,3 +7,4 @@ npm-debug.log
 bin/**
 obj/**
 tmp/**
+tsconfig.tsbuildinfo

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@vscode/jupyter-ipywidgets7",
-    "version": "1.0.3",
+    "version": "2.0.0",
     "main": "dist/ipywidgets.js",
     "license": "MIT",
     "repository": {

src/index.ts

@@ -4,50 +4,60 @@
 import * as base from '@jupyter-widgets/base';
 import * as widgets from '@jupyter-widgets/controls';
 import * as outputWidgets from '@jupyter-widgets/jupyterlab-manager/lib/output';
-import * as embed from './embed';
 import { WidgetManager } from './manager';
-import './widgets.css';
 
-type KernelMessagingApi = {
-    postKernelMessage: (data: unknown) => void;
-};
-
-// Default logger is console.log
-let logger = console.log;
+let loaded = false;
+function load() {
+    if (loaded) {
+        console.warn('Already loaded ipywidgets7');
+        return;
+    }
+    require('./widgets.css');
+    require('../node_modules/@fortawesome/fontawesome-free/css/all.min.css');
+    // Export the following for `requirejs`.
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any, no-empty,@typescript-eslint/no-empty-function
+    const define = (window as any).define || function () {};
+    define('@jupyter-widgets/controls', () => widgets);
+    define('@jupyter-widgets/base', () => base);
+    define('@jupyter-widgets/output', () => outputWidgets);
 
-// Export the following for `requirejs`.
-// eslint-disable-next-line @typescript-eslint/no-explicit-any, no-empty,@typescript-eslint/no-empty-function
-const define = (window as any).define || function () {};
-define('@jupyter-widgets/controls', () => widgets);
-define('@jupyter-widgets/base', () => base);
-define('@jupyter-widgets/output', () => outputWidgets);
+    // Create our window export. Necessary for the ipywidget code loading in the output to find our widget manager
+    // Jupyter extension will look for the WidgetManager in this object.
 
-// Render existing widgets without a kernel and pull in the correct css files
-// This is not done yet. See this issue here: https://github.com/microsoft/vscode-python/issues/10794
-// Likely we'll do this in a different spot.
-if (document.readyState === 'complete') {
-    embed.renderWidgets(document.documentElement, logger);
-} else {
-    window.addEventListener('load', () => {
-        embed.renderWidgets(document.documentElement, logger);
-    });
+    // tslint:disable-next-line: no-any
+    (window as any).vscIPyWidgets = {
+        WidgetManager
+    };
+    loaded = true;
 }
+function unload() {
+    if (!loaded) {
+        return;
+    }
 
-// Create our window export. Necessary for the ipywidget code loading in the output to find our widget manager
-// tslint:disable-next-line: no-any
-(window as any).vscIPyWidgets = {
-    WidgetManager
-};
+    try {
+        const undef = (window as any).undef || function () {};
+        undef('@jupyter-widgets/controls');
+        undef('@jupyter-widgets/base');
+        undef('@jupyter-widgets/output');
+        loaded = false;
+    } catch (e) {
+        console.warn(`Failed to unload IPYWidgets 7`, e);
+    }
+}
 
-// Has to be this form for VS code to load it correctly
-export function activate(context?: KernelMessagingApi) {
-    // Setup the logger function
-    if (context) {
-        logger = (msg) => {
-            context.postKernelMessage({
-                type: 'IPyWidgets_logMessage',
-                payload: msg
-            });
+/**
+ * Activate function is required by VS Code.
+ */
+export function activate() {
+    // Expose an object with load and unload functions.
+    // So that we can dynamically load and unload them.
+    // This script file along with the ipywidgets 8 version will be loaded into the same webpage
+    // However depending on the version of IPyWidgets we load only one of them.
+    if (!(window as any).vscIPyWidgets7) {
+        (window as any).vscIPyWidgets7 = {
+            load,
+            unload
         };
     }
 }