@theia/debug 1.67.0-next.86 → 1.67.0

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

@@ -14,7 +14,7 @@
 // SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
 // *****************************************************************************
 
-import { DisposableCollection, Emitter, Event, MessageService, nls, ProgressService, WaitUntilEvent } from '@theia/core';
+import { CommandService, DisposableCollection, Emitter, Event, MessageService, nls, ProgressService, WaitUntilEvent } from '@theia/core';
 import { LabelProvider, ApplicationShell, ConfirmDialog } from '@theia/core/lib/browser';
 import { ContextKey, ContextKeyService } from '@theia/core/lib/browser/context-key-service';
 import URI from '@theia/core/lib/common/uri';
@@ -133,6 +133,9 @@ export class DebugSessionManager {
     @inject(EditorManager)
     protected readonly editorManager: EditorManager;
 
+    @inject(CommandService)
+    protected commandService: CommandService;
+
     @inject(BreakpointManager)
     protected readonly breakpoints: BreakpointManager;
 
@@ -426,9 +429,15 @@ export class DebugSessionManager {
                 state = session.state;
                 if (state === DebugState.Stopped) {
                     this.onDidStopDebugSessionEmitter.fire(session);
+                    // Only switch to this session if a thread actually stopped (not just state change)
+                    if (session.currentThread && session.currentThread.stopped) {
+                        this.updateCurrentSession(session);
+                    }
                 }
             }
-            this.updateCurrentSession(session);
+            // Always fire change event to update views (threads, variables, etc.)
+            // The selection logic in widgets will handle not jumping to non-stopped threads
+            this.fireDidChange(session);
         });
         session.onDidChangeBreakpoints(uri => this.fireDidChangeBreakpoints({ session, uri }));
         session.on('terminated', async event => {
@@ -447,7 +456,14 @@ export class DebugSessionManager {
         });
 
         session.onDispose(() => this.cleanup(session));
-        session.start().then(() => this.onDidStartDebugSessionEmitter.fire(session)).catch(e => {
+        session.start().then(() => {
+            this.onDidStartDebugSessionEmitter.fire(session);
+            // Set as current session if no current session exists
+            // This ensures the UI shows the running session and buttons are enabled
+            if (!this.currentSession) {
+                this.updateCurrentSession(session);
+            }
+        }).catch(e => {
             session.stop(false, () => {
                 this.debug.terminateDebugSession(session.id);
             });
@@ -608,7 +624,7 @@ export class DebugSessionManager {
         return currentThread && currentThread.topFrame;
     }
 
-    getFunctionBreakpoints(session: DebugSession | undefined = this.currentSession): DebugFunctionBreakpoint[] {
+    getFunctionBreakpoints(session?: DebugSession): DebugFunctionBreakpoint[] {
         if (session && session.state > DebugState.Initializing) {
             return session.getFunctionBreakpoints();
         }
@@ -616,7 +632,7 @@ export class DebugSessionManager {
         return this.breakpoints.getFunctionBreakpoints().map(origin => new DebugFunctionBreakpoint(origin, { labelProvider, breakpoints, editorManager }));
     }
 
-    getInstructionBreakpoints(session = this.currentSession): DebugInstructionBreakpoint[] {
+    getInstructionBreakpoints(session?: DebugSession): DebugInstructionBreakpoint[] {
         if (session && session.state > DebugState.Initializing) {
             return session.getInstructionBreakpoints();
         }
@@ -636,12 +652,39 @@ export class DebugSessionManager {
     getBreakpoints(uri: URI, session?: DebugSession): DebugSourceBreakpoint[];
     getBreakpoints(arg?: URI | DebugSession, arg2?: DebugSession): DebugSourceBreakpoint[] {
         const uri = arg instanceof URI ? arg : undefined;
-        const session = arg instanceof DebugSession ? arg : arg2 instanceof DebugSession ? arg2 : this.currentSession;
+        const session = arg instanceof DebugSession ? arg : arg2 instanceof DebugSession ? arg2 : undefined;
         if (session && session.state > DebugState.Initializing) {
             return session.getSourceBreakpoints(uri);
         }
+
+        const activeSessions = this.sessions.filter(s => s.state > DebugState.Initializing);
+
+        // Start with all breakpoints from markers (not installed = shows as filled circle)
         const { labelProvider, breakpoints, editorManager } = this;
-        return this.breakpoints.findMarkers({ uri }).map(({ data }) => new DebugSourceBreakpoint(data, { labelProvider, breakpoints, editorManager }));
+        const breakpointMap = new Map<string, DebugSourceBreakpoint>();
+        const markers = this.breakpoints.findMarkers({ uri });
+
+        for (const { data } of markers) {
+            const bp = new DebugSourceBreakpoint(data, { labelProvider, breakpoints, editorManager }, this.commandService);
+            breakpointMap.set(bp.id, bp);
+        }
+
+        // Overlay with VERIFIED breakpoints from active sessions only
+        // We only replace a marker-based breakpoint if the session has VERIFIED it
+        // This ensures breakpoints show as filled (not installed) rather than hollow (installed but unverified)
+        for (const activeSession of activeSessions) {
+            const sessionBps = activeSession.getSourceBreakpoints(uri);
+
+            for (const bp of sessionBps) {
+                if (bp.verified) {
+                    // Session has verified this breakpoint - use the session's version
+                    breakpointMap.set(bp.id, bp);
+                }
+                // If not verified, keep the marker-based one (shows as not installed = filled circle)
+            }
+        }
+
+        return Array.from(breakpointMap.values());
     }
 
     getLineBreakpoints(uri: URI, line: number): DebugSourceBreakpoint[] {
@@ -651,7 +694,7 @@ export class DebugSessionManager {
         }
         const { labelProvider, breakpoints, editorManager } = this;
         return this.breakpoints.getLineBreakpoints(uri, line).map(origin =>
-            new DebugSourceBreakpoint(origin, { labelProvider, breakpoints, editorManager })
+            new DebugSourceBreakpoint(origin, { labelProvider, breakpoints, editorManager }, this.commandService)
         );
     }
 
@@ -662,7 +705,7 @@ export class DebugSessionManager {
         }
         const origin = this.breakpoints.getInlineBreakpoint(uri, line, column);
         const { labelProvider, breakpoints, editorManager } = this;
-        return origin && new DebugSourceBreakpoint(origin, { labelProvider, breakpoints, editorManager });
+        return origin && new DebugSourceBreakpoint(origin, { labelProvider, breakpoints, editorManager }, this.commandService);
     }
 
     /**

package/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, ContributionProvider } from '@theia/core/lib/common';
+import { Emitter, Event, DisposableCollection, Disposable, MessageClient, MessageType, Mutable, ContributionProvider, CommandService } 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';
@@ -129,6 +129,7 @@ export class DebugSession implements CompositeTreeElement {
         protected readonly debugContributionProvider: ContributionProvider<DebugContribution>,
         protected readonly workspaceService: WorkspaceService,
         protected readonly debugPreferences: DebugPreferences,
+        protected readonly commandService: CommandService,
         /**
          * Number of millis after a `stop` request times out. It's 5 seconds by default.
          */
@@ -687,7 +688,7 @@ export class DebugSession implements CompositeTreeElement {
                     const origin = SourceBreakpoint.create(uri, { line: raw.line, column: raw.column });
                     if (this.breakpoints.addBreakpoint(origin)) {
                         const breakpoints = this.getSourceBreakpoints(uri);
-                        const breakpoint = new DebugSourceBreakpoint(origin, this.asDebugBreakpointOptions());
+                        const breakpoint = new DebugSourceBreakpoint(origin, this.asDebugBreakpointOptions(), this.commandService);
                         breakpoint.update({ raw });
                         breakpoints.push(breakpoint);
                         this.setSourceBreakpoints(uri, breakpoints);
@@ -824,7 +825,7 @@ export class DebugSession implements CompositeTreeElement {
         const known = this._breakpoints.get(affectedUri.toString());
         const all = this.breakpoints.findMarkers({ uri: affectedUri }).map(({ data }) =>
             known?.find((candidate): candidate is DebugSourceBreakpoint => candidate instanceof DebugSourceBreakpoint && candidate.origin.id === data.id) ??
-            new DebugSourceBreakpoint(data, this.asDebugBreakpointOptions())
+            new DebugSourceBreakpoint(data, this.asDebugBreakpointOptions(), this.commandService)
         );
         const enabled = all.filter(b => b.enabled);
         try {

package/src/browser/model/debug-breakpoint.tsx

@@ -18,8 +18,9 @@ import * as React from '@theia/core/shared/react';
 import { DebugProtocol } from '@vscode/debugprotocol/lib/debugProtocol';
 import URI from '@theia/core/lib/common/uri';
 import { EditorManager } from '@theia/editor/lib/browser';
-import { LabelProvider, DISABLED_CLASS } from '@theia/core/lib/browser';
+import { LabelProvider, DISABLED_CLASS, TreeWidget } from '@theia/core/lib/browser';
 import { TreeElement } from '@theia/core/lib/browser/source-tree';
+import { SelectableTreeNode } from '@theia/core/lib/browser/tree/tree-selection';
 import { DebugSession } from '../debug-session';
 import { BaseBreakpoint } from '../breakpoint/breakpoint-marker';
 import { BreakpointManager } from '../breakpoint/breakpoint-manager';
@@ -44,6 +45,7 @@ export class DebugBreakpointDecoration {
 export abstract class DebugBreakpoint<T extends BaseBreakpoint = BaseBreakpoint> extends DebugBreakpointOptions implements TreeElement {
 
     readonly raw?: DebugProtocol.Breakpoint;
+    protected treeWidget?: TreeWidget;
 
     constructor(
         readonly uri: URI,
@@ -76,7 +78,7 @@ export abstract class DebugBreakpoint<T extends BaseBreakpoint = BaseBreakpoint>
     }
 
     get verified(): boolean {
-        return !!this.raw ? this.raw.verified : true;
+        return !!this.raw ? this.raw.verified : false;
     }
 
     get message(): string {
@@ -91,7 +93,8 @@ export abstract class DebugBreakpoint<T extends BaseBreakpoint = BaseBreakpoint>
         this.setEnabled(event.target.checked);
     };
 
-    render(): React.ReactNode {
+    render(host: TreeWidget): React.ReactNode {
+        this.treeWidget = host;
         const classNames = ['theia-source-breakpoint'];
         if (!this.isEnabled()) {
             classNames.push(DISABLED_CLASS);
@@ -149,4 +152,10 @@ export abstract class DebugBreakpoint<T extends BaseBreakpoint = BaseBreakpoint>
 
     protected abstract getBreakpointDecoration(message?: string[]): DebugBreakpointDecoration;
 
+    protected async selectInTree(): Promise<void> {
+        if (this.treeWidget?.model && SelectableTreeNode.is(this)) {
+            this.treeWidget.model.selectNode(this);
+        }
+    }
+
 }

package/src/browser/model/debug-data-breakpoint.tsx

@@ -16,6 +16,7 @@
 
 import { nls } from '@theia/core';
 import * as React from '@theia/core/shared/react';
+import { codicon } from '@theia/core/lib/browser';
 import { BreakpointManager } from '../breakpoint/breakpoint-manager';
 import { DataBreakpoint } from '../breakpoint/breakpoint-marker';
 import { DebugBreakpoint, DebugBreakpointDecoration, DebugBreakpointOptions } from './debug-breakpoint';
@@ -44,12 +45,26 @@ export class DebugDataBreakpoint extends DebugBreakpoint<DataBreakpoint> {
     }
 
     protected doRender(): React.ReactNode {
-        return <span className="line-info theia-data-breakpoint" title={this.origin.info.description}>
-            <span className="name">{this.origin.info.description}</span>
-            <span className="theia-TreeNodeInfo theia-access-type" >{this.getAccessType()}</span>
-        </span>;
+        return <>
+            <span className="line-info theia-data-breakpoint" title={this.origin.info.description}>
+                <span className="name">{this.origin.info.description}</span>
+                <span className="theia-TreeNodeInfo theia-access-type" >{this.getAccessType()}</span>
+            </span>
+            {this.renderActions()}
+        </>;
     }
 
+    protected renderActions(): React.ReactNode {
+        return <div className='theia-debug-breakpoint-actions'>
+            <div className={codicon('close', true)} title={nls.localizeByDefault('Remove Breakpoint')} onClick={this.onRemove} />
+        </div>;
+    }
+
+    protected onRemove = async () => {
+        await this.selectInTree();
+        this.remove();
+    };
+
     protected getAccessType(): string {
         switch (this.origin.raw.accessType) {
             case 'read': return 'Read';
@@ -62,7 +77,7 @@ export class DebugDataBreakpoint extends DebugBreakpoint<DataBreakpoint> {
         if (!this.isSupported()) {
             return {
                 className: 'codicon-debug-breakpoint-unsupported',
-                message: message ?? [nls.localize('theia/debug/data-breakpoint', 'Data Breakpoint')],
+                message: message ?? [nls.localizeByDefault('Data Breakpoint')],
             };
         }
         if (this.origin.raw.condition || this.origin.raw.hitCondition) {
@@ -73,7 +88,7 @@ export class DebugDataBreakpoint extends DebugBreakpoint<DataBreakpoint> {
         }
         return {
             className: 'codicon-debug-breakpoint-data',
-            message: message || [nls.localize('theia/debug/data-breakpoint', 'Data Breakpoint')]
+            message: message || [nls.localizeByDefault('Data Breakpoint')]
         };
     }
 }

package/src/browser/model/debug-function-breakpoint.tsx

@@ -21,6 +21,7 @@ import { BreakpointManager } from '../breakpoint/breakpoint-manager';
 import { DebugBreakpoint, DebugBreakpointOptions, DebugBreakpointDecoration } from './debug-breakpoint';
 import { SingleTextInputDialog } from '@theia/core/lib/browser/dialogs';
 import { nls } from '@theia/core';
+import { codicon } from '@theia/core/lib/browser';
 
 export class DebugFunctionBreakpoint extends DebugBreakpoint<FunctionBreakpoint> implements TreeElement {
 
@@ -59,9 +60,29 @@ export class DebugFunctionBreakpoint extends DebugBreakpoint<FunctionBreakpoint>
     }
 
     protected doRender(): React.ReactNode {
-        return <span className='line-info'>{this.name}</span>;
+        return <React.Fragment>
+            <span className='line-info'>{this.name}</span>
+            {this.renderActions()}
+        </React.Fragment>;
     }
 
+    protected renderActions(): React.ReactNode {
+        return <div className='theia-debug-breakpoint-actions'>
+            <div className={codicon('edit', true)} title={nls.localizeByDefault('Edit Condition...')} onClick={this.onEdit} />
+            <div className={codicon('close', true)} title={nls.localizeByDefault('Remove Breakpoint')} onClick={this.onRemove} />
+        </div>;
+    }
+
+    protected onEdit = async () => {
+        await this.selectInTree();
+        this.open();
+    };
+
+    protected onRemove = async () => {
+        await this.selectInTree();
+        this.remove();
+    };
+
     protected override doGetDecoration(): DebugBreakpointDecoration {
         if (!this.isSupported()) {
             return this.getDisabledBreakpointDecoration(nls.localizeByDefault('Function breakpoints are not supported by this debug type'));

package/src/browser/model/debug-instruction-breakpoint.tsx

@@ -16,6 +16,7 @@
 
 import { nls } from '@theia/core';
 import * as React from '@theia/core/shared/react';
+import { codicon } from '@theia/core/lib/browser';
 import { BreakpointManager } from '../breakpoint/breakpoint-manager';
 import { InstructionBreakpoint } from '../breakpoint/breakpoint-marker';
 import { DebugBreakpoint, DebugBreakpointDecoration, DebugBreakpointOptions } from './debug-breakpoint';
@@ -44,9 +45,23 @@ export class DebugInstructionBreakpoint extends DebugBreakpoint<InstructionBreak
     }
 
     protected doRender(): React.ReactNode {
-        return <span className="line-info">{this.origin.instructionReference}</span>;
+        return <React.Fragment>
+            <span className="line-info">{this.origin.instructionReference}</span>;
+            {this.renderActions()}
+        </React.Fragment>;
     }
 
+    protected renderActions(): React.ReactNode {
+        return <div className='theia-debug-breakpoint-actions'>
+            <div className={codicon('close', true)} title={nls.localizeByDefault('Remove Breakpoint')} onClick={this.onRemove} />
+        </div>;
+    }
+
+    protected onRemove = async () => {
+        await this.selectInTree();
+        this.remove();
+    };
+
     protected getBreakpointDecoration(message?: string[]): DebugBreakpointDecoration {
         if (!this.isSupported()) {
             return {

package/src/browser/model/debug-source-breakpoint.tsx

@@ -16,14 +16,15 @@
 
 import * as React from '@theia/core/shared/react';
 import { DebugProtocol } from '@vscode/debugprotocol/lib/debugProtocol';
-import { nls, RecursivePartial } from '@theia/core';
+import { CommandService, nls, RecursivePartial } from '@theia/core';
 import URI from '@theia/core/lib/common/uri';
 import { EditorWidget, Range } from '@theia/editor/lib/browser';
-import { TREE_NODE_INFO_CLASS, WidgetOpenerOptions } from '@theia/core/lib/browser';
+import { TREE_NODE_INFO_CLASS, WidgetOpenerOptions, codicon } from '@theia/core/lib/browser';
 import { TreeElement } from '@theia/core/lib/browser/source-tree';
 import { SourceBreakpoint } from '../breakpoint/breakpoint-marker';
 import { DebugSource } from './debug-source';
 import { DebugBreakpoint, DebugBreakpointOptions, DebugBreakpointData, DebugBreakpointDecoration } from './debug-breakpoint';
+import { DebugCommands } from '../debug-commands';
 
 export class DebugSourceBreakpointData extends DebugBreakpointData {
     readonly origins: SourceBreakpoint[];
@@ -31,11 +32,13 @@ export class DebugSourceBreakpointData extends DebugBreakpointData {
 
 export class DebugSourceBreakpoint extends DebugBreakpoint<SourceBreakpoint> implements TreeElement {
 
+    protected readonly commandService: CommandService;
     readonly origins: SourceBreakpoint[];
 
-    constructor(origin: SourceBreakpoint, options: DebugBreakpointOptions) {
+    constructor(origin: SourceBreakpoint, options: DebugBreakpointOptions, commandService: CommandService) {
         super(new URI(origin.uri), options);
         this.origins = [origin];
+        this.commandService = commandService;
     }
 
     override update(data: Partial<DebugSourceBreakpointData>): void {
@@ -150,10 +153,28 @@ export class DebugSourceBreakpoint extends DebugBreakpoint<SourceBreakpoint> imp
                 <span className='name'>{this.labelProvider.getName(this.uri)} </span>
                 <span className={'path ' + TREE_NODE_INFO_CLASS}>{this.labelProvider.getLongName(this.uri.parent)} </span>
             </span>
+            {this.renderActions()}
             <span className='line'>{this.renderPosition()}</span>
         </React.Fragment>;
     }
 
+    protected renderActions(): React.ReactNode {
+        return <div className='theia-debug-breakpoint-actions'>
+            <div className={codicon('edit', true)} title={nls.localizeByDefault('Edit Breakpoint')} onClick={this.onEdit} />
+            <div className={codicon('close', true)} title={nls.localizeByDefault('Remove Breakpoint')} onClick={this.onRemove} />
+        </div>;
+    }
+
+    protected onEdit = async () => {
+        await this.selectInTree();
+        this.commandService.executeCommand(DebugCommands.EDIT_BREAKPOINT.id, this);
+    };
+
+    protected onRemove = async () => {
+        await this.selectInTree();
+        this.remove();
+    };
+
     renderPosition(): string {
         return this.line + (typeof this.column === 'number' ? ':' + this.column : '');
     }

package/src/browser/style/index.css

@@ -69,14 +69,13 @@
   font-size: var(--theia-ui-font-size0);
   line-height: calc(var(--theia-private-horizontal-tab-height) / 2);
   border-radius: 2px;
+  margin-left: calc(var(--theia-ui-padding) / 2);
+  white-space: nowrap;
+  flex-shrink: 0;
 }
 
 .theia-data-breakpoint .theia-access-type {
-    margin-left: var(--theia-ui-padding);
-}
-
-.theia-source-breakpoint > .theia-input {
-  min-height: auto;
+  margin-left: var(--theia-ui-padding);
 }
 
 .theia-debug-session .status,
@@ -251,6 +250,15 @@
   display: flex;
 }
 
+.theia-debug-breakpoint-actions {
+  display: none;
+}
+
+.theia-source-breakpoint:hover .theia-debug-breakpoint-actions {
+  display: flex;
+  align-items: center;
+}
+
 /** Editor **/
 
 .theia-debug-breakpoint-icon {

package/src/browser/view/debug-action.tsx

@@ -21,7 +21,7 @@ import { MenuPath } from '@theia/core';
 export class DebugAction extends React.Component<DebugAction.Props> {
 
     override render(): React.ReactNode {
-        const { enabled, label, iconClass } = this.props;
+        const { enabled, label, tooltip, iconClass } = this.props;
         const classNames = ['debug-action'];
         if (iconClass) {
             classNames.push(...codiconArray(iconClass, true));
@@ -31,7 +31,7 @@ export class DebugAction extends React.Component<DebugAction.Props> {
         }
         return <span tabIndex={0}
             className={classNames.join(' ')}
-            title={label}
+            title={tooltip || label}
             onClick={() => { this.props.run([]); }}
             ref={this.setRef} >
             {!iconClass && <div>{label}</div>}
@@ -51,6 +51,7 @@ export class DebugAction extends React.Component<DebugAction.Props> {
 export namespace DebugAction {
     export interface Props {
         label: string
+        tooltip?: string
         iconClass: string
         run: (effectiveMenuPath: MenuPath) => void
         enabled?: boolean

package/src/browser/view/debug-breakpoints-source.tsx

@@ -19,6 +19,7 @@ import { TreeSource, TreeElement } from '@theia/core/lib/browser/source-tree';
 import { DebugViewModel } from './debug-view-model';
 import { BreakpointManager } from '../breakpoint/breakpoint-manager';
 import { DebugExceptionBreakpoint } from './debug-exception-breakpoint';
+import { CommandService } from '@theia/core/lib/common';
 
 @injectable()
 export class DebugBreakpointsSource extends TreeSource {
@@ -29,6 +30,9 @@ export class DebugBreakpointsSource extends TreeSource {
     @inject(BreakpointManager)
     protected readonly breakpoints: BreakpointManager;
 
+    @inject(CommandService)
+    protected readonly commandService: CommandService;
+
     @postConstruct()
     protected init(): void {
         this.fireDidChange();
@@ -37,7 +41,7 @@ export class DebugBreakpointsSource extends TreeSource {
 
     *getElements(): IterableIterator<TreeElement> {
         for (const exceptionBreakpoint of this.breakpoints.getExceptionBreakpoints()) {
-            yield new DebugExceptionBreakpoint(exceptionBreakpoint, this.breakpoints);
+            yield new DebugExceptionBreakpoint(exceptionBreakpoint, this.breakpoints, this.commandService);
         }
         yield* this.model.dataBreakpoints;
         yield* this.model.functionBreakpoints;

package/src/browser/view/debug-configuration-widget.tsx

@@ -21,7 +21,7 @@ import * as React from '@theia/core/shared/react';
 import { WorkspaceService } from '@theia/workspace/lib/browser';
 import { DebugConsoleContribution } from '../console/debug-console-contribution';
 import { DebugConfigurationManager } from '../debug-configuration-manager';
-import { DebugCommands } from '../debug-frontend-application-contribution';
+import { DebugCommands } from '../debug-commands';
 import { DebugSessionManager } from '../debug-session-manager';
 import { DebugAction } from './debug-action';
 import { DebugConfigurationSelect } from './debug-configuration-select';

package/src/browser/view/debug-exception-breakpoint.tsx

@@ -18,22 +18,26 @@ import * as React from '@theia/core/shared/react';
 import { TreeElement } from '@theia/core/lib/browser/source-tree';
 import { BreakpointManager } from '../breakpoint/breakpoint-manager';
 import { ExceptionBreakpoint } from '../breakpoint/breakpoint-marker';
-import { SingleTextInputDialog } from '@theia/core/lib/browser/dialogs';
-import { TREE_NODE_INFO_CLASS } from '@theia/core/lib/browser';
-import { nls } from '@theia/core';
+import { SingleTextInputDialog, TREE_NODE_INFO_CLASS, codicon, TreeWidget } from '@theia/core/lib/browser';
+import { SelectableTreeNode } from '@theia/core/lib/browser/tree/tree-selection';
+import { nls, CommandService } from '@theia/core';
+import { DebugCommands } from '../debug-commands';
 
 export class DebugExceptionBreakpoint implements TreeElement {
 
     readonly id: string;
+    protected treeWidget?: TreeWidget;
 
     constructor(
         readonly data: ExceptionBreakpoint,
-        readonly breakpoints: BreakpointManager
+        readonly breakpoints: BreakpointManager,
+        protected readonly commandService: CommandService
     ) {
         this.id = data.raw.filter + ':' + data.raw.label;
     }
 
-    render(): React.ReactNode {
+    render(host: TreeWidget): React.ReactNode {
+        this.treeWidget = host;
         return <div title={this.data.raw.description || this.data.raw.label} className='theia-source-breakpoint'>
             <span className='theia-debug-breakpoint-icon' />
             <input type='checkbox' checked={this.data.enabled} onChange={this.toggle} />
@@ -43,9 +47,30 @@ export class DebugExceptionBreakpoint implements TreeElement {
                     <span title={nls.localizeByDefault('Expression condition: {0}', this.data.condition)}
                         className={'path ' + TREE_NODE_INFO_CLASS}>{this.data.condition} </span>}
             </span>
+            {this.renderActions()}
         </div>;
     }
 
+    protected renderActions(): React.ReactNode {
+        if (this.data.raw.supportsCondition) {
+            return <div className='theia-debug-breakpoint-actions'>
+                <div className={codicon('edit', true)} title={nls.localizeByDefault('Edit Condition...')} onClick={this.onEdit} />
+            </div>;
+        }
+        return undefined;
+    }
+
+    protected onEdit = async () => {
+        await this.selectInTree();
+        this.commandService.executeCommand(DebugCommands.EDIT_BREAKPOINT_CONDITION.id);
+    };
+
+    protected async selectInTree(): Promise<void> {
+        if (this.treeWidget?.model && SelectableTreeNode.is(this)) {
+            this.treeWidget.model.selectNode(this);
+        }
+    }
+
     protected toggle = () => this.breakpoints.toggleExceptionBreakpoint(this.data.raw.filter);
 
     async editCondition(): Promise<void> {

package/src/browser/view/debug-session-widget.ts

@@ -100,11 +100,6 @@ export class DebugSessionWidget extends BaseWidget implements StatefulWidget, Ap
         layout.addWidget(this.viewContainer);
     }
 
-    protected override onActivateRequest(msg: Message): void {
-        super.onActivateRequest(msg);
-        this.toolbar.focus();
-    }
-
     protected override onAfterShow(msg: Message): void {
         super.onAfterShow(msg);
         this.getTrackableWidgets().forEach(w => w.update());