renderer changes for widgets renderer + controller function change

news/2 Fixes/6118.md

@@ -0,0 +1 @@
+Support the new renderer API in jupyter extension.

news/2 Fixes/6121.md

@@ -0,0 +1 @@
+Update to new notebookcontroller selection function name.

package.json

@@ -2052,7 +2052,7 @@
         "@types/tmp": "0.0.33",
         "@types/untildify": "^3.0.0",
         "@types/uuid": "^3.4.3",
-        "@types/vscode-notebook-renderer": "^1.57.2",
+        "@types/vscode-notebook-renderer": "^1.57.7",
         "@types/webpack-bundle-analyzer": "^2.13.0",
         "@types/winreg": "^1.2.30",
         "@types/ws": "^6.0.1",

src/client/datascience/notebook/vscodeNotebookController.ts

@@ -109,7 +109,7 @@ export class VSCodeNotebookController implements Disposable {
         this.controller.supportsExecutionOrder = true;
         this.controller.supportedLanguages = this.languageService.getSupportedLanguages(kernelConnection);
         // Hook up to see when this NotebookController is selected by the UI
-        this.controller.onDidChangeNotebookAssociation(this.onDidChangeNotebookAssociation, this, this.disposables);
+        this.controller.onDidChangeSelectedNotebooks(this.onDidChangeSelectedNotebooks, this, this.disposables);
     }
 
     public asWebviewUri(localResource: Uri): Uri {
@@ -166,7 +166,7 @@ export class VSCodeNotebookController implements Disposable {
         traceInfo(`Execute Cells request ${cells.length} ${cells.map((cell) => cell.index).join(', ')}`);
         await Promise.all(cells.map((cell) => this.executeCell(targetNotebook, cell)));
     }
-    private async onDidChangeNotebookAssociation(event: { notebook: NotebookDocument; selected: boolean }) {
+    private async onDidChangeSelectedNotebooks(event: { notebook: NotebookDocument; selected: boolean }) {
         // If this NotebookController was selected, fire off the event
         if (event.selected) {
             await this.updateCellLanguages(event.notebook);

src/datascience-ui/ipywidgets/kernel/index.ts

@@ -2,7 +2,6 @@
 // Licensed under the MIT License.
 /* eslint-disable no-console */
 import type { nbformat } from '@jupyterlab/coreutils';
-import { CellInfo } from 'vscode-notebook-renderer';
 import {
     IInteractiveWindowMapping,
     InteractiveWindowMessages
@@ -12,6 +11,7 @@ import { logMessage } from '../../react-common/logger';
 import { PostOffice } from '../../react-common/postOffice';
 import { WidgetManager } from '../common/manager';
 import { ScriptManager } from '../common/scriptManager';
+import { OutputItem } from 'vscode-notebook-renderer';
 
 class WidgetManagerComponent {
     private readonly widgetManager: WidgetManager;
@@ -90,10 +90,10 @@ const renderedWidgets = new Set<string>();
  * This will be exposed as a public method on window for renderer to render output.
  */
 let stackOfWidgetsRenderStatusByOutputId: { outputId: string; container: HTMLElement; success?: boolean }[] = [];
-export function renderOutput(outputId: string, cellInfo: CellInfo) {
+export function renderOutput(outputItem: OutputItem, element: HTMLElement) {
     try {
-        stackOfWidgetsRenderStatusByOutputId.push({ outputId: outputId, container: cellInfo.element });
-        const output = convertVSCodeOutputToExecutResultOrDisplayData(cellInfo);
+        stackOfWidgetsRenderStatusByOutputId.push({ outputId: outputItem.id, container: element });
+        const output = convertVSCodeOutputToExecuteResultOrDisplayData(outputItem);
 
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const model = output.data['application/vnd.jupyter.widget-view+json'] as any;
@@ -102,16 +102,16 @@ export function renderOutput(outputId: string, cellInfo: CellInfo) {
             return console.error('Nothing to render');
         }
         /* eslint-disable no-console */
-        renderIPyWidget(outputId, model, cellInfo.element);
+        renderIPyWidget(outputItem.id, model, element);
     } catch (ex) {
         console.error(`Failed to render ipywidget type`, ex);
         throw ex;
     }
 }
-export function disposeOutput(e: { outputId: string } | undefined) {
-    if (e) {
+export function disposeOutput(outputId?: string) {
+    if (outputId) {
         stackOfWidgetsRenderStatusByOutputId = stackOfWidgetsRenderStatusByOutputId.filter(
-            (item) => !(e.outputId in item)
+            (item) => !(outputId in item)
         );
     }
 }
@@ -196,18 +196,18 @@ function initialize() {
     }
 }
 
-function convertVSCodeOutputToExecutResultOrDisplayData(
-    cellInfo: CellInfo
+function convertVSCodeOutputToExecuteResultOrDisplayData(
+    outputItem: OutputItem
 ): nbformat.IExecuteResult | nbformat.IDisplayData {
     return {
         data: {
-            [cellInfo.mime]: cellInfo.mime.toLowerCase().includes('json') ? cellInfo.json() : cellInfo.text()
+            [outputItem.mime]: outputItem.mime.toLowerCase().includes('json') ? outputItem.json() : outputItem.text()
         },
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        metadata: (cellInfo.metadata as any) || {},
+        metadata: (outputItem.metadata as any) || {},
         execution_count: null,
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        output_type: (cellInfo.metadata as any)?.outputType || 'execute_result'
+        output_type: (outputItem.metadata as any)?.outputType || 'execute_result'
     };
 }
 

src/datascience-ui/ipywidgets/renderer/index.ts

@@ -2,27 +2,27 @@
 // Licensed under the MIT License.
 
 import './styles.css';
-import { ActivationFunction, CellInfo } from 'vscode-notebook-renderer';
+import { ActivationFunction, OutputItem } from 'vscode-notebook-renderer';
 
 export const activate: ActivationFunction = (_context) => {
     console.log('Jupyter IPyWidget Renderer Activated');
     return {
-        renderCell(outputId, info: CellInfo) {
+        renderOutputItem(outputItem: OutputItem, element: HTMLElement) {
             const renderOutputFunc =
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 (window as any).ipywidgetsKernel?.renderOutput || (global as any).ipywidgetsKernel?.renderOutput;
             if (renderOutputFunc) {
-                info.element.className = (info.element.className || '') + ' cell-output-ipywidget-background';
-                return renderOutputFunc(outputId, info);
+                element.className = (element.className || '') + ' cell-output-ipywidget-background';
+                return renderOutputFunc(outputItem, element);
             }
             console.error('Rendering widgets on notebook open is not supported.');
         },
-        destroyCell(outputId) {
+        disposeOutputItem(id?: string) {
             const disposeOutputFunc =
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 (window as any).ipywidgetsKernel?.disposeOutput || (global as any).ipywidgetsKernel?.disposeOutput;
             if (disposeOutputFunc) {
-                return disposeOutputFunc(outputId);
+                return disposeOutputFunc(id);
             }
         }
     };

vscode.d.ts

@@ -11834,7 +11834,8 @@ declare module 'vscode' {
 	 * There can be multiple controllers and the editor will let users choose which controller to use for a certain notebook. The
 	 * {@link NotebookController.notebookType `notebookType`}-property defines for what kind of notebooks a controller is for and
 	 * the {@link NotebookController.updateNotebookAffinity `updateNotebookAffinity`}-function allows controllers to set a preference
-	 * for specific notebook documents.
+	 * for specific notebook documents. When a controller has been selected its
+	 * {@link NotebookController.onDidChangeSelectedNotebooks onDidChangeSelectedNotebooks}-event fires.
 	 *
 	 * When a cell is being run the editor will invoke the {@link NotebookController.executeHandler `executeHandler`} and a controller
 	 * is expected to create and finalize a {@link NotebookCellExecution notebook cell execution}. However, controllers are also free
@@ -11929,12 +11930,16 @@ declare module 'vscode' {
 		interruptHandler?: (notebook: NotebookDocument) => void | Thenable<void>;
 
 		/**
-		 * An event that fires whenever a controller has been selected for a notebook document. Selecting a controller
-		 * for a notebook is a user gesture and happens either explicitly or implicitly when interacting while a
-		 * controller was suggested.
+		 * An event that fires whenever a controller has been selected or un-selected for a notebook document.
+		 *
+		 * There can be multiple controllers for a notebook and in that case a controllers needs to be _selected_. This is a user gesture
+		 * and happens either explicitly or implicitly when interacting with a notebook for which a controller was _suggested_. When possible,
+		 * the editor _suggests_ a controller that is most likely to be _selected_.
+		 *
+		 * _Note_ that controller selection is persisted (by the controllers {@link NotebookController.id id}) and restored as soon as a
+		 * controller is re-created or as a notebook is {@link workspace.onDidOpenNotebookDocument opened}.
 		 */
-		//todo@api selected vs associated, jsdoc
-		readonly onDidChangeNotebookAssociation: Event<{ notebook: NotebookDocument, selected: boolean }>;
+		readonly onDidChangeSelectedNotebooks: Event<{ notebook: NotebookDocument, selected: boolean }>;
 
 		/**
 		 * A controller can set affinities for specific notebook documents. This allows a controller