Skip to content

fix(desktop): pin preview CDP debugger across webview teardown #223

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
leoisadev1 merged 2 commits into from
Sep 14, 2026
Merged

fix(desktop): pin preview CDP debugger across webview teardown #223

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8b8ac95
fix(desktop): pin preview CDP debugger across webview teardown
leoisadev1 Sep 10, 2026
508699f
Merge remote-tracking branch 'origin/main' into prg/223
leoisadev1 Sep 13, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
61 changes: 61 additions & 0 deletions apps/desktop/src/preview/Manager.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -580,6 +580,67 @@ describe("PreviewManager", () => {
),
);

effectIt.effect("detaches through the pinned debugger after the webview is destroyed", () =>
withManager((manager) =>
Effect.gen(function* () {
// Real Electron throws on any `wc.debugger` access once the
// WebContents is destroyed, so cleanup must go through the debugger
// reference captured at attach time (electron/electron#53376).
let destroyed = false;
let attached = false;
const debuggerOff = vi.fn();
const debuggerDetach = vi.fn(() => {
attached = false;
});
const wcDebugger = {
isAttached: () => attached,
attach: vi.fn(() => {
attached = true;
}),
detach: debuggerDetach,
sendCommand: vi.fn(async () => undefined),
on: vi.fn(),
off: debuggerOff,
};
fromId.mockReturnValue({
id: 42,
isDestroyed: () => destroyed,
getType: () => "webview",
getURL: () => "http://localhost:3200/",
getTitle: () => "Preview",
isLoading: () => false,
isDevToolsOpened: () => false,
getZoomFactor: () => 1,
setZoomFactor: vi.fn(),
setAudioMuted: vi.fn(),
isCurrentlyAudible: () => false,
reload: vi.fn(),
loadURL: vi.fn(async () => undefined),
on: vi.fn(),
off: vi.fn(),
ipc: { on: vi.fn(), off: vi.fn() },
send: webviewSend,
navigationHistory: { canGoBack: () => false, canGoForward: () => false },
setWindowOpenHandler: vi.fn(),
get debugger() {
if (destroyed) throw new Error("Object has been destroyed");
return wcDebugger;
},
} as never);
yield* manager.createTab("tab_pinned_debugger");
yield* manager.registerWebview("tab_pinned_debugger", 42);
yield* manager.setColorScheme("tab_pinned_debugger", "dark");
expect(attached).toBe(true);
destroyed = true;

yield* manager.navigate("tab_pinned_debugger", "https://example.com/");

expect(debuggerOff).toHaveBeenCalledWith("message", expect.any(Function));
expect(debuggerDetach).toHaveBeenCalledOnce();
}),
),
);

