Show problem lines when notebook cell execution stops

Author: znorman-harris

CHANGELOG.md

@@ -32,6 +32,8 @@ Added the ability to convert a notebook to a PDF! This requires an additional ex
 
 For notebook cells, syntax errors are now highlighted and problems are reported on the lines that have errors. This behaves the same as PRO files when using the debug console as well.
 
+When you run a notebook cell, and IDL stops running, we now show the line in the cell that was stopped on to help track down problems.
+
 Improved the user experience for breakpoints when working with IDL. Some of the new behaviors include:
 
 - Properly setting breakpoints when you add them to a file before IDL starts

compliance/IMAGES.md

@@ -14,6 +14,11 @@ Updated as we go, but here is the source for the images that we use in the exten
   https://fonts.google.com/icons?selected=Material%20Symbols%20Outlined%3Abug_report%3AFILL%401%3Bwght%40400%3BGRAD%400%3Bopsz%4048
 - code.svg
   https://fonts.google.com/icons?selected=Material%20Symbols%20Outlined%3Acode%3AFILL%400%3Bwght%40400%3BGRAD%400%3Bopsz%4048
+- debug-stackframe.svg
+  From the VSCode icons repository on GitHub.
+  Repo: https://github.com/microsoft/vscode-icons
+  License: Creative Commons Attribution 4.0 International
+  License URL: https://github.com/microsoft/vscode-icons/blob/main/LICENSE
 - file-batch.svg
   https://fonts.google.com/icons?selected=Material%20Symbols%20Outlined%3Adescription%3AFILL%400%3Bwght%40400%3BGRAD%400%3Bopsz%4048
 - file-play.svg

extension/images/dark/debug-stackframe.svg

@@ -17,6 +17,8 @@ import {
   ICodeCoverageLookup,
   IDecorationLookup,
   IDLDecorationsResetFlag,
+  IStackTraceLookup,
+  STACK_TRACE_DECORATION,
   SYNTAX_ERROR_DECORATION,
 } from './idl-decorations-manager.interface';
 
@@ -35,9 +37,12 @@ export class IDLDecorationsManager {
     syntaxErrors: IDecorationLookup;
     /** Information about code coverage */
     coverage: ICodeCoverageLookup;
+    /** Information about the current stack */
+    stack: IStackTraceLookup;
   } = {
     syntaxErrors: {},
     coverage: {},
+    stack: {},
   };
 
   /**
@@ -112,6 +117,11 @@ export class IDLDecorationsManager {
     if (asString in this.decorations.coverage) {
       this.addCodeCoverageDecorations(uri, this.decorations.coverage[asString]);
     }
+
+    // apply stack trace decorations
+    if (asString in this.decorations.stack) {
+      this.addStackTraceDecorations(uri, this.decorations.stack[asString]);
+    }
   }
 
   /**
@@ -217,6 +227,8 @@ export class IDLDecorationsManager {
       // apply again
       if (reApply) {
         this.addSyntaxErrorDecorations(uri, errors);
+      } else {
+        delete this.decorations.syntaxErrors[uriStrings[i]];
       }
     }
   }
@@ -309,6 +321,68 @@ export class IDLDecorationsManager {
       // apply again
       if (reApply) {
         this.addCodeCoverageDecorations(uri, coverage);
+      } else {
+        delete this.decorations.coverage[uriStrings[i]];
+      }
+    }
+  }
+
+  /**
+   * Add decorations for stack track
+   */
+  addStackTraceDecorations(uri: vscode.Uri, lines: number[]) {
+    /** Get string URI */
+    const asString = uri.toString();
+
+    // save decorations
+    this.decorations.stack[asString] = lines;
+
+    /**
+     * Decorations for lines we are on
+     */
+    const show: vscode.DecorationOptions[] = [];
+
+    // process each line
+    for (let i = 0; i < lines.length; i++) {
+      show.push({ range: this._rangeFromLine(lines[i]) });
+    }
+
+    // apply decorations
+    this._applyDecorations(asString, STACK_TRACE_DECORATION, show);
+  }
+
+  /**
+   * Resets stack trace decorations
+   *
+   * Not private so it can be toggled on and off on demand
+   */
+  resetStackTraceDecorations(flag: IDLDecorationsResetFlag, reApply = false) {
+    /**
+     * Get all files we track
+     */
+    const uriStrings = Object.keys(this.decorations.stack);
+
+    // process each file
+    for (let i = 0; i < uriStrings.length; i++) {
+      // skip if we cant reset
+      if (!this._canResetEntry(uriStrings[i], flag)) {
+        continue;
+      }
+
+      /** Get stack trace */
+      const stack = this.decorations.stack[uriStrings[i]];
+
+      /** Parse as URI */
+      const uri = vscode.Uri.parse(uriStrings[i]);
+
+      // reset
+      this.addStackTraceDecorations(uri, []);
+
+      // apply again
+      if (reApply) {
+        this.addStackTraceDecorations(uri, stack);
+      } else {
+        delete this.decorations.stack[uriStrings[i]];
       }
     }
   }
