@theia/debug 1.24.0-next.6 → 1.24.0-next.60

package/src/browser/debug-configuration-manager.ts

@@ -26,7 +26,7 @@ import URI from '@theia/core/lib/common/uri';
 import { Emitter, Event, WaitUntilEvent } from '@theia/core/lib/common/event';
 import { EditorManager, EditorWidget } from '@theia/editor/lib/browser';
 import { MonacoEditor } from '@theia/monaco/lib/browser/monaco-editor';
-import { PreferenceScope, PreferenceService, QuickPickValue, StorageService } from '@theia/core/lib/browser';
+import { LabelProvider, PreferenceScope, PreferenceService, QuickPickValue, StorageService } from '@theia/core/lib/browser';
 import { QuickPickService } from '@theia/core/lib/common/quick-pick-service';
 import { WorkspaceService } from '@theia/workspace/lib/browser/workspace-service';
 import { DebugConfigurationModel } from './debug-configuration-model';
@@ -37,6 +37,10 @@ import { DebugConfiguration } from '../common/debug-common';
 import { WorkspaceVariableContribution } from '@theia/workspace/lib/browser/workspace-variable-contribution';
 import { PreferenceConfigurations } from '@theia/core/lib/browser/preferences/preference-configurations';
 import { MonacoTextModelService } from '@theia/monaco/lib/browser/monaco-text-model-service';
+import * as monaco from '@theia/monaco-editor-core';
+import { ICommandService } from '@theia/monaco-editor-core/esm/vs/platform/commands/common/commands';
+import { StandaloneServices } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices';
+import { nls } from '@theia/core';
 
 export interface WillProvideDebugConfiguration extends WaitUntilEvent {
 }
