Reconnect WebSockets when configuration settings change (#705)

WebSockets now automatically reconnect when proxy, TLS, or header
settings change: [coder.headerCommand, coder.insecure, coder.tlsCertFile,
coder.tlsKeyFile, coder.tlsCaFile, coder.tlsAltHost, http.proxy, coder.proxyBypass]

Closes #691

Author: EhabY

src/api/coderApi.ts

@@ -16,6 +16,7 @@ import {
 import * as vscode from "vscode";
 import { type ClientOptions } from "ws";
 
+import { watchConfigurationChanges } from "../configWatcher";
 import { CertificateError } from "../error";
 import { getHeaderCommand, getHeaders } from "../headers";
 import { EventStreamLogger } from "../logging/eventStreamLogger";
@@ -51,6 +52,21 @@ import { createHttpAgent } from "./utils";
 
 const coderSessionTokenHeader = "Coder-Session-Token";
 
+/**
+ * Configuration settings that affect WebSocket connections.
+ * Changes to these settings will trigger WebSocket reconnection.
+ */
+const webSocketConfigSettings = [
+	"coder.headerCommand",
+	"coder.insecure",
+	"coder.tlsCertFile",
+	"coder.tlsKeyFile",
+	"coder.tlsCaFile",
+	"coder.tlsAltHost",
+	"http.proxy",
+	"coder.proxyBypass",
+] as const;
+
 /**
  * Unified API class that includes both REST API methods from the base Api class
  * and WebSocket methods for real-time functionality.
@@ -59,9 +75,11 @@ export class CoderApi extends Api implements vscode.Disposable {
 	private readonly reconnectingSockets = new Set<
 		ReconnectingWebSocket<never>
 	>();
+	private readonly configWatcher: vscode.Disposable;
 
 	private constructor(private readonly output: Logger) {
 		super();
+		this.configWatcher = this.watchConfigChanges();
 	}
 
 	/**
@@ -133,12 +151,34 @@ export class CoderApi extends Api implements vscode.Disposable {
 	 * This clears handlers and prevents reconnection.
 	 */
 	dispose(): void {
+		this.configWatcher.dispose();
 		for (const socket of this.reconnectingSockets) {
 			socket.close();
 		}
 		this.reconnectingSockets.clear();
 	}
 
+	/**
+	 * Watch for configuration changes that affect WebSocket connections.
+	 * When any watched setting changes, all active WebSockets are reconnected.
+	 */
+	private watchConfigChanges(): vscode.Disposable {
+		const settings = webSocketConfigSettings.map((setting) => ({
+			setting,
+			getValue: () => vscode.workspace.getConfiguration().get(setting),
+		}));
+		return watchConfigurationChanges(settings, () => {
+			if (this.reconnectingSockets.size > 0) {
+				this.output.info(
+					`Configuration changed, reconnecting ${this.reconnectingSockets.size} WebSocket(s)`,
+				);
+				for (const socket of this.reconnectingSockets) {
+					socket.reconnect();
+				}
+			}
+		});
+	}
+
 	watchInboxNotifications = async (
 		watchTemplates: string[],
 		watchTargets: string[],

src/configWatcher.ts

@@ -0,0 +1,39 @@
+import { isDeepStrictEqual } from "node:util";
+import * as vscode from "vscode";
+
+export interface WatchedSetting {
+	setting: string;
+	getValue: () => unknown;
+}
+
+/**
+ * Watch for configuration changes and invoke a callback when values change.
+ * Only fires when actual values change, not just when settings are touched.
+ */
+export function watchConfigurationChanges(
+	settings: WatchedSetting[],
+	onChange: (changedSettings: string[]) => void,
+): vscode.Disposable {
+	const appliedValues = new Map(settings.map((s) => [s.setting, s.getValue()]));
+
+	return vscode.workspace.onDidChangeConfiguration((e) => {
+		const changedSettings: string[] = [];
+
+		for (const { setting, getValue } of settings) {
+			if (!e.affectsConfiguration(setting)) {
+				continue;
+			}
+
+			const newValue = getValue();
+
+			if (!isDeepStrictEqual(newValue, appliedValues.get(setting))) {
+				changedSettings.push(setting);
+				appliedValues.set(setting, newValue);
+			}
+		}
+
+		if (changedSettings.length > 0) {
+			onChange(changedSettings);
+		}
+	});
+}

src/remote/remote.ts

@@ -8,7 +8,6 @@ import * as jsonc from "jsonc-parser";
 import * as fs from "node:fs/promises";
 import * as os from "node:os";
 import * as path from "node:path";
-import { isDeepStrictEqual } from "node:util";
 import * as semver from "semver";
 import * as vscode from "vscode";
 
@@ -23,6 +22,7 @@ import { CoderApi } from "../api/coderApi";
 import { needToken } from "../api/utils";
 import { getGlobalFlags, getGlobalFlagsRaw, getSshFlags } from "../cliConfig";
 import { type Commands } from "../commands";
+import { watchConfigurationChanges } from "../configWatcher";
 import { type CliManager } from "../core/cliManager";
 import * as cliUtils from "../core/cliUtils";
 import { type ServiceContainer } from "../core/container";
@@ -854,29 +854,10 @@ export class Remote {
 			getValue: () => unknown;
 		}>,
 	): vscode.Disposable {
-		// Capture applied values at setup time
-		const appliedValues = new Map(
-			settings.map((s) => [s.setting, s.getValue()]),
-		);
-
-		return vscode.workspace.onDidChangeConfiguration((e) => {
-			const changedTitles: string[] = [];
-
-			for (const { setting, title, getValue } of settings) {
-				if (!e.affectsConfiguration(setting)) {
-					continue;
-				}
-
-				const newValue = getValue();
+		const titleMap = new Map(settings.map((s) => [s.setting, s.title]));
 
-				if (!isDeepStrictEqual(newValue, appliedValues.get(setting))) {
-					changedTitles.push(title);
-				}
-			}
-
-			if (changedTitles.length === 0) {
-				return;
-			}
+		return watchConfigurationChanges(settings, (changedSettings) => {
+			const changedTitles = changedSettings.map((s) => titleMap.get(s)!);
 
 			const message =
 				changedTitles.length === 1

test/mocks/testHelpers.ts

@@ -20,9 +20,11 @@ export class MockConfigurationProvider {
 
 	/**
 	 * Set a configuration value that will be returned by vscode.workspace.getConfiguration().get()
+	 * Automatically fires onDidChangeConfiguration event (emulating VS Code behavior).
 	 */
 	set(key: string, value: unknown): void {
 		this.config.set(key, value);
+		this.fireConfigChangeEvent(key);
 	}
 
 	/**
@@ -42,6 +44,23 @@ export class MockConfigurationProvider {
 		this.config.clear();
 	}
 
+	/**
+	 * Fire configuration change event for a specific setting.
+	 */
+	private fireConfigChangeEvent(setting: string): void {
+		const fireEvent = (
+			vscode.workspace as typeof vscode.workspace & {
+				__fireDidChangeConfiguration: (
+					e: vscode.ConfigurationChangeEvent,
+				) => void;
+			}
+		).__fireDidChangeConfiguration;
+
+		fireEvent({
+			affectsConfiguration: (section: string) => section === setting,
+		});
+	}
+
 	/**
 	 * Setup the vscode.workspace.getConfiguration mock to return our values
 	 */
@@ -63,7 +82,7 @@ export class MockConfigurationProvider {
 					}),
 					inspect: vi.fn(),
 					update: vi.fn((key: string, value: unknown) => {
-						this.config.set(getFullKey(key), value);
+						this.set(getFullKey(key), value);
 						return Promise.resolve();
 					}),
 				};

test/mocks/vscode.runtime.ts

@@ -120,8 +120,10 @@ export const workspace = {
 	onDidChangeWorkspaceFolders: onDidChangeWorkspaceFolders.event,
 
 	// test-only triggers:
-	__fireDidChangeConfiguration: onDidChangeConfiguration.fire,
-	__fireDidChangeWorkspaceFolders: onDidChangeWorkspaceFolders.fire,
+	__fireDidChangeConfiguration: (e: unknown) =>
+		onDidChangeConfiguration.fire(e),
+	__fireDidChangeWorkspaceFolders: (e: unknown) =>
+		onDidChangeWorkspaceFolders.fire(e),
 };
 
 export const env = {

test/unit/api/coderApi.test.ts

@@ -87,6 +87,11 @@ describe("CoderApi", () => {
 		mockConfig.set("coder.httpClientLogLevel", "BASIC");
 	});
 
+	afterEach(() => {
+		// Dispose any api created during the test to clean up config watchers
+		api?.dispose();
+	});
+
 	describe("HTTP Interceptors", () => {
 		it("adds custom headers and HTTP agent to requests", async () => {
 			const mockAgent = new ProxyAgent();
@@ -429,24 +434,24 @@ describe("CoderApi", () => {
 		});
 	});
 
-	describe("Reconnection on Host/Token Changes", () => {
-		const setupAutoOpeningWebSocket = () => {
-			const sockets: Array<Partial<Ws>> = [];
-			vi.mocked(Ws).mockImplementation((url: string | URL) => {
-				const mockWs = createMockWebSocket(String(url), {
-					on: vi.fn((event, handler) => {
-						if (event === "open") {
-							setImmediate(() => handler());
-						}
-						return mockWs as Ws;
-					}),
-				});
-				sockets.push(mockWs);
-				return mockWs as Ws;
+	const setupAutoOpeningWebSocket = () => {
+		const sockets: Array<Partial<Ws>> = [];
+		vi.mocked(Ws).mockImplementation((url: string | URL) => {
+			const mockWs = createMockWebSocket(String(url), {
+				on: vi.fn((event, handler) => {
+					if (event === "open") {
+						setImmediate(() => handler());
+					}
+					return mockWs as Ws;
+				}),
 			});
-			return sockets;
-		};
+			sockets.push(mockWs);
+			return mockWs as Ws;
+		});
+		return sockets;
+	};
 
+	describe("Reconnection on Host/Token Changes", () => {
 		it("triggers reconnection when session token changes", async () => {
 			const sockets = setupAutoOpeningWebSocket();
 			api = createApi(CODER_URL, AXIOS_TOKEN);
@@ -593,6 +598,55 @@ describe("CoderApi", () => {
 			expect(sockets[0].close).toHaveBeenCalled();
 		});
 	});
+
+	describe("Configuration Change Reconnection", () => {
+		const tick = () => new Promise((resolve) => setImmediate(resolve));
+
+		it("reconnects sockets when watched config value changes", async () => {
+			mockConfig.set("coder.insecure", false);
+			const sockets = setupAutoOpeningWebSocket();
+			api = createApi(CODER_URL, AXIOS_TOKEN);
+			await api.watchAgentMetadata(AGENT_ID);
+
+			mockConfig.set("coder.insecure", true);
+			await tick();
+
+			expect(sockets[0].close).toHaveBeenCalledWith(
+				1000,
+				"Replacing connection",
+			);
+			expect(sockets).toHaveLength(2);
+		});
+
+		it.each([
+			["unchanged value", "coder.insecure", false],
+			["unrelated setting", "unrelated.setting", "new-value"],
+		])("does not reconnect for %s", async (_desc, key, value) => {
+			mockConfig.set("coder.insecure", false);
+			const sockets = setupAutoOpeningWebSocket();
+			api = createApi(CODER_URL, AXIOS_TOKEN);
+			await api.watchAgentMetadata(AGENT_ID);
+
+			mockConfig.set(key, value);
+			await tick();
+
+			expect(sockets[0].close).not.toHaveBeenCalled();
+			expect(sockets).toHaveLength(1);
+		});
+
+		it("stops watching after dispose", async () => {
+			mockConfig.set("coder.insecure", false);
+			const sockets = setupAutoOpeningWebSocket();
+			api = createApi(CODER_URL, AXIOS_TOKEN);
+			await api.watchAgentMetadata(AGENT_ID);
+
+			api.dispose();
+			mockConfig.set("coder.insecure", true);
+			await tick();
+
+			expect(sockets).toHaveLength(1);
+		});
+	});
 });
 
 const mockAdapterImpl = vi.hoisted(() => (config: Record<string, unknown>) => {