@@ -342,15 +416,28 @@ export class IDLDecorationsManager {
    * Removes decorations for a given URI
    */
   remove(uri: vscode.Uri) {
+    /** Convert to string */
+    const asString = uri.toString();
+
+    // remove code coverage
     this.addCodeCoverageDecorations(uri, []);
+    delete this.decorations.coverage[asString];
+
+    // remove stack trace
+    this.addStackTraceDecorations(uri, []);
+    delete this.decorations.stack[asString];
+
+    // remove syntax errors
     this.addSyntaxErrorDecorations(uri, []);
+    delete this.decorations.syntaxErrors[asString];
   }
 
   /**
    * Resets or re-applies decorations
    */
   reset(flag: IDLDecorationsResetFlag, reApply = false) {
-    this._resetSyntaxErrorDecorations(flag, reApply);
     this.resetCodeCoverageDecorations(flag, reApply);
+    this.resetStackTraceDecorations(flag, reApply);
+    this._resetSyntaxErrorDecorations(flag, reApply);
   }
 }

extension/images/light/debug-stackframe.svg

@@ -1,4 +1,5 @@
 import { IDLCodeCoverage } from '@idl/idl';
+import { GetExtensionPath } from '@idl/shared';
 import * as vscode from 'vscode';
 
 /** When resetting decorations, what do we reset for? */
@@ -24,6 +25,32 @@ export interface ICodeCoverageLookup {
   [key: string]: IDLCodeCoverage;
 }
 
+/**
+ * Data structure for stack trace
+ */
+export interface IStackTraceLookup {
+  [key: string]: number[];
+}
+
+/**
+ * Decorate stack trace lines
+ *
+ * From: https://github.com/ryanluker/vscode-coverage-gutters/blob/master/package.json#L47-L76
+ */
+export const STACK_TRACE_DECORATION =
+  vscode.window.createTextEditorDecorationType({
+    backgroundColor: 'rgba(163, 149, 0, 0.4)',
+    gutterIconPath: GetExtensionPath(
+      'extension/images/dark/debug-stackframe.svg'
+    ),
+    light: {
+      backgroundColor: 'rgba(255, 235, 0, 0.2)',
+      gutterIconPath: GetExtensionPath(
+        'extension/images/light/debug-stackframe.svg'
+      ),
+    },
+  });
+
 /**
  * Decorate problem lines
  *

libs/vscode/decorations/src/lib/idl-decorations-manager.class.ts

@@ -156,14 +156,8 @@ export class IDLNotebookController {
         log: IDL_NOTEBOOK_LOG,
         content: [`Stopped because: "${reason}"`, stack],
       });
+
       await this._endCellExecution(false);
-      // this.stopped = {
-      //   reason,
-      //   stack,
-      // };
-      // this.sendEvent(
-      //   new StoppedEvent(this.stopped.reason, IDLDebugAdapter.THREAD_ID)
-      // );
     });
 
     // listen for debug output
@@ -386,6 +380,25 @@ export class IDLNotebookController {
 
     // always return from current scope
     if (this.isStarted()) {
+      // get the current scope
+      const stack = (await this._runtime.getCurrentStack()).reverse();
+
+      // get the fsPath for the current cell
+      const fsPath = IDLFileHelper.notebookCellUriToFSPath(
+        cell.cell.document.uri
+      );
+
+      /** Check if any of our scope items are in this notebook cell */
+      const ourFile = stack.filter((item) => item.file === fsPath);
+
+      // see if we have a location we stopped on
+      if (ourFile.length > 0) {
+        IDL_DECORATIONS_MANAGER.addStackTraceDecorations(
+          cell.cell.document.uri,
+          ourFile.map((item) => item.line - 1) // in notebooks, we need zero-based instead of one
+        );
+      }
+
       /**
        * Commands to run after executing a cell
        *
@@ -731,6 +744,9 @@ export class IDLNotebookController {
     // reset cell output
     execution.clearOutput();
 
+    // reset stack trace
+    IDL_DECORATIONS_MANAGER.resetStackTraceDecorations('notebook');
+
     /** Folder where we write notebook cell, check if NB is saved to disk  */
     const nbDir =
       cell.notebook.uri.scheme === 'file'