History navigation for Find Widget in webview. Fix #29708.

rebornix · rebornix · commit c80f26a169ce · 2017-08-28T14:28:00.000-07:00
diff --git a/src/vs/workbench/parts/extensions/browser/extensionEditor.ts b/src/vs/workbench/parts/extensions/browser/extensionEditor.ts
@@ -51,14 +51,18 @@ import { KeybindingLabel } from 'vs/base/browser/ui/keybindingLabel/keybindingLa
 import { attachListStyler } from 'vs/platform/theme/common/styler';
 import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
 import { IContextKeyService, RawContextKey, ContextKeyExpr, IContextKey } from 'vs/platform/contextkey/common/contextkey';
-import { Command } from 'vs/editor/common/editorCommonExtensions';
+import { Command, ICommandOptions } from 'vs/editor/common/editorCommonExtensions';
 import { IWorkbenchEditorService } from 'vs/workbench/services/editor/common/editorService';
 import { KeybindingsRegistry } from 'vs/platform/keybinding/common/keybindingsRegistry';
 
 /**  A context key that is set when an extension editor webview has focus. */
 export const KEYBINDING_CONTEXT_EXTENSIONEDITOR_WEBVIEW_FOCUS = new RawContextKey<boolean>('extensionEditorWebviewFocus', undefined);
 /**  A context key that is set when an extension editor webview not have focus. */
 export const KEYBINDING_CONTEXT_EXTENSIONEDITOR_WEBVIEW_NOT_FOCUSED: ContextKeyExpr = KEYBINDING_CONTEXT_EXTENSIONEDITOR_WEBVIEW_FOCUS.toNegated();
