diff --git a/src/vs/workbench/contrib/debug/browser/breakpointsView.ts b/src/vs/workbench/contrib/debug/browser/breakpointsView.ts
index 9a21e572a7d185962e2a87ef9f6c1130336bb9a5..b2035876e8d76660cbee1082401687e838cab1a4 100644
--- a/src/vs/workbench/contrib/debug/browser/breakpointsView.ts
+++ b/src/vs/workbench/contrib/debug/browser/breakpointsView.ts
@@ -110,25 +110,28 @@ export class BreakpointsView extends ViewPane {
 
 		this._register(this.list.onContextMenu(this.onListContextMenu, this));
 
+		this.list.onMouseMiddleClick(async ({ element }) => {
+			if (element instanceof Breakpoint) {
+				await this.debugService.removeBreakpoints(element.getId());
+			} else if (element instanceof FunctionBreakpoint) {
+				await this.debugService.removeFunctionBreakpoints(element.getId());
+			} else if (element instanceof DataBreakpoint) {
+				await this.debugService.removeDataBreakpoints(element.getId());
+			}
+		});
+
 		const resourceNavigator = this._register(new ListResourceNavigator(this.list, { configurationService: this.configurationService }));
 		this._register(resourceNavigator.onDidOpen(async e => {
-			if (!e.element) {
+			if (e.element === null) {
 				return;
 			}
 
-			const element = this.list.element(e.element);
-
 			if (e.browserEvent instanceof MouseEvent && e.browserEvent.button === 1) { // middle click
-				if (element instanceof Breakpoint) {
-					await this.debugService.removeBreakpoints(element.getId());
-				} else if (element instanceof FunctionBreakpoint) {
-					await this.debugService.removeFunctionBreakpoints(element.getId());
-				} else if (element instanceof DataBreakpoint) {
-					await this.debugService.removeDataBreakpoints(element.getId());
-				}
 				return;
 			}
 
+			const element = this.list.element(e.element);
+
 			if (element instanceof Breakpoint) {
 				openBreakpointSource(element, e.sideBySide, e.editorOptions.preserveFocus || false, this.debugService, this.editorService);
 			}