@jupyterlab/debugger 4.0.0-alpha.9 → 4.0.0-beta.0

package/src/panels/kernelSources/index.tsx

@@ -0,0 +1,106 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+
+import { ITranslator, nullTranslator } from '@jupyterlab/translation';
+
+import { showErrorMessage } from '@jupyterlab/apputils';
+
+import {
+  PanelWithToolbar,
+  refreshIcon,
+  searchIcon,
+  ToolbarButton
+} from '@jupyterlab/ui-components';
+
+import { IDebugger } from '../../tokens';
+
+import { KernelSourcesBody } from './body';
+
+/**
+ * A Panel that shows a preview of the source code while debugging.
+ */
+export class KernelSources extends PanelWithToolbar {
+  /**
+   * Instantiate a new Sources preview Panel.
+   *
+   * @param options The Sources instantiation options.
+   */
+  constructor(options: KernelSources.IOptions) {
+    super();
+    const { model, service } = options;
+    this._model = model;
+    const trans = (options.translator ?? nullTranslator).load('jupyterlab');
+    this.title.label = trans.__('Kernel Sources');
+    this.toolbar.addClass('jp-DebuggerKernelSources-header');
+
+    this._body = new KernelSourcesBody({
+      service,
+      model,
+      translator: options.translator
+    });
+
+    this.toolbar.addItem(
+      'open-filter',
+      new ToolbarButton({
+        icon: searchIcon,
+        onClick: async (): Promise<void> => {
+          this._body.toggleFilterbox();
+        },
+        tooltip: trans.__('Toggle search filter')
+      })
+    );
+
+    this.toolbar.addItem(
+      'refresh',
+      new ToolbarButton({
+        icon: refreshIcon,
+        onClick: () => {
+          this._model.kernelSources = [];
+          void service.displayModules().catch(reason => {
+            void showErrorMessage(
+              trans.__('Fail to get kernel sources'),
+              trans.__('Fail to get kernel sources:\n%2', reason)
+            );
+          });
+        },
+        tooltip: trans.__('Refresh kernel sources')
+      })
+    );
+
+    this.addClass('jp-DebuggerKernelSources-header');
+    this.addWidget(this._body);
+    this.addClass('jp-DebuggerKenelSources');
+  }
+
+  public set filter(filter: string) {
+    this._model.filter = filter;
+  }
+
+  private _model: IDebugger.Model.IKernelSources;
+  private _body: KernelSourcesBody;
+}
+
+/**
+ * A namespace for `Sources` statics.
+ */
+export namespace KernelSources {
+  /**
+   * The options used to create a Sources.
+   */
+  export interface IOptions {
+    /**
+     * The debugger service.
+     */
+    service: IDebugger;
+
+    /**
+     * The model for the sources.
+     */
+    model: IDebugger.Model.IKernelSources;
+
+    /**
+     * The application language translator
+     */
+    translator?: ITranslator;
+  }
+}

package/src/panels/kernelSources/model.ts

