Make sure we also change webview theme data when editor config changes

src/vs/workbench/contrib/webview/browser/webviewElement.ts

@@ -12,7 +12,6 @@ import { IConfigurationService } from 'vs/platform/configuration/common/configur
 import { ExtensionIdentifier } from 'vs/platform/extensions/common/extensions';
 import { IFileService } from 'vs/platform/files/common/files';
 import { ITunnelService } from 'vs/platform/remote/common/tunnel';
-import { IThemeService } from 'vs/platform/theme/common/themeService';
 import { Webview, WebviewContentOptions, WebviewOptions } from 'vs/workbench/contrib/webview/browser/webview';
 import { areWebviewInputOptionsEqual } from 'vs/workbench/contrib/webview/browser/webviewEditorService';
 import { WebviewPortMappingManager } from 'vs/workbench/contrib/webview/common/portMapping';
@@ -46,7 +45,6 @@ export class IFrameWebview extends Disposable implements Webview {
 		options: WebviewOptions,
 		contentOptions: WebviewContentOptions,
 		private readonly webviewThemeDataProvider: WebviewThemeDataProvider,
-		@IThemeService themeService: IThemeService,
 		@ITunnelService tunnelService: ITunnelService,
 		@IWorkbenchEnvironmentService private readonly environmentService: IWorkbenchEnvironmentService,
 		@IFileService private readonly fileService: IFileService,
@@ -148,7 +146,7 @@ export class IFrameWebview extends Disposable implements Webview {
 		});
 
 		this.style();
-		this._register(themeService.onThemeChange(this.style, this));
+		this._register(webviewThemeDataProvider.onThemeDataChanged(this.style, this));
 	}
 
 	private get externalEndpoint(): string {

src/vs/workbench/contrib/webview/common/themeing.ts

@@ -9,6 +9,7 @@ import { EDITOR_FONT_DEFAULTS, IEditorOptions } from 'vs/editor/common/config/ed
 import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
 import * as colorRegistry from 'vs/platform/theme/common/colorRegistry';
 import { DARK, ITheme, IThemeService, LIGHT } from 'vs/platform/theme/common/themeService';
+import { Emitter } from 'vs/base/common/event';
 
 interface WebviewThemeData {
 	readonly activeTheme: string;
@@ -17,14 +18,32 @@ interface WebviewThemeData {
 
 export class WebviewThemeDataProvider extends Disposable {
 
+
 	private static readonly MEMOIZER = createMemoizer();
 
+	private readonly _onThemeDataChanged = this._register(new Emitter<void>());
+	public readonly onThemeDataChanged = this._onThemeDataChanged.event;
+
 	constructor(
 		@IThemeService private readonly _themeService: IThemeService,
 		@IConfigurationService private readonly _configurationService: IConfigurationService,
 	) {
 		super();
-		this._register(_themeService.onThemeChange(() => WebviewThemeDataProvider.MEMOIZER.clear()));
+
+		this._register(this._themeService.onThemeChange(() => {
+			this.reset();
+		}));
+
+		const webviewConfigurationKeys = ['editor.fontFamily', 'editor.fontWeight', 'editor.fontSize'];
+		this._register(this._configurationService.onDidChangeConfiguration(e => {
+			if (webviewConfigurationKeys.some(key => e.affectsConfiguration(key))) {
+				this.reset();
+			}
+		}));
+	}
+
+	public getTheme(): ITheme {
+		return this._themeService.getTheme();
 	}
 
 	@WebviewThemeDataProvider.MEMOIZER
@@ -56,6 +75,11 @@ export class WebviewThemeDataProvider extends Disposable {
 		const activeTheme = ApiThemeClassName.fromTheme(theme);
 		return { styles, activeTheme };
 	}
+
+	private reset() {
+		WebviewThemeDataProvider.MEMOIZER.clear();
+		this._onThemeDataChanged.fire();
+	}
 }
 
 enum ApiThemeClassName {

src/vs/workbench/contrib/webview/electron-browser/webviewElement.ts

@@ -17,7 +17,7 @@ import { IFileService } from 'vs/platform/files/common/files';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import { ITunnelService } from 'vs/platform/remote/common/tunnel';
 import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
-import { ITheme, IThemeService } from 'vs/platform/theme/common/themeService';
+import { IThemeService } from 'vs/platform/theme/common/themeService';
 import { Webview, WebviewContentOptions, WebviewOptions } from 'vs/workbench/contrib/webview/browser/webview';
 import { WebviewPortMappingManager } from 'vs/workbench/contrib/webview/common/portMapping';
 import { WebviewResourceScheme } from 'vs/workbench/contrib/webview/common/resourceLoader';
@@ -396,8 +396,8 @@ export class ElectronWebviewBasedWebview extends Disposable implements Webview,
 			}));
 		}
 
-		this.style(themeService.getTheme());
-		this._register(themeService.onThemeChange(this.style, this));
+		this.style();
+		this._register(webviewThemeDataProvider.onThemeDataChanged(this.style, this));
 	}
 
 	public mountTo(parent: HTMLElement) {
@@ -557,12 +557,12 @@ export class ElectronWebviewBasedWebview extends Disposable implements Webview,
 		this._send('message', data);
 	}
 
-	private style(theme: ITheme): void {
+	private style(): void {
 		const { styles, activeTheme } = this.webviewThemeDataProvider.getWebviewThemeData();
 		this._send('styles', { styles, activeTheme });
 
 		if (this._webviewFindWidget) {
-			this._webviewFindWidget.updateTheme(theme);
+			this._webviewFindWidget.updateTheme(this.webviewThemeDataProvider.getTheme());
 		}
 	}