@@ -56,6 +60,9 @@ export class DebugConfigurationManager {
     @inject(ContextKeyService)
     protected readonly contextKeyService: ContextKeyService;
 
+    @inject(LabelProvider)
+    protected readonly labelProvider: LabelProvider;
+
     @inject(MonacoTextModelService)
     protected readonly textModelService: MonacoTextModelService;
 
@@ -160,7 +167,7 @@ export class DebugConfigurationManager {
         this._currentOptions = options && !options.configuration.dynamic ? this.find(options.configuration.name, options.workspaceFolderUri) : options;
 
         if (!this._currentOptions) {
-            const { model } = this;
+            const model = this.getModel();
             if (model) {
                 const configuration = model.configurations[0];
                 if (configuration) {
@@ -191,14 +198,23 @@ export class DebugConfigurationManager {
     }
 
     async openConfiguration(): Promise<void> {
-        const { model } = this;
+        const model = this.getModel();
         if (model) {
             await this.doOpen(model);
         }
     }
 
     async addConfiguration(): Promise<void> {
-        const { model } = this;
+        let rootUri: URI | undefined = undefined;
+        if (this.workspaceService.saved && this.workspaceService.tryGetRoots().length > 1) {
+            rootUri = await this.selectRootUri();
+            // Do not continue if the user explicitly does not choose a location.
+            if (!rootUri) {
+                return;
+            }
+        }
+
+        const model = this.getModel(rootUri);
         if (!model) {
             return;
         }
@@ -207,7 +223,7 @@ export class DebugConfigurationManager {
             return;
         }
         const editor = widget.editor.getControl();
-        const { commandService } = widget.editor;
+        const commandService = StandaloneServices.get(ICommandService);
         let position: monaco.Position | undefined;
         let depthInArray = 0;
         let lastProperty = '';
@@ -243,8 +259,24 @@ export class DebugConfigurationManager {
         await commandService.executeCommand('editor.action.triggerSuggest');
     }
 
-    protected get model(): DebugConfigurationModel | undefined {
-        const workspaceFolderUri = this.workspaceVariables.getWorkspaceRootUri();
+    protected async selectRootUri(): Promise<URI | undefined> {
+        const workspaceRoots = this.workspaceService.tryGetRoots();
+        const items: QuickPickValue<URI>[] = [];
+        for (const workspaceRoot of workspaceRoots) {
+            items.push({
+                label: this.labelProvider.getName(workspaceRoot.resource),
+                description: this.labelProvider.getLongName(workspaceRoot.resource),
+                value: workspaceRoot.resource
+            });
+        }
+        const root = await this.quickPickService.show(items, {
+            placeholder: nls.localize('theia/debug/addConfigurationPlaceholder', 'Select workspace root to add configuration to')
+        });
+        return root?.value;
+    }
+
+    protected getModel(uri?: URI): DebugConfigurationModel | undefined {
+        const workspaceFolderUri = this.workspaceVariables.getWorkspaceRootUri(uri);
         if (workspaceFolderUri) {
             const key = workspaceFolderUri.toString();
             for (const model of this.models.values()) {

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

@@ -16,6 +16,7 @@
 
 import { AbstractViewContribution, ApplicationShell, KeybindingRegistry, Widget, CompositeTreeNode, LabelProvider, codicon } from '@theia/core/lib/browser';
 import { injectable, inject } from '@theia/core/shared/inversify';
+import * as monaco from '@theia/monaco-editor-core';
 import { ThemeService } from '@theia/core/lib/browser/theming';
 import { MenuModelRegistry, CommandRegistry, MAIN_MENU_BAR, Command, Emitter, Mutable } from '@theia/core/lib/common';
 import { DebugViewLocation } from '../common/debug-configuration';

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

@@ -77,7 +77,7 @@ export default new ContainerModule((bind: interfaces.Bind) => {
         DebugEditorModel.createModel(container, editor)
     )).inSingletonScope();
     bind(DebugEditorService).toSelf().inSingletonScope().onActivation((context, service) => {
-        context.container.get(MonacoEditorService).registerDecorationType(DebugBreakpointWidget.PLACEHOLDER_DECORATION, {});
+        context.container.get(MonacoEditorService).registerDecorationType('Debug breakpoint placeholder', DebugBreakpointWidget.PLACEHOLDER_DECORATION, {});
         return service;
     });
 

package/src/browser/debug-prefix-configuration.ts

@@ -25,7 +25,7 @@ import { LabelProvider } from '@theia/core/lib/browser/label-provider';
 import URI from '@theia/core/lib/common/uri';
 import { QuickAccessContribution, QuickAccessProvider, QuickAccessRegistry, QuickInputService, StatusBar, StatusBarAlignment } from '@theia/core/lib/browser';
 import { DebugPreferences } from './debug-preferences';
-import { filterItems, QuickPickItem, QuickPicks } from '@theia/core/lib/browser/quick-input/quick-input-service';
+import { filterItems, QuickPickItemOrSeparator, QuickPicks } from '@theia/core/lib/browser/quick-input/quick-input-service';
 import { CancellationToken } from '@theia/core/lib/common';
 
 @injectable()
@@ -108,7 +108,7 @@ export class DebugPrefixConfiguration implements CommandContribution, CommandHan
     }
 
     async getPicks(filter: string, token: CancellationToken): Promise<QuickPicks> {
-        const items: QuickPickItem[] = [];
+        const items: QuickPickItemOrSeparator[] = [];
         const configurations = this.debugConfigurationManager.all;
 
         for (const config of configurations) {

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

@@ -37,6 +37,7 @@ import { DebugThread } from './model/debug-thread';
 import { TaskIdentifier } from '@theia/task/lib/common';
 import { DebugSourceBreakpoint } from './model/debug-source-breakpoint';
 import { DebugFunctionBreakpoint } from './model/debug-function-breakpoint';
+import * as monaco from '@theia/monaco-editor-core';
 
 export interface WillStartDebugSession extends WaitUntilEvent {
 }

package/src/browser/editor/debug-breakpoint-widget.tsx

@@ -26,6 +26,15 @@ import { MonacoEditor } from '@theia/monaco/lib/browser/monaco-editor';
 import { DebugEditor } from './debug-editor';
 import { DebugSourceBreakpoint } from '../model/debug-source-breakpoint';
 import { Dimension } from '@theia/editor/lib/browser';
+import * as monaco from '@theia/monaco-editor-core';
+import { LanguageSelector } from '@theia/monaco-editor-core/esm/vs/editor/common/languageSelector';
+import { provideSuggestionItems, CompletionOptions } from '@theia/monaco-editor-core/esm/vs/editor/contrib/suggest/browser/suggest';
+import { IDecorationOptions } from '@theia/monaco-editor-core/esm/vs/editor/common/editorCommon';
+import { StandaloneCodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneCodeEditor';
+import { CompletionItemKind, CompletionContext } from '@theia/monaco-editor-core/esm/vs/editor/common/languages';
+import { ILanguageFeaturesService } from '@theia/monaco-editor-core/esm/vs/editor/common/services/languageFeatures';
+import { StandaloneServices } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices';
+import { TextModel } from '@theia/monaco-editor-core/esm/vs/editor/common/model/textModel';
 
 export type ShowDebugBreakpointOptions = DebugSourceBreakpoint | {
     position: monaco.Position,
@@ -100,36 +109,38 @@ export class DebugBreakpointWidget implements Disposable {
             return;
         }
         this.toDispose.push(input);
-        this.toDispose.push(monaco.modes.CompletionProviderRegistry.register({ scheme: input.uri.scheme }, {
-            provideCompletionItems: async (model, position, context, token) => {
-                const suggestions = [];
-                if ((this.context === 'condition' || this.context === 'logMessage')
-                    && input.uri.toString() === model.uri.toString()) {
-                    const editor = this.editor.getControl();
-                    const items = await monaco.suggest.provideSuggestionItems(
-                        editor.getModel()!,
-                        new monaco.Position(editor.getPosition()!.lineNumber, 1),
-                        new monaco.suggest.CompletionOptions(undefined, new Set<monaco.languages.CompletionItemKind>().add(monaco.languages.CompletionItemKind.Snippet)),
-                        context, token);
-                    let overwriteBefore = 0;
-                    if (this.context === 'condition') {
-                        overwriteBefore = position.column - 1;
-                    } else {
-                        // Inside the curly brackets, need to count how many useful characters are behind the position so they would all be taken into account
-                        const value = editor.getModel()!.getValue();
-                        while ((position.column - 2 - overwriteBefore >= 0)
-                            && value[position.column - 2 - overwriteBefore] !== '{' && value[position.column - 2 - overwriteBefore] !== ' ') {
-                            overwriteBefore++;
+        this.toDispose.push((monaco.languages.registerCompletionItemProvider as (languageId: LanguageSelector, provider: monaco.languages.CompletionItemProvider) => Disposable)
+            ({ scheme: input.uri.scheme }, {
+                provideCompletionItems: async (model, position, context, token): Promise<monaco.languages.CompletionList> => {
+                    const suggestions: monaco.languages.CompletionItem[] = [];
+                    if ((this.context === 'condition' || this.context === 'logMessage')
+                        && input.uri.toString() === model.uri.toString()) {
+                        const editor = this.editor.getControl();
+                        const completions = await provideSuggestionItems(
+                            StandaloneServices.get(ILanguageFeaturesService).completionProvider,
+                            editor.getModel()! as unknown as TextModel,
+                            new monaco.Position(editor.getPosition()!.lineNumber, 1),
+                            new CompletionOptions(undefined, new Set<CompletionItemKind>().add(CompletionItemKind.Snippet)),
+                            context as unknown as CompletionContext, token);
+                        let overwriteBefore = 0;
+                        if (this.context === 'condition') {
+                            overwriteBefore = position.column - 1;
+                        } else {
+                            // Inside the curly brackets, need to count how many useful characters are behind the position so they would all be taken into account
+                            const value = editor.getModel()!.getValue();
+                            while ((position.column - 2 - overwriteBefore >= 0)
+                                && value[position.column - 2 - overwriteBefore] !== '{' && value[position.column - 2 - overwriteBefore] !== ' ') {
+                                overwriteBefore++;
+                            }
+                        }
+                        for (const { completion } of completions.items) {
+                            completion.range = monaco.Range.fromPositions(position.delta(0, -overwriteBefore), position);
+                            suggestions.push(completion as unknown as monaco.languages.CompletionItem);
                         }
                     }
-                    for (const { completion } of items) {
-                        completion.range = monaco.Range.fromPositions(position.delta(0, -overwriteBefore), position);
-                        suggestions.push(completion);
-                    }
+                    return { suggestions };
                 }
-                return { suggestions };
-            }
-        }));
+            }));
         this.toDispose.push(this.zone.onDidLayoutChange(dimension => this.layout(dimension)));
         this.toDispose.push(input.getControl().onDidChangeModelContent(() => {
             const heightInLines = input.getControl().getModel()!.getLineCount() + 1;
@@ -230,8 +241,7 @@ export class DebugBreakpointWidget implements Disposable {
             return;
         }
         const value = this._input.getControl().getValue();
-        const decorations: monaco.editor.IDecorationOptions[] = !!value ? [] : [{
-            color: undefined,
+        const decorations: IDecorationOptions[] = !!value ? [] : [{
             range: {
                 startLineNumber: 0,
                 endLineNumber: 0,
@@ -245,7 +255,7 @@ export class DebugBreakpointWidget implements Disposable {
                 }
             }
         }];
-        this._input.getControl().setDecorations(DebugBreakpointWidget.PLACEHOLDER_DECORATION, decorations);
+        (this._input.getControl() as unknown as StandaloneCodeEditor).setDecorations('Debug breakpoint placeholder', DebugBreakpointWidget.PLACEHOLDER_DECORATION, decorations);
     }
     protected get placeholder(): string {
         if (this.context === 'logMessage') {

package/src/browser/editor/debug-editor-model.ts

@@ -16,6 +16,10 @@
 
 import debounce = require('p-debounce');
 import { injectable, inject, postConstruct, interfaces, Container } from '@theia/core/shared/inversify';
+import * as monaco from '@theia/monaco-editor-core';
+import { IConfigurationService } from '@theia/monaco-editor-core/esm/vs/platform/configuration/common/configuration';
+import { StandaloneCodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneCodeEditor';
+import { IDecorationOptions } from '@theia/monaco-editor-core/esm/vs/editor/common/editorCommon';
 import URI from '@theia/core/lib/common/uri';
 import { Disposable, DisposableCollection, MenuPath, isOSX } from '@theia/core';
 import { ContextMenuRenderer } from '@theia/core/lib/browser';
@@ -90,7 +94,7 @@ export class DebugEditorModel implements Disposable {
     readonly inlineValueDecorator: DebugInlineValueDecorator;
 
     @inject(MonacoConfigurationService)
-    readonly configurationService: monaco.services.IConfigurationService;
+    readonly configurationService: IConfigurationService;
 
     @postConstruct()
     protected init(): void {
@@ -140,9 +144,9 @@ export class DebugEditorModel implements Disposable {
                 const model = codeEditor.getModel()!;
                 const overrides = {
                     resource: model.uri,
-                    overrideIdentifier: model.getLanguageIdentifier().language,
+                    overrideIdentifier: model.getLanguageId(),
                 };
-                const { enabled, delay, sticky } = this.configurationService._configuration.getValue('editor.hover', overrides, undefined);
+                const { enabled, delay, sticky } = this.configurationService.getValue('editor.hover', overrides);
                 codeEditor.updateOptions({
                     hover: {
                         enabled,
@@ -159,13 +163,13 @@ export class DebugEditorModel implements Disposable {
             this.createFrameDecorations(),
             this.createInlineValueDecorations()
         ]);
-        const codeEditor = this.editor.getControl();
+        const codeEditor = this.editor.getControl() as unknown as StandaloneCodeEditor;
         codeEditor.removeDecorations(INLINE_VALUE_DECORATION_KEY);
-        codeEditor.setDecorations(INLINE_VALUE_DECORATION_KEY, inlineValueDecorations);
+        codeEditor.setDecorations('Inline debug decorations', INLINE_VALUE_DECORATION_KEY, inlineValueDecorations);
         this.editorDecorations = this.deltaDecorations(this.editorDecorations, newFrameDecorations);
     }
 
-    protected async createInlineValueDecorations(): Promise<monaco.editor.IDecorationOptions[]> {
+    protected async createInlineValueDecorations(): Promise<IDecorationOptions[]> {
         if (!this.sessions.isCurrentEditorFrame(this.uri)) {
             return [];
         }

package/src/browser/editor/debug-editor-service.ts

@@ -15,6 +15,7 @@
 // *****************************************************************************
 
 import { injectable, inject, postConstruct } from '@theia/core/shared/inversify';
+import * as monaco from '@theia/monaco-editor-core';
 import URI from '@theia/core/lib/common/uri';
 import { EditorManager, EditorWidget } from '@theia/editor/lib/browser';
 import { ContextMenuRenderer } from '@theia/core/lib/browser';

package/src/browser/editor/debug-exception-widget.tsx

@@ -16,6 +16,7 @@
 
 import * as React from '@theia/core/shared/react';
 import * as ReactDOM from '@theia/core/shared/react-dom';
+import * as monaco from '@theia/monaco-editor-core';
 import { injectable, inject, postConstruct } from '@theia/core/shared/inversify';
 import { Disposable, DisposableCollection } from '@theia/core/lib/common/disposable';
 import { MonacoEditorZoneWidget } from '@theia/monaco/lib/browser/monaco-editor-zone-widget';

package/src/browser/editor/debug-expression-provider.ts

@@ -19,6 +19,7 @@
  *--------------------------------------------------------------------------------------------*/
 
 import { injectable } from '@theia/core/shared/inversify';
+import * as monaco from '@theia/monaco-editor-core';
 
 /**
  * TODO: introduce a new request to LSP to look up an expression range: https://github.com/Microsoft/language-server-protocol/issues/462

package/src/browser/editor/debug-hover-widget.ts

@@ -27,6 +27,7 @@ import { DebugEditor } from './debug-editor';
 import { DebugExpressionProvider } from './debug-expression-provider';
 import { DebugHoverSource } from './debug-hover-source';
 import { DebugVariable } from '../console/debug-console-items';
+import * as monaco from '@theia/monaco-editor-core';
 
 export interface ShowDebugHoverOptions {
     selection: monaco.Range

package/src/browser/editor/debug-inline-value-decorator.ts

@@ -21,6 +21,11 @@
 // Based on https://github.com/theia-ide/vscode/blob/standalone/0.19.x/src/vs/workbench/contrib/debug/browser/debugEditorContribution.ts
 
 import { inject, injectable } from '@theia/core/shared/inversify';
+import * as monaco from '@theia/monaco-editor-core';
+import { IDecorationOptions } from '@theia/monaco-editor-core/esm/vs/editor/common/editorCommon';
+import { ITextModel } from '@theia/monaco-editor-core/esm/vs/editor/common/model';
+import { StandardTokenType } from '@theia/monaco-editor-core/esm/vs/editor/common/languages';
+import { DEFAULT_WORD_REGEXP } from '@theia/monaco-editor-core/esm/vs/editor/common/core/wordHelper';
 import { FrontendApplicationContribution } from '@theia/core/lib/browser/frontend-application';
 import { MonacoEditorService } from '@theia/monaco/lib/browser/monaco-editor-service';
 import { ExpressionContainer, DebugVariable } from '../console/debug-console-items';
@@ -33,7 +38,6 @@ export const INLINE_VALUE_DECORATION_KEY = 'inlinevaluedecoration';
 const MAX_NUM_INLINE_VALUES = 100; // JS Global scope can have 700+ entries. We want to limit ourselves for perf reasons
 const MAX_INLINE_DECORATOR_LENGTH = 150; // Max string length of each inline decorator when debugging. If exceeded ... is added
 const MAX_TOKENIZATION_LINE_LEN = 500; // If line is too long, then inline values for the line are skipped
-const { DEFAULT_WORD_REGEXP } = monaco.wordHelper;
 
 /**
  * MAX SMI (SMall Integer) as defined in v8.
@@ -44,14 +48,6 @@ const { DEFAULT_WORD_REGEXP } = monaco.wordHelper;
 // https://github.com/theia-ide/vscode/blob/standalone/0.19.x/src/vs/base/common/uint.ts#L7-L13
 const MAX_SAFE_SMALL_INTEGER = 1 << 30;
 
-// https://github.com/theia-ide/vscode/blob/standalone/0.19.x/src/vs/editor/common/modes.ts#L88-L97
-const enum StandardTokenType {
-    Other = 0,
-    Comment = 1,
-    String = 2,
-    RegEx = 4
-};
-
 @injectable()
 export class DebugInlineValueDecorator implements FrontendApplicationContribution {
 
@@ -62,10 +58,10 @@ export class DebugInlineValueDecorator implements FrontendApplicationContributio
     protected readonly preferences: DebugPreferences;
 
     protected enabled = false;
-    protected wordToLineNumbersMap: Map<string, monaco.Position[]> | undefined = new Map(); // TODO: can we get rid of this field?
+    protected wordToLineNumbersMap: Map<string, monaco.Position[]> | undefined = new Map();
 
     onStart(): void {
-        this.editorService.registerDecorationType(INLINE_VALUE_DECORATION_KEY, {});
+        this.editorService.registerDecorationType('Inline debug decorations', INLINE_VALUE_DECORATION_KEY, {});
         this.enabled = !!this.preferences['debug.inlineValues'];
         this.preferences.onPreferenceChanged(({ preferenceName, newValue }) => {
             if (preferenceName === 'debug.inlineValues' && !!newValue !== this.enabled) {
@@ -74,7 +70,7 @@ export class DebugInlineValueDecorator implements FrontendApplicationContributio
         });
     }
 
-    async calculateDecorations(debugEditorModel: DebugEditorModel, stackFrame: DebugStackFrame | undefined): Promise<monaco.editor.IDecorationOptions[]> {
+    async calculateDecorations(debugEditorModel: DebugEditorModel, stackFrame: DebugStackFrame | undefined): Promise<IDecorationOptions[]> {
         this.wordToLineNumbersMap = undefined;
         const model = debugEditorModel.editor.getControl().getModel() || undefined;
         return this.updateInlineValueDecorations(model, stackFrame);
@@ -83,7 +79,7 @@ export class DebugInlineValueDecorator implements FrontendApplicationContributio
     // https://github.com/theia-ide/vscode/blob/standalone/0.19.x/src/vs/workbench/contrib/debug/browser/debugEditorContribution.ts#L382-L408
     protected async updateInlineValueDecorations(
         model: monaco.editor.ITextModel | undefined,
-        stackFrame: DebugStackFrame | undefined): Promise<monaco.editor.IDecorationOptions[]> {
+        stackFrame: DebugStackFrame | undefined): Promise<IDecorationOptions[]> {
 
         if (!this.enabled || !model || !stackFrame || !stackFrame.source || model.uri.toString() !== stackFrame.source.uri.toString()) {
             return [];
@@ -115,7 +111,7 @@ export class DebugInlineValueDecorator implements FrontendApplicationContributio
     private createInlineValueDecorationsInsideRange(
         expressions: ReadonlyArray<ExpressionContainer>,
         range: monaco.Range,
-        model: monaco.editor.ITextModel): monaco.editor.IDecorationOptions[] {
+        model: monaco.editor.ITextModel): IDecorationOptions[] {
 
         const nameValueMap = new Map<string, string>();
         for (const expr of expressions) {
@@ -149,7 +145,7 @@ export class DebugInlineValueDecorator implements FrontendApplicationContributio
             }
         });
 
-        const decorations: monaco.editor.IDecorationOptions[] = [];
+        const decorations: IDecorationOptions[] = [];
         // Compute decorators for each line
         lineToNamesMap.forEach((names, line) => {
             const contentText = names.sort((first, second) => {
@@ -163,14 +159,13 @@ export class DebugInlineValueDecorator implements FrontendApplicationContributio
     }
 
     // https://github.com/theia-ide/vscode/blob/standalone/0.19.x/src/vs/workbench/contrib/debug/browser/debugEditorContribution.ts#L454-L485
-    private createInlineValueDecoration(lineNumber: number, contentText: string): monaco.editor.IDecorationOptions {
+    private createInlineValueDecoration(lineNumber: number, contentText: string): IDecorationOptions {
         // If decoratorText is too long, trim and add ellipses. This could happen for minified files with everything on a single line
         if (contentText.length > MAX_INLINE_DECORATOR_LENGTH) {
             contentText = contentText.substr(0, MAX_INLINE_DECORATOR_LENGTH) + '...';
         }
 
         return {
-            color: undefined, // XXX: check inconsistency between APIs. `color` seems to be mandatory from `monaco-editor-core`.
             range: {
                 startLineNumber: lineNumber,
                 endLineNumber: lineNumber,
@@ -198,7 +193,8 @@ export class DebugInlineValueDecorator implements FrontendApplicationContributio
     }
 
     // https://github.com/theia-ide/vscode/blob/standalone/0.19.x/src/vs/workbench/contrib/debug/browser/debugEditorContribution.ts#L487-L531
-    private getWordToPositionsMap(model: monaco.editor.ITextModel): Map<string, monaco.Position[]> {
+    private getWordToPositionsMap(model: monaco.editor.ITextModel | ITextModel): Map<string, monaco.Position[]> {
+        model = model as ITextModel;
         if (!this.wordToLineNumbersMap) {
             this.wordToLineNumbersMap = new Map<string, monaco.Position[]>();
             if (!model) {

package/src/browser/model/debug-stack-frame.tsx

@@ -30,6 +30,7 @@ import { DebugSource } from './debug-source';
 import { RecursivePartial } from '@theia/core';
 import { DebugSession } from '../debug-session';
 import { DebugThread } from './debug-thread';
+import * as monaco from '@theia/monaco-editor-core';
 
 export class DebugStackFrameData {
     readonly raw: DebugProtocol.StackFrame;

package/src/browser/style/index.css

@@ -114,14 +114,9 @@
     display: flex;
     align-items: center;
     padding-top: calc(var(--theia-ui-padding)*2);
-    padding-right: calc(var(--theia-ui-padding)*2);
+    padding-right: calc(var(--theia-ui-padding)*3);
     padding-bottom: var(--theia-ui-padding);
-    margin-right: var(--theia-ui-padding);
-    margin-left: var(--theia-ui-padding);
-}
-
-.theia-side-panel .debug-toolbar {
-    padding-left: 3px;
+    padding-left: calc(var(--theia-ui-padding)*2);
 }
 
 .theia-session-container > .debug-toolbar {

package/src/browser/monaco.d.ts

@@ -1,18 +0,0 @@
-// *****************************************************************************
-// Copyright (C) 2018 TypeFox 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
-// *****************************************************************************
-
-// eslint-disable-next-line spaced-comment
-/// <reference types='@theia/monaco/src/typings/monaco'/>