CSS Highlight fallback. (microsoft#166156)

rebornix · web-flow · commit 3b81dd8d4879 · 2022-11-11T14:47:08.000-08:00
diff --git a/src/vs/workbench/contrib/notebook/browser/contrib/find/findFilters.ts b/src/vs/workbench/contrib/notebook/browser/contrib/find/findFilters.ts
@@ -26,7 +26,8 @@ export class NotebookFindFilters extends Disposable {
 	set markupInput(value: boolean) {
 		if (this._markupInput !== value) {
 			this._markupInput = value;
-			this._onDidChange.fire({ markupInput: value });
+			this._markupPreview = !value;
+			this._onDidChange.fire({ markupInput: value, markupPreview: this._markupPreview });
 		}
 	}
 
@@ -39,7 +40,8 @@ export class NotebookFindFilters extends Disposable {
 	set markupPreview(value: boolean) {
 		if (this._markupPreview !== value) {
 			this._markupPreview = value;
-			this._onDidChange.fire({ markupPreview: value });
+			this._markupInput = !value;
+			this._onDidChange.fire({ markupPreview: value, markupInput: this._markupInput });
 		}
 	}
 	private _codeInput: boolean = true;
diff --git a/src/vs/workbench/contrib/notebook/browser/contrib/find/notebookFindReplaceWidget.ts b/src/vs/workbench/contrib/notebook/browser/contrib/find/notebookFindReplaceWidget.ts
@@ -81,7 +81,7 @@ class NotebookFindFilterActionViewItem extends DropdownMenuActionViewItem {
 		const markdownInput: IAction = {
 			checked: this.filters.markupInput,
 			class: undefined,
-			enabled: !this.filters.markupPreview,
+			enabled: true,
 			id: 'findInMarkdownInput',
 			label: NOTEBOOK_FIND_IN_MARKUP_INPUT,
 			run: async () => {
diff --git a/src/vs/workbench/contrib/notebook/browser/view/renderers/backLayerWebView.ts b/src/vs/workbench/contrib/notebook/browser/view/renderers/backLayerWebView.ts
@@ -8,7 +8,6 @@ import { coalesce } from 'vs/base/common/arrays';
 import { DeferredPromise } from 'vs/base/common/async';
 import { decodeBase64 } from 'vs/base/common/buffer';
 import { Emitter, Event } from 'vs/base/common/event';
-import { Disposable } from 'vs/base/common/lifecycle';
 import { getExtensionForMimeType } from 'vs/base/common/mime';
 import { FileAccess, Schemas } from 'vs/base/common/network';
 import { equals } from 'vs/base/common/objects';
@@ -29,6 +28,8 @@ import { IFileDialogService } from 'vs/platform/dialogs/common/dialogs';
 import { IFileService } from 'vs/platform/files/common/files';
 import { IOpenerService, matchesScheme, matchesSomeScheme } from 'vs/platform/opener/common/opener';
 import { IStorageService } from 'vs/platform/storage/common/storage';
+import { editorFindMatch, editorFindMatchHighlight } from 'vs/platform/theme/common/colorRegistry';
+import { IThemeService, Themable } from 'vs/platform/theme/common/themeService';
 import { IWorkspaceContextService } from 'vs/platform/workspace/common/workspace';
 import { IWorkspaceTrustManagementService } from 'vs/platform/workspace/common/workspaceTrust';
 import { asWebviewUri, webviewGenericCspSource } from 'vs/workbench/common/webview';
@@ -98,7 +99,7 @@ interface BacklayerWebviewOptions {
 	readonly outputLineHeight: number;
 }
 
-export class BackLayerWebView<T extends ICommonCellInfo> extends Disposable {
+export class BackLayerWebView<T extends ICommonCellInfo> extends Themable {
 
 	private static _originStore?: WebviewOriginStore;
 
@@ -149,8 +150,9 @@ export class BackLayerWebView<T extends ICommonCellInfo> extends Disposable {
 		@IWorkspaceContextService private readonly workspaceContextService: IWorkspaceContextService,
 		@IEditorGroupsService private readonly editorGroupService: IEditorGroupsService,
 		@IStorageService private readonly storageService: IStorageService,
+		@IThemeService themeService: IThemeService,
 	) {
-		super();
+		super(themeService);
 
 		this.element = document.createElement('div');
 
@@ -247,6 +249,8 @@ export class BackLayerWebView<T extends ICommonCellInfo> extends Disposable {
 			this.nonce);
 
 		const enableCsp = this.configurationService.getValue('notebook.experimental.enableCsp');
+		const findHighlight = this.getColor(editorFindMatch);
+		const currentMatchHighlight = this.getColor(editorFindMatchHighlight);
 		return /* html */`
 		<html lang="en">
 			<head>
@@ -264,11 +268,11 @@ export class BackLayerWebView<T extends ICommonCellInfo> extends Disposable {
 				">` : ''}
 				<style nonce="${this.nonce}">
 					::highlight(find-highlight) {
-						background-color: var(--vscode-editor-findMatchHighlightBackground);
+						background-color: var(--vscode-editor-findMatchBackground, ${findHighlight});
 					}
 
 					::highlight(current-find-highlight) {
-						background-color: var(--vscode-editor-findMatchBackground);
+						background-color: var(--vscode-editor-findMatchHighlightBackground, ${currentMatchHighlight});
 					}
 
 					#container .cell_container {
diff --git a/src/vs/workbench/contrib/webview/browser/pre/index-no-csp.html b/src/vs/workbench/contrib/webview/browser/pre/index-no-csp.html
@@ -164,12 +164,6 @@
 			}
 			::-webkit-scrollbar-thumb:active {
 				background-color: var(--vscode-scrollbarSlider-activeBackground);
-			}
-			::highlight(find-highlight) {
-				background-color: var(--vscode-editor-findMatchHighlightBackground);
-			}
-			::highlight(current-find-highlight) {
-				background-color: var(--vscode-editor-findMatchBackground);
 			}`;
 
 		/**

Original file line number	Diff line number	Diff line change
`@@ -26,7 +26,8 @@ export class NotebookFindFilters extends Disposable {`
`26`	`26`	`set markupInput(value: boolean) {`
`27`	`27`	`if (this._markupInput !== value) {`
`28`	`28`	`this._markupInput = value;`
`29`		`- this._onDidChange.fire({ markupInput: value });`
	`29`	`+ this._markupPreview = !value;`
	`30`	`+ this._onDidChange.fire({ markupInput: value, markupPreview: this._markupPreview });`
`30`	`31`	`}`
`31`	`32`	`}`
`32`	`33`
`@@ -39,7 +40,8 @@ export class NotebookFindFilters extends Disposable {`
`39`	`40`	`set markupPreview(value: boolean) {`
`40`	`41`	`if (this._markupPreview !== value) {`
`41`	`42`	`this._markupPreview = value;`
`42`		`- this._onDidChange.fire({ markupPreview: value });`
	`43`	`+ this._markupInput = !value;`
	`44`	`+ this._onDidChange.fire({ markupPreview: value, markupInput: this._markupInput });`
`43`	`45`	`}`
`44`	`46`	`}`
`45`	`47`	`private _codeInput: boolean = true;`