@@ -0,0 +1,160 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+
+import { ISignal, Signal } from '@lumino/signaling';
+
+import { Debouncer } from '@lumino/polling';
+
+import { IDebugger } from '../../tokens';
+
+/**
+ * The rate limit for the filter debouncer
+ */
+const DEBOUNCER_RATE_LIMIT_MS = 500;
+
+const compare = (a: IDebugger.KernelSource, b: IDebugger.KernelSource) => {
+  if (a.name < b.name) {
+    return -1;
+  }
+  if (a.name > b.name) {
+    return 1;
+  }
+  return 0;
+};
+
+/**
+ * The model to keep track of the current source being displayed.
+ */
+export class KernelSourcesModel implements IDebugger.Model.IKernelSources {
+  constructor() {
+    this.refresh = this.refresh.bind(this);
+    this._refreshDebouncer = new Debouncer(
+      this.refresh,
+      DEBOUNCER_RATE_LIMIT_MS
+    );
+  }
+
+  /**
+   * Get the filter.
+   */
+  get filter(): string {
+    return this._filter;
+  }
+
+  /**
+   * Set the filter.
+   * The update
+   */
+  set filter(filter: string) {
+    this._filter = filter;
+    this._filterChanged.emit(filter);
+    void this._refreshDebouncer.invoke();
+  }
+
+  /**
+   * Whether the kernel sources model is disposed or not.
+   */
+  get isDisposed(): boolean {
+    return this._isDisposed;
+  }
+
+  /**
+   * Get the kernel sources.
+   */
+  get kernelSources(): IDebugger.KernelSource[] | null {
+    return this._kernelSources;
+  }
+
+  /**
+   * Set the kernel sources and emit a changed signal.
+   */
+  set kernelSources(kernelSources: IDebugger.KernelSource[] | null) {
+    this._kernelSources = kernelSources;
+    this.refresh();
+  }
+
+  /**
+   * Signal emitted when the current source changes.
+   */
+  get changed(): ISignal<this, IDebugger.KernelSource[] | null> {
+    return this._changed;
+  }
+
+  /**
+   * Signal emitted when the current source changes.
+   */
+  get filterChanged(): ISignal<this, string> {
+    return this._filterChanged;
+  }
+
+  /**
+   * Signal emitted when a kernel source should be open in the main area.
+   */
+  get kernelSourceOpened(): ISignal<this, IDebugger.Source | null> {
+    return this._kernelSourceOpened;
+  }
+
+  /**
+   * Dispose the kernel sources model
+   */
+  dispose(): void {
+    if (this._isDisposed) {
+      return;
+    }
+    this._isDisposed = true;
+    this._refreshDebouncer.dispose();
+    Signal.clearData(this);
+  }
+
+  /**
+   * Open a source in the main area.
+   */
+  open(kernelSource: IDebugger.Source): void {
+    this._kernelSourceOpened.emit(kernelSource);
+  }
+
+  private getFilteredKernelSources() {
+    const regexp = new RegExp(this._filter);
+    return this._kernelSources!.filter(module => regexp.test(module.name));
+  }
+
+  private refresh() {
+    if (this._kernelSources) {
+      this._filteredKernelSources = this._filter
+        ? this.getFilteredKernelSources()
+        : this._kernelSources;
+      this._filteredKernelSources.sort(compare);
+    } else {
+      this._kernelSources = new Array<IDebugger.KernelSource>();
+      this._filteredKernelSources = new Array<IDebugger.KernelSource>();
+    }
+    this._changed.emit(this._filteredKernelSources);
+  }
+
+  private _filteredKernelSources: IDebugger.KernelSource[] | null = null;
+  private _filter = '';
+  private _isDisposed = false;
+  private _kernelSources: IDebugger.KernelSource[] | null = null;
+  private _refreshDebouncer: Debouncer;
+  private _changed = new Signal<this, IDebugger.KernelSource[] | null>(this);
+  private _filterChanged = new Signal<this, string>(this);
+  private _kernelSourceOpened = new Signal<this, IDebugger.Source | null>(this);
+}
+
+/**
+ * A namespace for SourcesModel `statics`.
+ */
+export namespace KernelSourcesModel {
+  /**
+   * The options used to initialize a SourcesModel object.
+   */
+  export interface IOptions {
+    /**
+     * Signal emitted when the current frame changes.
+     */
+    currentFrameChanged: ISignal<
+      IDebugger.Model.ICallstack,
+      IDebugger.IStackFrame | null
+    >;
+  }
+}

package/src/panels/sources/body.ts