effectIt.effect("does not let destroyed-webview cleanup detach a same-id replacement", () =>
withManager((manager) =>
Effect.gen(function* () {
Expand Down
32 changes: 20 additions & 12 deletions apps/desktop/src/preview/Manager.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@
import { normalizePreviewUrl } from "@t3tools/shared/preview";
import {
BrowserWindow,
type NativeImage,

Check warning on line 36 in apps/desktop/src/preview/Manager.ts

View workflow job for this annotation

GitHub Actions / Repository checks

eslint(no-unused-vars) 

Type 'NativeImage' is imported but never used.
type Rectangle,
type Session,
clipboard,
Expand Down Expand Up @@ -442,6 +442,12 @@

interface BrowserControlSession {
readonly webContentsId: number;
// Pins the WebContents' Debugger wrapper for the session's lifetime.
// Electron's Debugger is GC-managed but registered with Chromium as a raw
// DevToolsAgentHostClient pointer; collecting it while attached crashes the
// browser process (electron/electron#53376). Detach must also go through
// this reference: `wc.debugger` throws once the WebContents is destroyed.
readonly debugger: Electron.Debugger;
readonly semaphore: Semaphore.Semaphore;
readonly scope: Scope.Closeable;
readonly onMessage: (
Expand Down Expand Up @@ -1065,6 +1071,7 @@
const createControlSession = Effect.fn("PreviewManager.createControlSession")(function* () {
const semaphore = yield* Semaphore.make(1);
const scope = yield* Scope.fork(parentScope, "sequential");
const wcDebugger = wc.debugger;
const handleDebuggerMessage = Effect.fnUntraced(function* (
method: string,
params: Record<string, unknown>,
Expand All @@ -1077,7 +1084,7 @@
operation: "ackScreencastFrame",
webContentsId: wc.id,
},
() => wc.debugger.sendCommand("Page.screencastFrameAck", { sessionId }),
() => wcDebugger.sendCommand("Page.screencastFrameAck", { sessionId }),
).pipe(Effect.ignore);
}
const tabId = yield* tabIdForWebContents(wc.id);
Expand Down Expand Up @@ -1125,15 +1132,16 @@
}),
),
attempt({ operation: "detachControlSession", webContentsId: wc.id }, () => {
wc.debugger.off("message", onMessage);
if (wc.debugger.isAttached()) wc.debugger.detach();
wcDebugger.off("message", onMessage);
if (wcDebugger.isAttached()) wcDebugger.detach();
}).pipe(Effect.ignore),
],
{ discard: true },
),
);
const control: BrowserControlSession = {
webContentsId: wc.id,
debugger: wcDebugger,
semaphore,
scope,
onMessage,
Expand All @@ -1149,15 +1157,15 @@
}),
);
yield* attempt({ operation: "attachDebuggerListeners", webContentsId: wc.id }, () => {
wc.debugger.on("message", onMessage);
wc.debugger.attach("1.3");
wcDebugger.on("message", onMessage);
wcDebugger.attach("1.3");
});
yield* Effect.all(
["Runtime.enable", "Accessibility.enable", "Network.enable", "Log.enable"].map(
(method) =>
attemptPromise(
{ operation: `initializeDebugger.${method}`, webContentsId: wc.id },
() => wc.debugger.sendCommand(method),
() => wcDebugger.sendCommand(method),
),
),
{ concurrency: "unbounded", discard: true },
Expand Down Expand Up @@ -1246,7 +1254,7 @@
}
const result = yield* attemptPromise(
{ operation: `${action}.${method}`, tabId, webContentsId: wc.id },
() => wc.debugger.sendCommand(method, commandParams),
() => control.debugger.sendCommand(method, commandParams),
);
const after = (yield* Ref.get(controlEpochRef)).get(tabId) ?? 0;
if (after !== epoch) {
Expand All @@ -1270,7 +1278,7 @@
tabId,
webContentsId: wc.id,
},
() => wc.debugger.sendCommand(method, commandParams),
() => control.debugger.sendCommand(method, commandParams),
);
},
);
Expand Down Expand Up @@ -2399,9 +2407,9 @@
wc: Electron.WebContents,
colorScheme: DesktopPreviewColorScheme,
) {
yield* ensureControlSession(wc);
const control = yield* ensureControlSession(wc);
yield* attemptPromise({ operation: "applyColorScheme", tabId, webContentsId: wc.id }, () =>
wc.debugger.sendCommand("Emulation.setEmulatedMedia", {
control.debugger.sendCommand("Emulation.setEmulatedMedia", {
features: [
{
name: "prefers-color-scheme",
Expand All @@ -2421,15 +2429,15 @@
Effect.gen(function* () {
const beforeAttach = (yield* SynchronizedRef.get(tabsRef)).get(tabId);
if (beforeAttach?.webContentsId !== wc.id) return;
yield* ensureControlSession(wc);
const control = yield* ensureControlSession(wc);
const afterAttach = (yield* SynchronizedRef.get(tabsRef)).get(tabId);
if (afterAttach?.webContentsId !== wc.id) {
yield* detachControlSession(wc.id);
return;
}
if (afterAttach.colorScheme !== "system") {
yield* attemptPromise({ operation: "applyColorScheme", tabId, webContentsId: wc.id }, () =>
wc.debugger.sendCommand("Emulation.setEmulatedMedia", {
control.debugger.sendCommand("Emulation.setEmulatedMedia", {
features: [
{
name: "prefers-color-scheme",
Expand Down
Loading