DEL key doesn't work when renaming a file (fixes #20195)

src/vs/base/browser/ui/list/listPaging.ts

@@ -62,7 +62,6 @@ export class PagedList<T> {
 
 	private list: List<number>;
 	private _model: IPagedModel<T>;
-	get onDOMFocus(): Event<FocusEvent> { return this.list.onDOMFocus; }
 
 	constructor(
 		container: HTMLElement,

src/vs/base/browser/ui/list/listWidget.ts

@@ -254,13 +254,13 @@ export class List<T> implements IDisposable {
 		return fromCallback(handler => this.view.addListener('contextmenu', handler));
 	}
 
-	private _onDOMFocus: Event<FocusEvent>;
-	get onDOMFocus(): Event<FocusEvent> { return this._onDOMFocus; }
+	private _onDOMFocus = new Emitter<void>();
+	get onDOMFocus(): Event<void> { return this._onDOMFocus.event; }
 
-	private _onDOMBlur: Event<FocusEvent>;
-	get onDOMBlur(): Event<FocusEvent> { return this._onDOMBlur; }
+	private _onDOMBlur = new Emitter<void>();
+	get onDOMBlur(): Event<void> { return this._onDOMBlur.event; }
 
-	private _onDispose: Emitter<void>;
+	private _onDispose = new Emitter<void>();
 	get onDispose(): Event<void> { return this._onDispose.event; }
 
 	constructor(
@@ -283,12 +283,12 @@ export class List<T> implements IDisposable {
 		this.view.domNode.setAttribute('role', 'tree');
 		this.view.domNode.tabIndex = 0;
 
-		this._onDOMFocus = domEvent(this.view.domNode, 'focus');
-		this._onDOMBlur = domEvent(this.view.domNode, 'blur');
-		this._onDispose = new Emitter<void>();
-
 		this.disposables = [this.focus, this.selection, this.view, this._onDispose];
 
+		const tracker = DOM.trackFocus(this.view.domNode);
+		this.disposables.push(tracker.addFocusListener(() => setTimeout(() => this._onDOMFocus.fire())));
+		this.disposables.push(tracker.addBlurListener(() => this._onDOMBlur.fire()));
+
 		if (typeof options.keyboardSupport !== 'boolean' || options.keyboardSupport) {
 			this.keyboardController = new KeyboardController(this, this.view);
 			this.disposables.push(this.keyboardController);

src/vs/base/parts/tree/browser/tree.ts

@@ -17,8 +17,9 @@ export interface ITree extends Events.IEventEmitter {
 
 	emit(eventType: string, data?: any): void;
 
-	onDOMFocus: Event<FocusEvent>;
-	onDOMBlur: Event<FocusEvent>;
+	onDOMFocus: Event<void>;
+	onDOMBlur: Event<void>;
+	onHighlightChange: Event<void>;
 	onDispose: Event<void>;
 
 	/**

src/vs/base/parts/tree/browser/treeImpl.ts

@@ -13,6 +13,7 @@ import View = require('./treeView');
 import _ = require('vs/base/parts/tree/browser/tree');
 import { INavigator, MappedNavigator } from 'vs/base/common/iterator';
 import Event, { Emitter } from 'vs/base/common/event';
+import Lifecycle = require('vs/base/common/lifecycle');
 
 export class TreeContext implements _.ITreeContext {
 
@@ -58,11 +59,20 @@ export class Tree extends Events.EventEmitter implements _.ITree {
 	private view: View.TreeView;
 
 	private _onDispose: Emitter<void>;
+	private _onHighlightChange: Emitter<void>;
+
+	private toDispose: Lifecycle.IDisposable[];
 
 	constructor(container: HTMLElement, configuration: _.ITreeConfiguration, options: _.ITreeOptions = {}) {
 		super();
 
+		this.toDispose = [];
+
 		this._onDispose = new Emitter<void>();
+		this._onHighlightChange = new Emitter<void>();
+
+		this.toDispose.push(this._onDispose, this._onHighlightChange);
+
 		this.container = container;
 		this.configuration = configuration;
 		this.options = options;
@@ -82,16 +92,22 @@ export class Tree extends Events.EventEmitter implements _.ITree {
 
 		this.addEmitter2(this.model);
 		this.addEmitter2(this.view);
+
+		this.toDispose.push(this.model.addListener2('highlight', () => setTimeout(() => this._onHighlightChange.fire())));
 	}
 
-	get onDOMFocus(): Event<FocusEvent> {
+	get onDOMFocus(): Event<void> {
 		return this.view && this.view.onDOMFocus;
 	}
 
-	get onDOMBlur(): Event<FocusEvent> {
+	get onDOMBlur(): Event<void> {
 		return this.view && this.view.onDOMBlur;
 	}
 
+	get onHighlightChange(): Event<void> {
+		return this._onHighlightChange && this._onHighlightChange.event;
+	}
+
 	get onDispose(): Event<void> {
 		return this._onDispose && this._onDispose.event;
 	}
@@ -339,6 +355,8 @@ export class Tree extends Events.EventEmitter implements _.ITree {
 	}
 
 	public dispose(): void {
+		this._onDispose.fire();
+
 		if (this.model !== null) {
 			this.model.dispose();
 			this.model = null;
@@ -348,8 +366,7 @@ export class Tree extends Events.EventEmitter implements _.ITree {
 			this.view = null;
 		}
 
-		this._onDispose.fire();
-		this._onDispose.dispose();
+		this.toDispose = Lifecycle.dispose(this.toDispose);
 
 		super.dispose();
 	}

src/vs/base/parts/tree/browser/treeView.ts

@@ -440,11 +440,11 @@ export class TreeView extends HeightMap {
 	private highlightedItemWasDraggable: boolean;
 	private onHiddenScrollTop: number;
 
-	private _onDOMFocus: Emitter<FocusEvent> = new Emitter<FocusEvent>();
-	get onDOMFocus(): Event<FocusEvent> { return this._onDOMFocus.event; }
+	private _onDOMFocus: Emitter<void> = new Emitter<void>();
+	get onDOMFocus(): Event<void> { return this._onDOMFocus.event; }
 
-	private _onDOMBlur: Emitter<FocusEvent> = new Emitter<FocusEvent>();
-	get onDOMBlur(): Event<FocusEvent> { return this._onDOMBlur.event; }
+	private _onDOMBlur: Emitter<void> = new Emitter<void>();
+	get onDOMBlur(): Event<void> { return this._onDOMBlur.event; }
 
 	constructor(context: _.ITreeContext, container: HTMLElement) {
 		super();
@@ -1523,7 +1523,7 @@ export class TreeView extends HeightMap {
 			DOM.addClass(this.domNode, 'focused');
 		}
 
-		this._onDOMFocus.fire();
+		setTimeout(() => this._onDOMFocus.fire());
 	}
 
 	private onBlur(): void {

src/vs/platform/list/browser/listService.ts

@@ -52,16 +52,25 @@ export class ListService implements IListService {
 			widget.onDOMBlur(() => this.onListDOMBlur(widget))
 		];
 
+		// Special treatment for tree highlight mode
+		if (!(widget instanceof List)) {
+			toDispose.push(widget.onHighlightChange(() => {
+				if (widget.getHighlight()) {
+					this.onListDOMBlur(widget);
+				} else if (widget.isDOMFocused()) {
+					this.onListDOMFocus(widget);
+				}
+			}));
+		}
+
 		return {
 			dispose: () => dispose(toDispose)
 		};
 	}
 
 	private onListDOMFocus(list: ITree | List<any>): void {
-		setTimeout(() => {
-			this.focusedTreeOrList = list;
-			this.listFocusContext.set(true);
-		}, 0 /* helps to track focus correctly when focus moves between 2 lists */);
+		this.focusedTreeOrList = list;
+		this.listFocusContext.set(true);
 	}
 
 	private onListDOMBlur(list: ITree | List<any>): void {
@@ -70,6 +79,10 @@ export class ListService implements IListService {
 	}
 
 	public getFocused(): ITree | List<any> {
+		if (!(this.focusedTreeOrList instanceof List) && this.focusedTreeOrList.getHighlight()) {
+			return null; // a tree in highlight mode is not focused
+		}
+
 		return this.focusedTreeOrList;
 	}
 }
\ No newline at end of file

src/vs/workbench/electron-browser/commands.ts

@@ -103,7 +103,7 @@ export function registerCommands(): void {
 			const focused = listService.getFocused();
 
 			// Tree only
-			if (!(focused instanceof List)) {
+			if (focused && !(focused instanceof List)) {
 				const tree = focused;
 				const focus = tree.getFocus();
 
@@ -130,7 +130,7 @@ export function registerCommands(): void {
 			const focused = listService.getFocused();
 
 			// Tree only
-			if (!(focused instanceof List)) {
+			if (focused && !(focused instanceof List)) {
 				const tree = focused;
 				const focus = tree.getFocus();
 
@@ -292,7 +292,7 @@ export function registerCommands(): void {
 			const focused = listService.getFocused();
 
 			// Tree only
-			if (!(focused instanceof List)) {
+			if (focused && !(focused instanceof List)) {
 				const tree = focused;
 				const focus = tree.getFocus();
 
@@ -313,7 +313,7 @@ export function registerCommands(): void {
 			const focused = listService.getFocused();
 
 			// Tree only
-			if (!(focused instanceof List)) {
+			if (focused && !(focused instanceof List)) {
 				const tree = focused;
 
 				if (tree.getSelection().length) {

src/vs/workbench/parts/files/browser/views/explorerView.ts

@@ -369,18 +369,15 @@ export class ExplorerView extends CollapsibleViewletView {
 		}));
 
 		// Update explorer focus context
-		const viewerFocusTracker = DOM.trackFocus(this.explorerViewer.getHTMLElement());
-		viewerFocusTracker.addFocusListener(() => {
-			setTimeout(() => {
-				this.filesExplorerFocussedContext.set(true);
-				this.explorerFocussedContext.set(true);
-			}, 0 /* wait for any BLUR to happen */);
-		});
-		viewerFocusTracker.addBlurListener(() => {
+		this.toDispose.push(this.explorerViewer.onDOMFocus(() => {
+			this.filesExplorerFocussedContext.set(true);
+			this.explorerFocussedContext.set(true);
+		}));
+
+		this.toDispose.push(this.explorerViewer.onDOMBlur(() => {
 			this.filesExplorerFocussedContext.reset();
 			this.explorerFocussedContext.reset();
-		});
-		this.toDispose.push(viewerFocusTracker);
+		}));
 
 		return this.explorerViewer;
 	}

src/vs/workbench/parts/files/browser/views/openEditorsView.ts

@@ -125,18 +125,15 @@ export class OpenEditorsView extends AdaptiveCollapsibleViewletView {
 		this.toDispose.push(this.listService.register(this.tree));
 
 		// Update open editors focus context
-		const viewerFocusTracker = dom.trackFocus(this.tree.getHTMLElement());
-		viewerFocusTracker.addFocusListener(() => {
-			setTimeout(() => {
-				this.openEditorsFocussedContext.set(true);
-				this.explorerFocussedContext.set(true);
-			}, 0 /* wait for any BLUR to happen */);
-		});
-		viewerFocusTracker.addBlurListener(() => {
+		this.toDispose.push(this.tree.onDOMFocus(() => {
+			this.openEditorsFocussedContext.set(true);
+			this.explorerFocussedContext.set(true);
+		}));
+
+		this.toDispose.push(this.tree.onDOMBlur(() => {
 			this.openEditorsFocussedContext.reset();
 			this.explorerFocussedContext.reset();
-		});
-		this.toDispose.push(viewerFocusTracker);
+		}));
 
 		this.fullRefreshNeeded = true;
 		this.structuralTreeUpdate();