@@ -0,0 +1,161 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+
+import {
+  CodeEditorWrapper,
+  IEditorMimeTypeService,
+  IEditorServices
+} from '@jupyterlab/codeeditor';
+
+import { Signal } from '@lumino/signaling';
+
+import { PanelLayout, Widget } from '@lumino/widgets';
+
+import { Debugger } from '../..';
+
+import { EditorHandler } from '../../handlers/editor';
+
+import { IDebugger } from '../../tokens';
+
+/**
+ * The body for a Sources Panel.
+ */
+export class SourcesBody extends Widget {
+  /**
+   * Instantiate a new Body for the SourcesBody widget.
+   *
+   * @param options The instantiation options for a SourcesBody.
+   */
+  constructor(options: SourcesBody.IOptions) {
+    super();
+    this._model = options.model;
+    this._debuggerService = options.service;
+    this._mimeTypeService = options.editorServices.mimeTypeService;
+
+    const factory = new Debugger.ReadOnlyEditorFactory({
+      editorServices: options.editorServices
+    });
+
+    this._editor = factory.createNewEditor({
+      content: '',
+      mimeType: '',
+      path: ''
+    });
+    this._editor.hide();
+
+    this._model.currentFrameChanged.connect(async (_, frame) => {
+      if (!frame) {
+        this._clearEditor();
+        return;
+      }
+
+      void this._showSource(frame);
+    });
+
+    const layout = new PanelLayout();
+    layout.addWidget(this._editor);
+    this.layout = layout;
+
+    this.addClass('jp-DebuggerSources-body');
+  }
+
+  /**
+   * Dispose the sources body widget.
+   */
+  dispose(): void {
+    if (this.isDisposed) {
+      return;
+    }
+    this._editorHandler?.dispose();
+    Signal.clearData(this);
+    super.dispose();
+  }
+
+  /**
+   * Clear the content of the source read-only editor.
+   */
+  private _clearEditor(): void {
+    this._model.currentSource = null;
+    this._editor.hide();
+  }
+
+  /**
+   * Show the content of the source for the given frame.
+   *
+   * @param frame The current frame.
+   */
+  private async _showSource(frame: IDebugger.IStackFrame): Promise<void> {
+    const path = frame.source?.path;
+    const source = await this._debuggerService.getSource({
+      sourceReference: 0,
+      path
+    });
+
+    if (!source?.content) {
+      this._clearEditor();
+      return;
+    }
+
+    if (this._editorHandler) {
+      this._editorHandler.dispose();
+    }
+
+    const { content, mimeType } = source;
+    const editorMimeType =
+      mimeType || this._mimeTypeService.getMimeTypeByFilePath(path ?? '');
+
+    this._editor.model.sharedModel.setSource(content);
+    this._editor.model.mimeType = editorMimeType;
+
+    this._editorHandler = new EditorHandler({
+      debuggerService: this._debuggerService,
+      editorReady: () => Promise.resolve(this._editor.editor),
+      getEditor: () => this._editor.editor,
+      path,
+      src: this._editor.model.sharedModel
+    });
+
+    this._model.currentSource = {
+      content,
+      mimeType: editorMimeType,
+      path: path ?? ''
+    };
+
+    requestAnimationFrame(() => {
+      EditorHandler.showCurrentLine(this._editor.editor, frame.line);
+    });
+
+    this._editor.show();
+  }
+
+  private _model: IDebugger.Model.ISources;
+  private _editor: CodeEditorWrapper;
+  private _editorHandler: EditorHandler;
+  private _debuggerService: IDebugger;
+  private _mimeTypeService: IEditorMimeTypeService;
+}
+
+/**
+ * A namespace for SourcesBody `statics`.
+ */
+export namespace SourcesBody {
+  /**
+   * Instantiation options for `Breakpoints`.
+   */
+  export interface IOptions {
+    /**
+     * The debug service.
+     */
+    service: IDebugger;
+
+    /**
+     * The sources model.
+     */
+    model: IDebugger.Model.ISources;
+
+    /**
+     * The editor services used to create new read-only editors.
+     */
+    editorServices: IEditorServices;
+  }
+}

package/src/panels/sources/index.tsx

@@ -0,0 +1,85 @@
+/*-----------------------------------------------------------------------------
+| Copyright (c) Jupyter Development Team.
+| Distributed under the terms of the Modified BSD License.
+|----------------------------------------------------------------------------*/
+
+import { IEditorServices } from '@jupyterlab/codeeditor';
+import { ITranslator, nullTranslator } from '@jupyterlab/translation';
+import { PanelWithToolbar, ToolbarButton } from '@jupyterlab/ui-components';
+import { viewBreakpointIcon } from '../../icons';
+import { IDebugger } from '../../tokens';
+import { SourcePathComponent } from './sourcepath';
+import { SourcesBody } from './body';
+import { ReactWidget } from '@jupyterlab/ui-components';
+import React from 'react';
+
+/**
+ * A Panel that shows a preview of the source code while debugging.
+ */
+export class Sources extends PanelWithToolbar {
+  /**
+   * Instantiate a new Sources preview Panel.
+   *
+   * @param options The Sources instantiation options.
+   */
+  constructor(options: Sources.IOptions) {
+    super();
+    const { model, service, editorServices } = options;
+    const trans = (options.translator ?? nullTranslator).load('jupyterlab');
+    this.title.label = trans.__('Source');
+
+    this.toolbar.addClass('jp-DebuggerSources-header');
+    const body = new SourcesBody({
+      service,
+      model,
+      editorServices
+    });
+    this.toolbar.addItem(
+      'open',
+      new ToolbarButton({
+        icon: viewBreakpointIcon,
+        onClick: (): void => model.open(),
+        tooltip: trans.__('Open in the Main Area')
+      })
+    );
+    const sourcePath = ReactWidget.create(
+      <SourcePathComponent model={model} />
+    );
+
+    this.toolbar.addItem('sourcePath', sourcePath);
+    this.addClass('jp-DebuggerSources-header');
+
+    this.addWidget(body);
+    this.addClass('jp-DebuggerSources');
+  }
+}
+
+/**
+ * A namespace for `Sources` statics.
+ */
+export namespace Sources {
+  /**
+   * The options used to create a Sources.
+   */
+  export interface IOptions {
+    /**
+     * The debugger service.
+     */
+    service: IDebugger;
+
+    /**
+     * The model for the sources.
+     */
+    model: IDebugger.Model.ISources;
+
+    /**
+     * The editor services used to create new read-only editors.
+     */
+    editorServices: IEditorServices;
+
+    /**
+     * The application language translator
+     */
+    translator?: ITranslator;
+  }
+}

