4016-debug-extension: support debugging of extensions using Debug panel

1. Supports start, restart, stop of pwa-extensionHost launch type on debug toolbar.
2. Utilizes Hosted Plugin functionality.

Signed-off-by: Dan Arad <[email protected]>

Author: danarad05

CHANGELOG.md

@@ -121,6 +121,7 @@
 - [core] updated `nsfw` dependency to `^2.1.2` [#9267](https://github.com/eclipse-theia/theia/pull/9267)
 - [debug] fixed hover issues for the `currentFrame` editor [#9256](https://github.com/eclipse-theia/theia/pull/9256)
 - [debug] improved error messages [#9386](https://github.com/eclipse-theia/theia/pull/9386)
+- [debug] added support for managing debug sessions for extensions from debug panel (previously only possible using `Hosted Plugin` commands) [#8706](https://github.com/eclipse-theia/theia/pull/8706)
 - [documentation] added roadmap information to the readme [#9308](https://github.com/eclipse-theia/theia/pull/9308)
 - [documentation] updated pre-publishing steps [#9257](https://github.com/eclipse-theia/theia/pull/9257)
 - [editor-preview] updated logic to activate editor-preview editors only if already active [#9346](https://github.com/eclipse-theia/theia/pull/9346)

packages/debug/src/browser/debug-contribution.ts

@@ -0,0 +1,49 @@
+/********************************************************************************
+ * Copyright (c) 2021 SAP SE or an SAP affiliate company and others.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License v. 2.0 which is available at
+ * http://www.eclipse.org/legal/epl-2.0.
+ *
+ * This Source Code may also be made available under the following Secondary
+ * Licenses when the conditions for such availability set forth in the Eclipse
+ * Public License v. 2.0 are satisfied: GNU General Public License, version 2
+ * with the GNU Classpath Exception which is available at
+ * https://www.gnu.org/software/classpath/license.html.
+ *
+ * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
+ ********************************************************************************/
+
+import { DebugProtocol } from 'vscode-debugprotocol';
+import { DebugSessionConnection } from './debug-session-connection';
+
+export const DebugContribution = Symbol('DebugContribution');
+
+export interface DebugContribution {
+    register(configType: string, connection: DebugSessionConnection): void;
+}
+
+export interface DebugPluginConfiguration {
+    debugMode?: string;
+    pluginLocation?: string;
+    debugPort?: string;
+}
+
+// copied from https://github.com/microsoft/vscode-node-debug2/blob/bcd333ef87642b817ac96d28fde7ab96fee3f6a9/src/nodeDebugInterfaces.d.ts
+export interface LaunchVSCodeRequest extends DebugProtocol.Request {
+    arguments: LaunchVSCodeArguments;
+}
+
+export interface LaunchVSCodeArguments {
+    args: LaunchVSCodeArgument[];
+    env?: { [key: string]: string | null; };
+}
+
+export interface LaunchVSCodeArgument {
+    prefix?: string;
+    path?: string;
+}
+
+export interface LaunchVSCodeResult {
+    rendererDebugPort?: number;
+}

packages/debug/src/browser/debug-frontend-application-contribution.ts

@@ -611,11 +611,11 @@ export class DebugFrontendApplicationContribution extends AbstractViewContributi
             execute: (config?: DebugSessionOptions) => this.start(true, config)
         });
         registry.registerCommand(DebugCommands.STOP, {
-            execute: () => this.manager.currentSession && this.manager.currentSession.terminate(),
+            execute: () => this.manager.terminateSessions(),
             isEnabled: () => this.manager.state !== DebugState.Inactive
         });
         registry.registerCommand(DebugCommands.RESTART, {
-            execute: () => this.manager.restart(),
+            execute: () => this.manager.restartSessions(),
             isEnabled: () => this.manager.state !== DebugState.Inactive
         });
 

packages/debug/src/browser/debug-frontend-module.ts

@@ -60,8 +60,11 @@ import { JsonSchemaContribution } from '@theia/core/lib/browser/json-schema-stor
 import { TabBarDecorator } from '@theia/core/lib/browser/shell/tab-bar-decorator';
 import { DebugTabBarDecorator } from './debug-tab-bar-decorator';
 import { QuickAccessContribution } from '@theia/core/lib/browser/quick-input/quick-access-contribution';
+import { DebugContribution } from './debug-contribution';
 
 export default new ContainerModule((bind: interfaces.Bind) => {
+    bindContributionProvider(bind, DebugContribution);
+
     bind(DebugCallStackItemTypeKey).toDynamicValue(({ container }) =>
         container.get(ContextKeyService).createKey('callStackItemType', undefined)
     ).inSingletonScope();

packages/debug/src/browser/debug-session-contribution.ts

@@ -30,6 +30,7 @@ import { IWebSocket } from '@theia/core/shared/vscode-ws-jsonrpc';
 import { DebugAdapterPath } from '../common/debug-service';
 import { ContributionProvider } from '@theia/core/lib/common/contribution-provider';
 import { FileService } from '@theia/filesystem/lib/browser/file-service';
+import { DebugContribution } from './debug-contribution';
 
 /**
  * DebugSessionContribution symbol for DI.
@@ -50,7 +51,6 @@ export interface DebugSessionContribution {
      */
     debugSessionFactory(): DebugSessionFactory;
 }
-
 /**
  * DebugSessionContributionRegistry symbol for DI.
  */
@@ -95,7 +95,6 @@ export interface DebugSessionFactory {
 
 @injectable()
 export class DefaultDebugSessionFactory implements DebugSessionFactory {
-
     @inject(WebSocketConnectionProvider)
     protected readonly connectionProvider: WebSocketConnectionProvider;
     @inject(TerminalService)
@@ -114,6 +113,8 @@ export class DefaultDebugSessionFactory implements DebugSessionFactory {
     protected readonly debugPreferences: DebugPreferences;
     @inject(FileService)
     protected readonly fileService: FileService;
+    @inject(ContributionProvider) @named(DebugContribution)
+    protected readonly debugContributionProvider: ContributionProvider<DebugContribution>;
 
     get(sessionId: string, options: DebugSessionOptions): DebugSession {
         const connection = new DebugSessionConnection(
@@ -133,7 +134,8 @@ export class DefaultDebugSessionFactory implements DebugSessionFactory {
             this.breakpoints,
             this.labelProvider,
             this.messages,
-            this.fileService);
+            this.fileService,
+            this.debugContributionProvider);
     }
 
     protected getTraceOutputChannel(): OutputChannel | undefined {

packages/debug/src/browser/debug-session-manager.ts

@@ -306,6 +306,16 @@ export class DebugSessionManager {
         return this.start(options);
     }
 
+    async terminateSessions(): Promise<void> {
+        this.updateCurrentSession(undefined);
+        this.currentSession?.terminate();
+    }
+
+    async restartSessions(): Promise<void> {
+        this.updateCurrentSession(undefined);
+        this.currentSession?.restart();
+    }
+
     protected remove(sessionId: string): void {
         this._sessions.delete(sessionId);
         const { currentSession } = this;

packages/debug/src/browser/debug-session.tsx

@@ -19,7 +19,7 @@
 import * as React from '@theia/core/shared/react';
 import { LabelProvider } from '@theia/core/lib/browser';
 import { DebugProtocol } from 'vscode-debugprotocol';
-import { Emitter, Event, DisposableCollection, Disposable, MessageClient, MessageType, Mutable } from '@theia/core/lib/common';
+import { Emitter, Event, DisposableCollection, Disposable, MessageClient, MessageType, Mutable, ContributionProvider } from '@theia/core/lib/common';
 import { TerminalService } from '@theia/terminal/lib/browser/base/terminal-service';
 import { EditorManager } from '@theia/editor/lib/browser';
 import { CompositeTreeElement } from '@theia/core/lib/browser/source-tree';
@@ -39,6 +39,7 @@ import { SourceBreakpoint, ExceptionBreakpoint } from './breakpoint/breakpoint-m
 import { TerminalWidgetOptions, TerminalWidget } from '@theia/terminal/lib/browser/base/terminal-widget';
 import { DebugFunctionBreakpoint } from './model/debug-function-breakpoint';
 import { FileService } from '@theia/filesystem/lib/browser/file-service';
+import { DebugContribution } from './debug-contribution';
 
 export enum DebugState {
     Inactive,
@@ -49,7 +50,6 @@ export enum DebugState {
 
 // FIXME: make injectable to allow easily inject services
 export class DebugSession implements CompositeTreeElement {
-
     protected readonly onDidChangeEmitter = new Emitter<void>();
     readonly onDidChange: Event<void> = this.onDidChangeEmitter.event;
     protected fireDidChange(): void {
@@ -73,8 +73,12 @@ export class DebugSession implements CompositeTreeElement {
         protected readonly breakpoints: BreakpointManager,
         protected readonly labelProvider: LabelProvider,
         protected readonly messages: MessageClient,
-        protected readonly fileService: FileService) {
+        protected readonly fileService: FileService,
+        protected readonly debugContributionProvider: ContributionProvider<DebugContribution>
+    ) {
         this.connection.onRequest('runInTerminal', (request: DebugProtocol.RunInTerminalRequest) => this.runInTerminal(request));
+        this.registerDebugContributions(options.configuration.type, this.connection);
+
         this.toDispose.pushAll([
             this.onDidChangeEmitter,
             this.onDidChangeBreakpointsEmitter,
@@ -115,9 +119,11 @@ export class DebugSession implements CompositeTreeElement {
         this.sources.set(uri, source);
         return source;
     }
+
     getSourceForUri(uri: URI): DebugSource | undefined {
         return this.sources.get(uri.toString());
     }
+
     async toSource(uri: URI): Promise<DebugSource> {
         const source = this.getSourceForUri(uri);
         if (source) {
@@ -149,19 +155,23 @@ export class DebugSession implements CompositeTreeElement {
     get threads(): IterableIterator<DebugThread> {
         return this._threads.values();
     }
+
     get threadCount(): number {
         return this._threads.size;
     }
+
     *getThreads(filter: (thread: DebugThread) => boolean): IterableIterator<DebugThread> {
         for (const thread of this.threads) {
             if (filter(thread)) {
                 yield thread;
             }
         }
     }
+
     get runningThreads(): IterableIterator<DebugThread> {
         return this.getThreads(thread => !thread.stopped);
     }
+
     get stoppedThreads(): IterableIterator<DebugThread> {
         return this.getThreads(thread => thread.stopped);
     }
@@ -238,6 +248,7 @@ export class DebugSession implements CompositeTreeElement {
         await this.initialize();
         await this.launchOrAttach();
     }
+
     protected async initialize(): Promise<void> {
         const response = await this.connection.sendRequest('initialize', {
             clientID: 'Theia',
@@ -251,15 +262,12 @@ export class DebugSession implements CompositeTreeElement {
             supportsVariablePaging: false,
             supportsRunInTerminalRequest: true
         });
-        this.updateCapabilities(response.body || {});
+        this.updateCapabilities(response?.body || {});
     }
+
     protected async launchOrAttach(): Promise<void> {
         try {
-            if (this.configuration.request === 'attach') {
-                await this.sendRequest('attach', this.configuration);
-            } else {
-                await this.sendRequest('launch', this.configuration);
-            }
+            await this.sendRequest((this.configuration.request as keyof DebugRequestTypes), this.configuration);
         } catch (reason) {
             this.fireExited(reason);
             await this.messages.showMessage({
@@ -272,6 +280,7 @@ export class DebugSession implements CompositeTreeElement {
             throw reason;
         }
     }
+
     protected initialized = false;
     protected async configure(): Promise<void> {
         if (this.capabilities.exceptionBreakpointFilters) {
@@ -302,22 +311,27 @@ export class DebugSession implements CompositeTreeElement {
             await this.disconnect(restart);
         }
     }
+
     protected async disconnect(restart?: boolean): Promise<void> {
-        try {
-            await this.sendRequest('disconnect', { restart });
-        } catch (reason) {
-            this.fireExited(reason);
-            return;
-        }
-        const timeout = 500;
-        if (!await this.exited(timeout)) {
-            this.fireExited(new Error(`timeout after ${timeout} ms`));
-        }
+        const TIMEOUT_MS = 1000;
+        Promise.race([
+            this.sendRequest('disconnect', { restart }),
+            new Promise(reject => setTimeout(reject, TIMEOUT_MS, new Error('TIMEOUT_ERR')))
+        ]).then(res => {
+            if (res instanceof Error) {
+                this.fireExited(res);
+            }
+        }).catch(this.fireExited);
     }
 
     protected fireExited(reason?: Error): void {
-        this.connection['fire']('exited', { reason });
+        try {
+            this.connection['fire']('exited', { reason });
+        } catch (e) {
+            console.error(e);
+        }
     }
+
     protected exited(timeout: number): Promise<boolean> {
         return new Promise<boolean>(resolve => {
             const listener = this.on('exited', () => {
@@ -398,6 +412,7 @@ export class DebugSession implements CompositeTreeElement {
         }
         this.updateCurrentThread();
     }
+
     protected clearThread(threadId: number): void {
         const thread = this._threads.get(threadId);
         if (thread) {
@@ -408,6 +423,7 @@ export class DebugSession implements CompositeTreeElement {
 
     protected readonly scheduleUpdateThreads = debounce(() => this.updateThreads(undefined), 100);
     protected pendingThreads = Promise.resolve();
+
     updateThreads(stoppedDetails: StoppedDetails | undefined): Promise<void> {
         return this.pendingThreads = this.pendingThreads.then(async () => {
             try {
@@ -420,6 +436,7 @@ export class DebugSession implements CompositeTreeElement {
             }
         });
     }
+
     protected doUpdateThreads(threads: DebugProtocol.Thread[], stoppedDetails?: StoppedDetails): void {
         const existing = this._threads;
         this._threads = new Map();
@@ -515,7 +532,9 @@ export class DebugSession implements CompositeTreeElement {
             this.fireDidChangeBreakpoints(new URI(uri));
         }
     }
+
     protected updatingBreakpoints = false;
+
     protected updateBreakpoint(body: DebugProtocol.BreakpointEvent['body']): void {
         this.updatingBreakpoints = true;
         try {
@@ -687,6 +706,7 @@ export class DebugSession implements CompositeTreeElement {
         const distinct = this.dedupSourceBreakpoints(breakpoints);
         this.setBreakpoints(uri, distinct);
     }
+
     protected dedupSourceBreakpoints(all: DebugSourceBreakpoint[]): DebugSourceBreakpoint[] {
         const positions = new Map<string, DebugSourceBreakpoint>();
         for (const breakpoint of all) {
@@ -702,6 +722,7 @@ export class DebugSession implements CompositeTreeElement {
         }
         return [...positions.values()];
     }
+
     protected *getAffectedUris(uri?: URI): IterableIterator<URI> {
         if (uri) {
             yield uri;
@@ -764,4 +785,10 @@ export class DebugSession implements CompositeTreeElement {
             this.clearThread(threadId);
         }
     };
+
+    protected registerDebugContributions(configType: string, connection: DebugSessionConnection): void {
+        for (const contrib of this.debugContributionProvider.getContributions()) {
+            contrib.register(configType, connection);
+        }
+    };
 }

packages/debug/src/browser/view/debug-toolbar-widget.tsx

@@ -82,7 +82,7 @@ export class DebugToolBar extends ReactWidget {
 
     protected start = () => this.model.start();
     protected restart = () => this.model.restart();
-    protected stop = () => this.model.currentSession && this.model.currentSession.terminate();
+    protected stop = () => this.model.terminate();
     protected continue = () => this.model.currentThread && this.model.currentThread.continue();
     protected pause = () => this.model.currentThread && this.model.currentThread.pause();
     protected stepOver = () => this.model.currentThread && this.model.currentThread.stepOver();

packages/debug/src/browser/view/debug-view-model.ts

@@ -189,6 +189,10 @@ export class DebugViewModel implements Disposable {
         this.fireDidChange();
     }
 
+    async terminate(): Promise<void> {
+        this.manager.terminateSessions();
+    }
+
     get watchExpressions(): IterableIterator<DebugWatchExpression> {
         return this._watchExpressions.values();
     }

packages/plugin-dev/src/browser/hosted-plugin-controller.ts

@@ -229,7 +229,7 @@ export class HostedPluginController implements FrontendApplicationContribution {
                     try {
                         await this.hostedPluginServer.stopWatchCompilation(event.pluginLocation.toString());
                     } catch (error) {
-                        this.messageService.error(this.getErrorMessage(error.message));
+                        this.messageService.error(this.getErrorMessage(error));
                     }
                 }
             }
@@ -246,8 +246,9 @@ export class HostedPluginController implements FrontendApplicationContribution {
         }
     }
 
-    private getErrorMessage(error: Error): string {
-        return error.message.substring(error.message.indexOf(':') + 1);
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    private getErrorMessage(error: any): string {
+        return error?.message?.substring(error.message.indexOf(':') + 1) || '';
     }
 
     /**