+/**  A context key that is set when the find widget find input in extension editor webview is focused. */
+export const KEYBINDING_CONTEXT_EXTENSIONEDITOR_FIND_WIDGET_INPUT_FOCUSED = new RawContextKey<boolean>('extensionEditorFindWidgetInputFocused', false);
+/**  A context key that is set when the find widget find input in extension editor webview is not focused. */
+export const KEYBINDING_CONTEXT_EXTENSIONEDITOR_FIND_WIDGET_INPUT_NOT_FOCUSED: ContextKeyExpr = KEYBINDING_CONTEXT_EXTENSIONEDITOR_FIND_WIDGET_INPUT_FOCUSED.toNegated();
 
 function renderBody(body: string): string {
 	return `<!DOCTYPE html>
@@ -168,6 +172,7 @@ export class ExtensionEditor extends BaseEditor {
 	private extensionDependencies: Cache<IExtensionDependencies>;
 
 	private contextKey: IContextKey<boolean>;
+	private findInputFocusContextKey: IContextKey<boolean>;
 	private layoutParticipants: ILayoutParticipant[] = [];
 	private contentDisposables: IDisposable[] = [];
 	private transientDisposables: IDisposable[] = [];
@@ -199,6 +204,7 @@ export class ExtensionEditor extends BaseEditor {
 		this.extensionManifest = null;
 		this.extensionDependencies = null;
 		this.contextKey = KEYBINDING_CONTEXT_EXTENSIONEDITOR_WEBVIEW_FOCUS.bindTo(contextKeyService);
+		this.findInputFocusContextKey = KEYBINDING_CONTEXT_EXTENSIONEDITOR_FIND_WIDGET_INPUT_FOCUSED.bindTo(contextKeyService);
 	}
 
 	createEditor(parent: Builder): void {
@@ -346,6 +352,18 @@ export class ExtensionEditor extends BaseEditor {
 		}
 	}
 
+	public showNextFindTerm() {
+		if (this.activeWebview) {
+			this.activeWebview.showNextFindTerm();
+		}
+	}
+
+	public showPreviousFindTerm() {
+		if (this.activeWebview) {
+			this.activeWebview.showPreviousFindTerm();
+		}
+	}
+
 	private onNavbarChange(extension: IExtension, id: string): void {
 		this.contentDisposables = dispose(this.contentDisposables);
 		this.content.innerHTML = '';
@@ -366,7 +384,7 @@ export class ExtensionEditor extends BaseEditor {
 			.then<void>(body => {
 				const allowedBadgeProviders = this.extensionsWorkbenchService.allowedBadgeProviders;
 				const webViewOptions = allowedBadgeProviders.length > 0 ? { allowScripts: false, allowSvgs: false, svgWhiteList: allowedBadgeProviders } : undefined;
-				this.activeWebview = new WebView(this.content, this.partService.getContainer(Parts.EDITOR_PART), this.contextViewService, this.contextKey, webViewOptions);
+				this.activeWebview = new WebView(this.content, this.partService.getContainer(Parts.EDITOR_PART), this.contextViewService, this.contextKey, this.findInputFocusContextKey, webViewOptions);
 				const removeLayoutParticipant = arrays.insert(this.layoutParticipants, this.activeWebview);
 				this.contentDisposables.push(toDisposable(removeLayoutParticipant));
 
@@ -847,3 +865,46 @@ const hideCommand = new ShowExtensionEditorFindCommand({
 	}
 });
 KeybindingsRegistry.registerCommandAndKeybindingRule(hideCommand.toCommandAndKeybindingRule(KeybindingsRegistry.WEIGHT.editorContrib()));
+
+class ShowExtensionEditorFindTermCommand extends Command {
+	constructor(opts: ICommandOptions, private _next: boolean) {
+		super(opts);
+	}
+
+	public runCommand(accessor: ServicesAccessor, args: any): void {
+		const extensionEditor = this.getExtensionEditor(accessor);
+		if (extensionEditor) {
+			if (this._next) {
+				extensionEditor.showNextFindTerm();
+			} else {
+				extensionEditor.showPreviousFindTerm();
+			}
+		}
+	}
+
+	private getExtensionEditor(accessor: ServicesAccessor): ExtensionEditor {
+		const activeEditor = accessor.get(IWorkbenchEditorService).getActiveEditor() as ExtensionEditor;
+		if (activeEditor instanceof ExtensionEditor) {
+			return activeEditor;
+		}
+		return null;
+	}
+}
+
+const showNextFindTermCommand = new ShowExtensionEditorFindTermCommand({
+	id: 'editor.action.extensioneditor.showNextFindTerm',
+	precondition: KEYBINDING_CONTEXT_EXTENSIONEDITOR_FIND_WIDGET_INPUT_FOCUSED,
+	kbOpts: {
+		primary: KeyMod.Alt | KeyCode.DownArrow
+	}
+}, true);
+KeybindingsRegistry.registerCommandAndKeybindingRule(showNextFindTermCommand.toCommandAndKeybindingRule(KeybindingsRegistry.WEIGHT.editorContrib()));
+
+const showPreviousFindTermCommand = new ShowExtensionEditorFindTermCommand({
+	id: 'editor.action.extensioneditor.showPreviousFindTerm',
+	precondition: KEYBINDING_CONTEXT_EXTENSIONEDITOR_FIND_WIDGET_INPUT_FOCUSED,
+	kbOpts: {
+		primary: KeyMod.Alt | KeyCode.UpArrow
+	}
+}, false);
+KeybindingsRegistry.registerCommandAndKeybindingRule(showPreviousFindTermCommand.toCommandAndKeybindingRule(KeybindingsRegistry.WEIGHT.editorContrib()));
diff --git a/src/vs/workbench/parts/html/browser/htmlPreviewPart.ts b/src/vs/workbench/parts/html/browser/htmlPreviewPart.ts
@@ -84,7 +84,7 @@ export class HtmlPreviewPart extends WebviewEditor {
 				webviewOptions = this.input.options;
 			}
 
-			this._webview = new Webview(this.content, this.partService.getContainer(Parts.EDITOR_PART), this._contextViewService, this.contextKey, webviewOptions);
+			this._webview = new Webview(this.content, this.partService.getContainer(Parts.EDITOR_PART), this._contextViewService, this.contextKey, this.findInputFocusContextKey, webviewOptions);
 			if (this.input && this.input instanceof HtmlInput) {
 				const state = this.loadViewState(this.input.getResource());
 				this.scrollYPercentage = state ? state.scrollYPercentage : 0;
diff --git a/src/vs/workbench/parts/html/browser/webview.ts b/src/vs/workbench/parts/html/browser/webview.ts
@@ -74,6 +74,7 @@ export default class Webview {
 		private _styleElement: Element,
 		@IContextViewService private _contextViewService: IContextViewService,
 		private _contextKey: IContextKey<boolean>,
+		private _findInputContextKey: IContextKey<boolean>,
 		private _options: WebviewOptions = {},
 	) {
 		this._webview = <any>document.createElement('webview');
@@ -205,6 +206,10 @@ export default class Webview {
 		this._contextKey.set(isFocused || document.activeElement === this._webview);
 	}
 
+	public notifyFindWidgetInputFocusChanged(isFocused: boolean) {
+		this._findInputContextKey.set(isFocused);
+	}
+
 	dispose(): void {
 		this._onDidClickLink.dispose();
 		this._disposables = dispose(this._disposables);
@@ -450,4 +455,12 @@ export default class Webview {
 	public hideFind() {
 		this._webviewFindWidget.hide();
 	}
+
+	public showNextFindTerm() {
+		this._webviewFindWidget.showNextFindTerm();
+	}
+
+	public showPreviousFindTerm() {
+		this._webviewFindWidget.showPreviousFindTerm();
+	}
 }
diff --git a/src/vs/workbench/parts/html/browser/webviewEditor.ts b/src/vs/workbench/parts/html/browser/webviewEditor.ts
@@ -9,7 +9,7 @@ import { BaseWebviewEditor } from 'vs/workbench/browser/parts/editor/webviewEdit
 import { IStorageService } from 'vs/platform/storage/common/storage';
 
 import { ServicesAccessor } from 'vs/platform/instantiation/common/instantiation';
-import { Command } from 'vs/editor/common/editorCommonExtensions';
+import { Command, ICommandOptions } from 'vs/editor/common/editorCommonExtensions';
 import { IWorkbenchEditorService } from 'vs/workbench/services/editor/common/editorService';
 import { KeyMod, KeyCode } from 'vs/base/common/keyCodes';
 import { ContextKeyExpr, IContextKey, RawContextKey, IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
@@ -26,6 +26,10 @@ export interface HtmlPreviewEditorViewState {
 export const KEYBINDING_CONTEXT_WEBVIEWEDITOR_FOCUS = new RawContextKey<boolean>('webviewEditorFocus', undefined);
 /**  A context key that is set when a webview editor does not have focus. */
 export const KEYBINDING_CONTEXT_WEBVIEWEDITOR_NOT_FOCUSED: ContextKeyExpr = KEYBINDING_CONTEXT_WEBVIEWEDITOR_FOCUS.toNegated();
+/**  A context key that is set when the find widget find input in webview editor webview is focused. */
+export const KEYBINDING_CONTEXT_WEBVIEWEDITOR_FIND_WIDGET_INPUT_FOCUSED = new RawContextKey<boolean>('webviewEditorFindWidgetInputFocused', false);
+/**  A context key that is set when the find widget find input in webview editor webview is not focused. */
+export const KEYBINDING_CONTEXT_WEBVIEWEDITOR_FIND_WIDGET_INPUT_NOT_FOCUSED: ContextKeyExpr = KEYBINDING_CONTEXT_WEBVIEWEDITOR_FIND_WIDGET_INPUT_FOCUSED.toNegated();
 
 /**
  * This class is only intended to be subclassed and not instantiated.
@@ -36,6 +40,7 @@ export abstract class WebviewEditor extends BaseWebviewEditor {
 	protected _webview: WebView;
 	protected content: HTMLElement;
 	protected contextKey: IContextKey<boolean>;
+	protected findInputFocusContextKey: IContextKey<boolean>;
 
 	constructor(
 		id: string,
@@ -47,6 +52,7 @@ export abstract class WebviewEditor extends BaseWebviewEditor {
 		super(id, telemetryService, themeService, storageService);
 		if (contextKeyService) {
 			this.contextKey = KEYBINDING_CONTEXT_WEBVIEWEDITOR_FOCUS.bindTo(contextKeyService);
+			this.findInputFocusContextKey = KEYBINDING_CONTEXT_WEBVIEWEDITOR_FIND_WIDGET_INPUT_FOCUSED.bindTo(contextKeyService);
 		}
 	}
 
@@ -62,6 +68,18 @@ export abstract class WebviewEditor extends BaseWebviewEditor {
 		}
 	}
 
+	public showNextFindTerm() {
+		if (this._webview) {
+			this._webview.showNextFindTerm();
+		}
+	}
+
+	public showPreviousFindTerm() {
+		if (this._webview) {
+			this._webview.showPreviousFindTerm();
+		}
+	}
+
 	public updateStyles() {
 		super.updateStyles();
 		if (this._webview) {
@@ -124,4 +142,47 @@ const hideCommand = new HideWebViewEditorFindCommand({
 		primary: KeyCode.Escape
 	}
 });
-KeybindingsRegistry.registerCommandAndKeybindingRule(hideCommand.toCommandAndKeybindingRule(KeybindingsRegistry.WEIGHT.editorContrib()));
+KeybindingsRegistry.registerCommandAndKeybindingRule(hideCommand.toCommandAndKeybindingRule(KeybindingsRegistry.WEIGHT.editorContrib()));
+
+class ShowWebViewEditorFindTermCommand extends Command {
+	constructor(opts: ICommandOptions, private _next: boolean) {
+		super(opts);
+	}
+
+	public runCommand(accessor: ServicesAccessor, args: any): void {
+		const webViewEditor = this.getWebViewEditor(accessor);
+		if (webViewEditor) {
+			if (this._next) {
+				webViewEditor.showNextFindTerm();
+			} else {
+				webViewEditor.showPreviousFindTerm();
+			}
+		}
+	}
+
+	private getWebViewEditor(accessor: ServicesAccessor): WebviewEditor {
+		const activeEditor = accessor.get(IWorkbenchEditorService).getActiveEditor() as WebviewEditor;
+		if (activeEditor.isWebviewEditor) {
+			return activeEditor;
+		}
+		return null;
+	}
+}
+
+const showNextFindTermCommand = new ShowWebViewEditorFindTermCommand({
+	id: 'editor.action.webvieweditor.showNextFindTerm',
+	precondition: KEYBINDING_CONTEXT_WEBVIEWEDITOR_FIND_WIDGET_INPUT_FOCUSED,
+	kbOpts: {
+		primary: KeyMod.Alt | KeyCode.DownArrow
+	}
+}, true);
+KeybindingsRegistry.registerCommandAndKeybindingRule(showNextFindTermCommand.toCommandAndKeybindingRule(KeybindingsRegistry.WEIGHT.editorContrib()));
+
+const showPreviousFindTermCommand = new ShowWebViewEditorFindTermCommand({
+	id: 'editor.action.webvieweditor.showPreviousFindTerm',
+	precondition: KEYBINDING_CONTEXT_WEBVIEWEDITOR_FIND_WIDGET_INPUT_FOCUSED,
+	kbOpts: {
+		primary: KeyMod.Alt | KeyCode.UpArrow
+	}
+}, false);
+KeybindingsRegistry.registerCommandAndKeybindingRule(showPreviousFindTermCommand.toCommandAndKeybindingRule(KeybindingsRegistry.WEIGHT.editorContrib()));
diff --git a/src/vs/workbench/parts/html/browser/webviewFindWidget.ts b/src/vs/workbench/parts/html/browser/webviewFindWidget.ts
@@ -54,4 +54,11 @@ export class WebviewFindWidget extends SimpleFindWidget {
 		this.webview.notifyFindWidgetFocusChanged(false);
 	}
 
+	protected onFindInputFocusTrackerFocus() {
+		this.webview.notifyFindWidgetInputFocusChanged(true);
+	}
+
+	protected onFindInputFocusTrackerBlur() {
+		this.webview.notifyFindWidgetInputFocusChanged(false);
+	}
 }
diff --git a/src/vs/workbench/parts/update/electron-browser/releaseNotesEditor.ts b/src/vs/workbench/parts/update/electron-browser/releaseNotesEditor.ts
@@ -91,7 +91,7 @@ export class ReleaseNotesEditor extends WebviewEditor {
 		};
 
 		const body = renderBody(marked(text, { renderer }));
-		this._webview = new WebView(this.content, this.partService.getContainer(Parts.EDITOR_PART), this._contextViewService, this.contextKey);
+		this._webview = new WebView(this.content, this.partService.getContainer(Parts.EDITOR_PART), this._contextViewService, this.contextKey, this.findInputFocusContextKey);
 		if (this.input && this.input instanceof ReleaseNotesInput) {
 			const state = this.loadViewState(this.input.version);
 			if (state) {

Original file line number	Diff line number	Diff line change
`@@ -84,7 +84,7 @@ export class HtmlPreviewPart extends WebviewEditor {`
`84`	`84`	`webviewOptions = this.input.options;`
`85`	`85`	`}`
`86`	`86`
`87`		`- this._webview = new Webview(this.content, this.partService.getContainer(Parts.EDITOR_PART), this._contextViewService, this.contextKey, webviewOptions);`
	`87`	`+ this._webview = new Webview(this.content, this.partService.getContainer(Parts.EDITOR_PART), this._contextViewService, this.contextKey, this.findInputFocusContextKey, webviewOptions);`
`88`	`88`	`if (this.input && this.input instanceof HtmlInput) {`
`89`	`89`	`const state = this.loadViewState(this.input.getResource());`
`90`	`90`	`this.scrollYPercentage = state ? state.scrollYPercentage : 0;`
Original file line number	Diff line number	Diff line change
`@@ -54,4 +54,11 @@ export class WebviewFindWidget extends SimpleFindWidget {`
`54`	`54`	`this.webview.notifyFindWidgetFocusChanged(false);`
`55`	`55`	`}`
`56`	`56`
	`57`	`+ protected onFindInputFocusTrackerFocus() {`
	`58`	`+ this.webview.notifyFindWidgetInputFocusChanged(true);`
	`59`	`+ }`
	`60`	`+`
	`61`	`+ protected onFindInputFocusTrackerBlur() {`
	`62`	`+ this.webview.notifyFindWidgetInputFocusChanged(false);`
	`63`	`+ }`
`57`	`64`	`}`