package/src/panels/sources/model.ts

@@ -0,0 +1,94 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+
+import { ISignal, Signal } from '@lumino/signaling';
+
+import { IDebugger } from '../../tokens';
+
+/**
+ * The model to keep track of the current source being displayed.
+ */
+export class SourcesModel implements IDebugger.Model.ISources {
+  /**
+   * Instantiate a new Sources.Model
+   *
+   * @param options The Sources.Model instantiation options.
+   */
+  constructor(options: SourcesModel.IOptions) {
+    this.currentFrameChanged = options.currentFrameChanged;
+  }
+
+  /**
+   * Signal emitted when the current frame changes.
+   */
+  readonly currentFrameChanged: ISignal<
+    IDebugger.Model.ICallstack,
+    IDebugger.IStackFrame | null
+  >;
+
+  /**
+   * Signal emitted when a source should be open in the main area.
+   */
+  get currentSourceOpened(): ISignal<SourcesModel, IDebugger.Source | null> {
+    return this._currentSourceOpened;
+  }
+
+  /**
+   * Signal emitted when the current source changes.
+   */
+  get currentSourceChanged(): ISignal<SourcesModel, IDebugger.Source | null> {
+    return this._currentSourceChanged;
+  }
+
+  /**
+   * Return the current source.
+   */
+  get currentSource(): IDebugger.Source | null {
+    return this._currentSource;
+  }
+
+  /**
+   * Set the current source.
+   *
+   * @param source The source to set as the current source.
+   */
+  set currentSource(source: IDebugger.Source | null) {
+    this._currentSource = source;
+    this._currentSourceChanged.emit(source);
+  }
+
+  /**
+   * Open a source in the main area.
+   */
+  open(): void {
+    this._currentSourceOpened.emit(this._currentSource);
+  }
+
+  private _currentSource: IDebugger.Source | null;
+  private _currentSourceOpened = new Signal<
+    SourcesModel,
+    IDebugger.Source | null
+  >(this);
+  private _currentSourceChanged = new Signal<
+    SourcesModel,
+    IDebugger.Source | null
+  >(this);
+}
+
+/**
+ * A namespace for SourcesModel `statics`.
+ */
+export namespace SourcesModel {
+  /**
+   * The options used to initialize a SourcesModel object.
+   */
+  export interface IOptions {
+    /**
+     * Signal emitted when the current frame changes.
+     */
+    currentFrameChanged: ISignal<
+      IDebugger.Model.ICallstack,
+      IDebugger.IStackFrame | null
+    >;
+  }
+}

package/src/panels/sources/sourcepath.tsx

@@ -0,0 +1,28 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+
+import { UseSignal } from '@jupyterlab/ui-components';
+import React from 'react';
+import { IDebugger } from '../../tokens';
+
+/**
+ * A React component to display the path to a source.
+ *
+ * @param {object} props The component props.
+ * @param props.model The model for the sources.
+ */
+export const SourcePathComponent = ({
+  model
+}: {
+  model: IDebugger.Model.ISources;
+}): JSX.Element => {
+  return (
+    <UseSignal signal={model.currentSourceChanged} initialSender={model}>
+      {(model): JSX.Element => (
+        <span onClick={(): void => model?.open()}>
+          {model?.currentSource?.path ?? ''}
+        </span>
+      )}
+    </UseSignal>
+  );
+};