{(registration) => (
)}
diff --git a/packages/app/src/session/helpers.test.ts b/packages/app/src/session/helpers.test.ts
index 895fa032483..cb97bdc2660 100644
--- a/packages/app/src/session/helpers.test.ts
+++ b/packages/app/src/session/helpers.test.ts
@@ -3,6 +3,7 @@ import { createMemo, createRoot } from "solid-js"
import { createStore } from "solid-js/store"
import {
SESSION_BROWSER_TAB,
+ sessionBrowserTab,
SESSION_OPEN_FILE_TAB,
createOpenReviewFile,
createOpenSessionFileTab,
@@ -252,4 +253,22 @@ describe("createSessionTabs", () => {
dispose()
})
})
+
+ test("keeps multiple browser tabs distinct from file tabs", () => {
+ createRoot((dispose) => {
+ const first = sessionBrowserTab("first")
+ const second = sessionBrowserTab("second")
+ const result = createSessionTabs({
+ tabs: () => ({ active: () => second, all: () => [first, "file://src/a.ts", second] }),
+ pathFromTab: (tab) => (tab.startsWith("file://") ? tab.slice(7) : undefined),
+ normalizeTab: (tab) => tab,
+ browser: () => true,
+ })
+ expect(result.panelTabs()).toEqual(["file://src/a.ts"])
+ expect(result.activeTab()).toBe(second)
+ expect(result.activeFileTab()).toBeUndefined()
+ expect(result.closableTab()).toBe(second)
+ dispose()
+ })
+ })
})
diff --git a/packages/app/src/session/helpers.ts b/packages/app/src/session/helpers.ts
index 8185409746e..fbcaebfda35 100644
--- a/packages/app/src/session/helpers.ts
+++ b/packages/app/src/session/helpers.ts
@@ -2,9 +2,14 @@ import { batch, createMemo, onCleanup, onMount, type Accessor } from "solid-js"
import { createStore } from "solid-js/store"
import { makeEventListener } from "@solid-primitives/event-listener"
import { same } from "@/runtime/persistence/equality"
-import { SESSION_BROWSER_TAB, SESSION_OPEN_FILE_TAB } from "@/shell/state/session-tabs"
+import { isSessionBrowserTab, SESSION_OPEN_FILE_TAB } from "@/shell/state/session-tabs"
-export { SESSION_BROWSER_TAB, SESSION_OPEN_FILE_TAB } from "@/shell/state/session-tabs"
+export {
+ SESSION_BROWSER_TAB,
+ SESSION_OPEN_FILE_TAB,
+ sessionBrowserTab,
+ isSessionBrowserTab,
+} from "@/shell/state/session-tabs"
const emptyTabs: string[] = []
@@ -45,7 +50,7 @@ export const createSessionTabs = (input: TabsInput) => {
.tabs()
.all()
.flatMap((tab) => {
- if (tab === "context" || tab === "review" || tab === SESSION_BROWSER_TAB) return []
+ if (tab === "context" || tab === "review" || isSessionBrowserTab(tab)) return []
if (tab === SESSION_OPEN_FILE_TAB && !fileBrowser()) return []
const value = input.pathFromTab(tab) ? input.normalizeTab(tab) : tab
if (seen.has(value)) return []
@@ -63,7 +68,7 @@ export const createSessionTabs = (input: TabsInput) => {
const active = input.tabs().active()
if (active === "context") return active
if (active === SESSION_OPEN_FILE_TAB && openFileOpen()) return active
- if (active === SESSION_BROWSER_TAB && browser()) return active
+ if (active && isSessionBrowserTab(active) && browser()) return active
if (active === "review" && review()) return active
if (active && input.pathFromTab(active)) return input.normalizeTab(active)
@@ -82,7 +87,7 @@ export const createSessionTabs = (input: TabsInput) => {
const active = activeTab()
if (active === "context") return active
if (active === SESSION_OPEN_FILE_TAB && openFileOpen()) return active
- if (active === SESSION_BROWSER_TAB && browser()) return active
+ if (active && isSessionBrowserTab(active) && browser()) return active
if (!openedTabs().includes(active)) return
return active
})
diff --git a/packages/app/src/shell/state/session-tabs.ts b/packages/app/src/shell/state/session-tabs.ts
index d8de77d84bc..1f3f0ad5b0f 100644
--- a/packages/app/src/shell/state/session-tabs.ts
+++ b/packages/app/src/shell/state/session-tabs.ts
@@ -1,5 +1,8 @@
export const SESSION_OPEN_FILE_TAB = "open-file"
export const SESSION_BROWSER_TAB = "browser"
+export const sessionBrowserTab = (tabID: string) => `${SESSION_BROWSER_TAB}:${tabID}`
+export const isSessionBrowserTab = (tab: string | undefined) =>
+ !!tab && (tab === SESSION_BROWSER_TAB || tab.startsWith(`${SESSION_BROWSER_TAB}:`))
export type SessionTabs = {
active?: string
diff --git a/packages/desktop/package.json b/packages/desktop/package.json
index f0937cb629c..cb50ac74326 100644
--- a/packages/desktop/package.json
+++ b/packages/desktop/package.json
@@ -28,7 +28,9 @@
"electron-log": "^5",
"electron-store": "11.0.2",
"electron-updater": "6.8.9",
- "electron-window-state": "^5.0.3"
+ "electron-window-state": "^5.0.3",
+ "lighthouse": "13.4.1",
+ "puppeteer-core": "25.9.0"
},
"devDependencies": {
"@brendonovich/vite-plugin-opencode": "0.1.3",
@@ -47,6 +49,7 @@
"@types/node": "catalog:",
"@typescript/native-preview": "catalog:",
"app-builder-lib": "26.15.7",
+ "devtools-protocol": "0.0.1687809",
"drizzle-orm": "catalog:",
"effect": "catalog:",
"electron": "42.10.1",
diff --git a/packages/desktop/src/main/browser-chromium.ts b/packages/desktop/src/main/browser-chromium.ts
index 8bf916ad229..35bf26ff26c 100644
--- a/packages/desktop/src/main/browser-chromium.ts
+++ b/packages/desktop/src/main/browser-chromium.ts
@@ -1,282 +1,777 @@
-import type { Browser } from "@opencode-ai/schema/browser"
-import electron, { type BrowserWindow } from "electron"
-
-type AXNode = {
- nodeId: string
- backendDOMNodeId?: number
- childIds?: string[]
- ignored?: boolean
- role?: { value?: string }
- name?: { value?: unknown }
- properties?: Array<{ name: string; value?: { value?: unknown } }>
-}
+import { Browser } from "@opencode-ai/schema/browser"
+import electron, { type BrowserWindow, type WebContents } from "electron"
+import type { Protocol } from "devtools-protocol"
+import { Schema } from "effect"
+import { createCdp, abortError, waitFor } from "./browser/cdp"
+import { createBrowserFiles } from "./browser/files"
+import { createDiagnostics } from "./browser/diagnostics"
+import { createProfiling } from "./browser/profiling"
+type Element = { backendID: number; frameID: string; sessionID?: string }
+let nextRef = 0
+// Captures and downloads belong to the tab, not whichever document it now shows.
+const retainedOperations = new Set
([
+ "files.list",
+ "files.get",
+ "trace.stop",
+ "trace.analyze",
+ "cpu.stop",
+ "cpu.analyze",
+ "heap.summary",
+ "heap.query",
+ "heap.object",
+ "heap.compare",
+])
export type BrowserPage = ReturnType
-export function createBrowserPage(win: BrowserWindow, publish: (error?: string) => void, fail: () => void) {
+export function createBrowserPage(
+ win: BrowserWindow,
+ options: {
+ id: Browser.TabID
+ partition: string
+ publish: (error?: string) => void
+ fail: () => void
+ popup: (options: Electron.BrowserWindowConstructorOptions) => WebContents
+ initialize?: boolean
+ popupOptions?: Electron.BrowserWindowConstructorOptions
+ },
+) {
const view = new electron.WebContentsView({
+ ...options.popupOptions,
webPreferences: {
- partition: `opencode-browser-${crypto.randomUUID()}`,
+ partition: options.partition,
nodeIntegration: false,
contextIsolation: true,
sandbox: true,
webSecurity: true,
webviewTag: false,
devTools: false,
- disableDialogs: true,
+ backgroundThrottling: false,
},
})
const contents = view.webContents
- const refs = new Map()
+ const cdp = createCdp(contents)
+ const files = createBrowserFiles()
+ const diagnostics = createDiagnostics(cdp)
+ const profiling = createProfiling(contents, cdp, files)
+ const refs = new Map()
+ const sessions = new Map()
+ const parents = new Map()
+ const contexts = new Map()
+ const dialogs = new Set<() => void>()
+ let dialog: { type: string; message: string; defaultValue: string } | null = null
let generation = 0
- let nextRef = 0
let closed = false
- const state = (): Browser.State => ({
+ const state = (): Browser.Tab => ({
+ id: options.id,
url: contents.getURL().slice(0, 16_384),
- title: contents.getTitle().slice(0, 1_024),
+ title: contents.getTitle().slice(0, 2_048),
loading: contents.isLoading(),
canGoBack: contents.navigationHistory.canGoBack(),
canGoForward: contents.navigationHistory.canGoForward(),
generation,
})
- const update = () => {
- if (!closed) publish()
+ const publish = () => {
+ if (!closed) options.publish()
}
- contents.on("before-input-event", (event, input) => {
- if (input.type !== "keyDown" || input.alt || !(process.platform === "darwin" ? input.meta : input.control)) return
- const step =
- input.key === "=" || input.key === "+" || input.code === "NumpadAdd"
- ? 0.5
- : input.key === "-" || input.code === "NumpadSubtract"
- ? -0.5
- : 0
- if (!step && input.key !== "0") return
- event.preventDefault()
- contents.setZoomLevel(input.key === "0" ? 0 : contents.getZoomLevel() + step)
+ const reset = (event: Electron.Event<{ isMainFrame: boolean; isSameDocument: boolean }>) => {
+ if (!event.isMainFrame || event.isSameDocument) return
+ generation++
+ refs.clear()
+ diagnostics.clear()
+ publish()
+ }
+ contents.on("did-start-navigation", reset)
+ contents.on("did-stop-loading", publish)
+ contents.on("did-navigate-in-page", publish)
+ contents.on("page-title-updated", publish)
+ contents.on("render-process-gone", () => {
+ if (!closed) options.fail()
})
- const session = contents.session
- session.setPermissionRequestHandler((_contents, _permission, callback) => callback(false))
- session.setPermissionCheckHandler(() => false)
- session.setDevicePermissionHandler(() => false)
- session.setDisplayMediaRequestHandler((_request, callback) => callback({}))
- session.on("will-download", (event) => event.preventDefault())
- contents.setWindowOpenHandler(() => ({ action: "deny" }))
+ contents.debugger.on("detach", () => {
+ if (!closed) options.fail()
+ })
+ contents.session.setPermissionRequestHandler((_contents, _permission, callback) => callback(false))
+ contents.session.setPermissionCheckHandler(() => false)
+ contents.session.setDevicePermissionHandler(() => false)
+ contents.session.setDisplayMediaRequestHandler((_request, callback) => callback({}))
contents.on("content-bounds-updated", (event) => event.preventDefault())
const guard = (event: Electron.Event<{ url: string }>) => {
if (event.url === "about:blank" || destinationOrigin(event.url)) return
event.preventDefault()
- publish("ERR_BLOCKED_BY_CLIENT")
+ options.publish("ERR_BLOCKED_BY_CLIENT")
}
contents.on("will-frame-navigate", guard)
contents.on("will-redirect", guard)
- contents.on("did-stop-loading", update)
- contents.on("did-navigate-in-page", update)
- contents.on("page-title-updated", update)
- contents.on("did-start-navigation", (event) => {
- if (!event.isMainFrame) return
- generation++
- refs.clear()
- update()
+ contents.setWindowOpenHandler(({ url }) =>
+ url === "about:blank" || destinationOrigin(url)
+ ? {
+ action: "allow",
+ outlivesOpener: true,
+ overrideBrowserWindowOptions: {
+ webPreferences: {
+ nodeIntegration: false,
+ contextIsolation: true,
+ sandbox: true,
+ webSecurity: true,
+ webviewTag: false,
+ devTools: false,
+ partition: options.partition,
+ },
+ },
+ createWindow: (popupOptions) => options.popup(popupOptions),
+ }
+ : { action: "deny" },
+ )
+ const download = (_event: Electron.Event, item: Electron.DownloadItem, source: WebContents) => {
+ if (source !== contents) return
+ try {
+ const file = files.add(item.getFilename(), item.getMimeType() || "application/octet-stream")
+ item.setSavePath(file.path)
+ item.on("updated", () => {
+ file.bytes = item.getReceivedBytes()
+ if (file.bytes > Browser.MAX_FILE_BYTES) item.cancel()
+ })
+ item.once("done", (_event, status) => {
+ file.bytes = item.getReceivedBytes()
+ file.state = status === "completed" ? "completed" : "failed"
+ })
+ } catch {
+ item.cancel()
+ options.publish("download_failed")
+ }
+ }
+ contents.session.on("will-download", download)
+ cdp.on("Runtime.executionContextCreated", ({ context }, sessionID) => {
+ const aux = context.auxData as { frameId?: string; isDefault?: boolean } | undefined
+ if (aux?.frameId && aux.isDefault) contexts.set(aux.frameId, { id: context.id, sessionID })
})
- contents.on("did-fail-load", (_event, code, error, _url, mainFrame) => {
- if (!closed && mainFrame && code !== -3) publish(error)
+ cdp.on("Runtime.executionContextDestroyed", ({ executionContextId }, sessionID) => {
+ contexts.forEach((context, key) => {
+ if (context.id === executionContextId && context.sessionID === sessionID) contexts.delete(key)
+ })
})
- contents.on("render-process-gone", () => {
- if (!closed) fail()
+ cdp.on("Target.attachedToTarget", ({ sessionId, targetInfo }, parentSessionID) => {
+ if (targetInfo.type !== "iframe") return
+ const parentID = targetInfo.parentFrameId ?? Array.from(sessions).find(([, id]) => id === parentSessionID)?.[0]
+ if (parentID) parents.set(targetInfo.targetId, parentID)
+ sessions.set(targetInfo.targetId, sessionId)
+ void Promise.all([
+ diagnostics.enable(sessionId),
+ cdp.send("Page.enable", {}, sessionId),
+ cdp.send(
+ "Target.setAutoAttach",
+ {
+ autoAttach: true,
+ waitForDebuggerOnStart: false,
+ flatten: true,
+ filter: [{ type: "iframe", exclude: false }, { exclude: true }],
+ },
+ sessionId,
+ ),
+ ]).catch(() => undefined)
})
- contents.debugger.on("detach", () => {
- if (!closed) fail()
+ cdp.on("Target.detachedFromTarget", ({ sessionId }) => {
+ sessions.forEach((id, frameID) => {
+ if (id === sessionId) {
+ sessions.delete(frameID)
+ parents.delete(frameID)
+ }
+ })
})
+ cdp.on("Page.javascriptDialogOpening", (event) => {
+ dialog = {
+ type: event.type,
+ message: event.message.slice(0, Browser.MAX_TEXT),
+ defaultValue: event.defaultPrompt ?? "",
+ }
+ dialogs.forEach((reject) => reject())
+ publish()
+ })
+ cdp.on("Page.javascriptDialogClosed", () => {
+ dialog = null
+ publish()
+ })
+ view.setBounds({ x: 0, y: 0, width: 1000, height: 700 })
view.setVisible(false)
- // Match the review pane card so the page does not leak past its rounded bottom corners.
view.setBorderRadius(10)
win.contentView.addChildView(view)
+ const ready = Promise.all([
+ files.ready,
+ ...(options.initialize === false ? [] : [contents.loadURL("about:blank")]),
+ diagnostics.enable(),
+ cdp.send("Page.enable"),
+ cdp.send("DOM.enable"),
+ cdp.send("Target.setAutoAttach", {
+ autoAttach: true,
+ waitForDebuggerOnStart: false,
+ flatten: true,
+ filter: [{ type: "iframe", exclude: false }, { exclude: true }],
+ }),
+ ]).then(() => undefined)
+
return {
view,
+ contents,
state,
- execute,
- ready: Promise.resolve().then(() => contents.loadURL("about:blank")),
- dispose() {
+ ready,
+ async execute(command: Browser.Command, signal: AbortSignal): Promise {
+ await ready
+ abortError(signal)
+ if (closed) throw new Error("Browser tab was closed.")
+ if (
+ command.generation !== undefined &&
+ command.generation !== generation &&
+ !retainedOperations.has(command.action.type)
+ )
+ throw new Error("The document changed. Take a new snapshot and retry deliberately.")
+ if (dialog && command.action.type !== "dialog")
+ throw new Error("A JavaScript dialog is open. Use browser.dialog before continuing.")
+ const modal = Promise.withResolvers()
+ const cancelled = Promise.withResolvers()
+ const cancel = () => cancelled.reject(new Error("Browser operation was cancelled."))
+ signal.addEventListener("abort", cancel, { once: true })
+ const reject = () =>
+ modal.reject(new Error("A JavaScript dialog opened. Use browser.dialog to accept or dismiss it."))
+ if (command.action.type !== "dialog") dialogs.add(reject)
+ try {
+ return await Promise.race([execute(command.action, command.files, signal), modal.promise, cancelled.promise])
+ } finally {
+ signal.removeEventListener("abort", cancel)
+ dialogs.delete(reject)
+ }
+ },
+ async dispose() {
if (closed) return
closed = true
+ contents.session.off("will-download", download)
+ await profiling.dispose()
+ cdp.dispose()
refs.clear()
if (!win.isDestroyed()) win.contentView.removeChildView(view)
if (!contents.isDestroyed()) contents.close({ waitForBeforeUnload: false })
+ await files.dispose()
},
}
- async function execute(command: Browser.Command, signal: AbortSignal): Promise {
- const action = command.action
- check()
- if (action.type === "navigate") {
- await navigate(action.url, signal)
- return { type: "state", state: state() }
+ async function execute(
+ action: Browser.Action,
+ transfers: readonly Browser.File[],
+ signal: AbortSignal,
+ ): Promise {
+ const result = (value: unknown, attached: Browser.File[] = []): Browser.Result => {
+ const json = Schema.decodeUnknownSync(Schema.Json)(value)
+ if (JSON.stringify(json).length > 512_000)
+ throw new Error("Result is too large. Request fewer entries or a smaller snapshot.")
+ return { value: json, files: attached }
}
- if (["open", "back", "forward", "reload", "stop"].includes(action.type)) {
- if (action.type === "stop") contents.stop()
- if (action.type === "reload") contents.reload()
- if (action.type === "back" && contents.navigationHistory.canGoBack()) contents.navigationHistory.goBack()
- if (action.type === "forward" && contents.navigationHistory.canGoForward()) contents.navigationHistory.goForward()
- return { type: "state", state: state() }
- }
- if (action.type === "evaluate") {
- const value: unknown = await contents.executeJavaScript(action.script)
- check()
- return { type: "evaluate", state: state(), content: (JSON.stringify(value) ?? "null").slice(0, 100_000) }
- }
- if (action.type === "snapshot") {
- const tree = (await send("Accessibility.getFullAXTree", { depth: 6 })) as { nodes: AXNode[] }
- refs.clear()
- const nodes = new Map(tree.nodes.map((node) => [node.nodeId, node]))
- const lines = [`Page: ${clean(state().title)}`, `URL: ${state().url}`, ""]
- if (tree.nodes[0]) walk(tree.nodes[0], 0)
- return {
- type: "snapshot",
- state: state(),
- content: lines.join("\n").slice(0, 40_960),
+ switch (action.type) {
+ case "navigate": {
+ const url = normalizeURL(action.url)
+ const cancel = () => contents.stop()
+ signal.addEventListener("abort", cancel, { once: true })
+ try {
+ await contents.loadURL(url)
+ } finally {
+ signal.removeEventListener("abort", cancel)
+ }
+ abortError(signal)
+ return result(state())
}
-
- function walk(node: AXNode, depth: number) {
- if (depth > 6 || lines.length >= 503) return
- const role = (node.role?.value ?? "node").replace(/[^a-zA-Z0-9_-]/g, "").slice(0, 40)
- const properties = new Map((node.properties ?? []).map((item) => [item.name, item.value?.value]))
- const editable =
- ["textbox", "searchbox", "combobox", "spinbutton"].includes(role) || !!properties.get("editable")
- if (!node.ignored) {
- const actionable = properties.get("focusable") || /^(button|link|textbox|combobox)$/.test(role)
- const ref = actionable && node.backendDOMNodeId ? `e${++nextRef}` : ""
- if (ref && node.backendDOMNodeId)
- refs.set(ref, {
- id: node.backendDOMNodeId,
- editable: editable && !properties.get("disabled") && !properties.get("readonly"),
+ case "back":
+ case "forward":
+ case "reload":
+ case "stop": {
+ if (action.type === "back" && contents.navigationHistory.canGoBack()) contents.navigationHistory.goBack()
+ if (action.type === "forward" && contents.navigationHistory.canGoForward())
+ contents.navigationHistory.goForward()
+ if (action.type === "reload") contents.reload()
+ if (action.type === "stop") contents.stop()
+ if (action.type !== "stop") await waitFor(() => !contents.isLoading(), signal, 30_000)
+ return result(state())
+ }
+ case "frames":
+ return result({ tab: state(), frames: await frames() })
+ case "snapshot":
+ case "find":
+ return result({ tab: state(), ...(await snapshot(action)) })
+ case "evaluate": {
+ const context = action.frameID ? contexts.get(action.frameID) : undefined
+ if (action.frameID && !context) throw new Error("Frame context is unavailable. Call browser.frames again.")
+ const value = await cdp.send(
+ "Runtime.evaluate",
+ {
+ expression: action.script,
+ contextId: context?.id,
+ awaitPromise: true,
+ returnByValue: true,
+ userGesture: true,
+ },
+ context?.sessionID,
+ )
+ if (value.exceptionDetails)
+ throw new Error(value.exceptionDetails.exception?.description ?? value.exceptionDetails.text)
+ abortError(signal)
+ return result({ tab: state(), value: value.result.value ?? null })
+ }
+ case "click":
+ await click(target(action.ref), action.button ?? "left", action.count ?? 1, action.modifiers)
+ break
+ case "hover":
+ await cdp.send("Input.dispatchMouseEvent", { type: "mouseMoved", ...(await point(target(action.ref))) })
+ break
+ case "drag": {
+ const source = target(action.from)
+ const destination = target(action.to)
+ await point(destination)
+ const from = await point(source)
+ const box = await rect(destination)
+ const to = { x: box.x + box.width / 2, y: box.y + box.height / 2 }
+ const html5 = await call(source, "function() { return this.draggable; }")
+ let data: Protocol.Input.DragData | undefined
+ const off = cdp.on("Input.dragIntercepted", (event) => {
+ data = event.data
+ })
+ await cdp.send("Input.setInterceptDrags", { enabled: true })
+ await cdp.send("Input.dispatchMouseEvent", { type: "mouseMoved", ...from })
+ await cdp.send("Input.dispatchMouseEvent", {
+ type: "mousePressed",
+ ...from,
+ button: "left",
+ buttons: 1,
+ clickCount: 1,
+ })
+ try {
+ for (let i = 1; i <= 10; i++) {
+ abortError(signal)
+ await cdp.send("Input.dispatchMouseEvent", {
+ type: "mouseMoved",
+ x: from.x + ((to.x - from.x) * i) / 10,
+ y: from.y + ((to.y - from.y) * i) / 10,
+ button: "left",
+ buttons: 1,
})
- const flags = ["checked", "disabled", "expanded", "selected"].flatMap((flag) =>
- properties.has(flag) ? [`${flag}=${properties.get(flag)}`] : [],
- )
- lines.push(
- `${" ".repeat(depth)}${ref ? `@${ref}` : ""} [${role}] ${JSON.stringify(clean(node.name?.value))} ${flags.join(" ")}`,
- )
+ }
+ if (html5) await waitFor(() => data !== undefined, signal, 2_000)
+ if (data) {
+ for (const type of ["dragEnter", "dragOver", "drop"])
+ await cdp.send("Input.dispatchDragEvent", { type, ...to, data })
+ }
+ } finally {
+ off()
+ await cdp.send("Input.setInterceptDrags", { enabled: false })
+ await cdp.send("Input.dispatchMouseEvent", { type: "mouseReleased", ...to, button: "left", clickCount: 1 })
}
- // Editable descendants can repeat the field's value as static text.
- if (!editable)
- node.childIds?.forEach((id) => {
- const child = nodes.get(id)
- if (child) walk(child, depth + 1)
+ break
+ }
+ case "fill":
+ await fill(target(action.ref), action.text)
+ break
+ case "fill_form":
+ for (const field of action.fields) {
+ abortError(signal)
+ if (field.type === "text") await fill(target(field.ref), field.value)
+ if (field.type === "select") await select(target(field.ref), field.values)
+ if (field.type === "check") await check(target(field.ref), field.checked)
+ }
+ break
+ case "select":
+ await select(target(action.ref), action.values)
+ break
+ case "check":
+ await check(target(action.ref), action.checked)
+ break
+ case "press":
+ await key(action.key)
+ break
+ case "scroll": {
+ const bounds = view.getBounds()
+ await cdp.send("Input.dispatchMouseEvent", {
+ type: "mouseWheel",
+ x: bounds.width / 2,
+ y: bounds.height / 2,
+ deltaX: action.deltaX ?? 0,
+ deltaY: action.deltaY,
+ })
+ break
+ }
+ case "wait": {
+ if (action.condition !== "load" && !action.text) throw new Error("text is required for a text/textGone wait.")
+ await waitFor(
+ async () => {
+ if (action.condition === "load") return !contents.isLoading()
+ const context = action.frameID ? contexts.get(action.frameID) : undefined
+ if (action.frameID && !context) throw new Error("Frame context is unavailable.")
+ const value = await cdp.send(
+ "Runtime.evaluate",
+ {
+ expression: `document.body?.innerText.includes(${JSON.stringify(action.text)}) ?? false`,
+ returnByValue: true,
+ contextId: context?.id,
+ },
+ context?.sessionID,
+ )
+ return Boolean(value.result.value) === (action.condition === "text")
+ },
+ signal,
+ action.timeoutMs,
+ )
+ break
+ }
+ case "screenshot": {
+ if (action.ref && action.fullPage) throw new Error("Choose an element ref or fullPage, not both.")
+ const metrics = await cdp.send("Page.getLayoutMetrics")
+ const bounds = action.ref
+ ? await rect(target(action.ref))
+ : action.fullPage
+ ? metrics.cssContentSize
+ : {
+ x: metrics.cssVisualViewport.pageX,
+ y: metrics.cssVisualViewport.pageY,
+ width: metrics.cssVisualViewport.clientWidth,
+ height: metrics.cssVisualViewport.clientHeight,
+ }
+ const scale = Math.min(1, (action.maxWidth ?? 2000) / bounds.width)
+ if (!bounds.width || !bounds.height || bounds.width * bounds.height * scale * scale > 16_000_000)
+ throw new Error("Screenshot exceeds 16 megapixels; capture an element or use a smaller maxWidth.")
+ const format = action.format ?? "png"
+ const capture = await cdp.send("Page.captureScreenshot", {
+ format,
+ quality: format === "png" ? undefined : (action.quality ?? 80),
+ captureBeyondViewport: true,
+ clip: { ...bounds, scale },
+ })
+ const id = await files.save(`screenshot.${format}`, `image/${format}`, Buffer.from(capture.data, "base64"))
+ return result({ tab: state() }, [await files.transfer(id)])
+ }
+ case "dialog": {
+ if (action.action !== "get") {
+ if (!dialog) throw new Error("This tab has no JavaScript dialog.")
+ await cdp.send("Page.handleJavaScriptDialog", {
+ accept: action.action === "accept",
+ promptText: action.promptText,
})
- }
- }
- if (action.type === "screenshot") {
- const source = await contents.capturePage()
- check()
- const size = source.getSize()
- if (!size.width || !size.height) throw new Error("internal")
- const scale = Math.min(1, 2_000 / Math.max(size.width, size.height))
- const image = source.resize({
- width: Math.max(1, Math.round(size.width * scale)),
- height: Math.max(1, Math.round(size.height * scale)),
- })
- const data = new Uint8Array(image.toPNG())
- if (data.byteLength > 5 * 1_024 * 1_024) throw new Error("result_too_large")
- return { type: "screenshot", state: state(), data }
- }
- if (action.type === "click" || action.type === "fill") {
- const target = refs.get(action.ref.replace(/^@/, ""))
- if (!target || (action.type === "fill" && !target.editable)) throw new Error("stale_ref")
- if (action.type === "fill") {
- await send("DOM.focus", { backendNodeId: target.id })
- await key({ key: "a", code: "KeyA", modifiers: process.platform === "darwin" ? 4 : 2 })
- await key({ key: "Backspace", code: "Backspace", windowsVirtualKeyCode: 8 })
- await send("Input.insertText", { text: action.text })
- }
- if (action.type === "click") {
- await send("DOM.scrollIntoViewIfNeeded", { backendNodeId: target.id })
- const result = (await send("DOM.getBoxModel", { backendNodeId: target.id })) as {
- model: { content: number[] }
+ dialog = null
}
- const box = result.model.content
- const point = { x: (box[0] + box[4]) / 2, y: (box[1] + box[5]) / 2 }
- for (const type of ["mouseMoved", "mousePressed", "mouseReleased"]) {
- await send("Input.dispatchMouseEvent", { type, ...point, button: "left", clickCount: 1 })
+ return result({ tab: state(), dialog })
+ }
+ case "files.upload":
+ case "files.drop": {
+ if (!transfers.length) throw new Error("Upload did not include file bytes from the server.")
+ const local = await Promise.all(
+ transfers.map(async (file) => files.get(await files.save(file.name, file.mime, file.data)).path),
+ )
+ const element = target(action.ref)
+ if (action.type === "files.upload")
+ await cdp.send("DOM.setFileInputFiles", { files: local, backendNodeId: element.backendID }, element.sessionID)
+ if (action.type === "files.drop") {
+ const position = await point(element)
+ for (const type of ["dragEnter", "dragOver", "drop"])
+ await cdp.send("Input.dispatchDragEvent", {
+ type,
+ ...position,
+ data: { items: [], files: local, dragOperationsMask: 1 },
+ })
}
+ break
}
- }
- if (action.type === "press") {
- const codes: Record = {
- Enter: 13,
- Tab: 9,
- Escape: 27,
- Backspace: 8,
- Delete: 46,
- ArrowUp: 38,
- ArrowDown: 40,
- ArrowLeft: 37,
- ArrowRight: 39,
- PageUp: 33,
- PageDown: 34,
- Home: 36,
- End: 35,
- Space: 32,
+ case "files.list":
+ return result({ tab: state(), files: files.list() })
+ case "files.get":
+ return result({ tab: state() }, [await files.transfer(action.fileID)])
+ case "console":
+ return result({ tab: state(), ...diagnostics.console(action) })
+ case "network.list":
+ return result({ tab: state(), ...diagnostics.list(action) })
+ case "network.get":
+ return result({ tab: state(), ...(await diagnostics.get(action)) })
+ case "trace.start":
+ await profiling.startTrace(action.durationMs)
+ return result({ tab: state(), recording: true })
+ case "trace.stop": {
+ const value = await profiling.stopTrace()
+ return result({ tab: state(), durationMs: value.durationMs, incomplete: value.incomplete }, [
+ await files.transfer(value.id),
+ ])
}
- await key({
- key: action.key === "Space" ? " " : action.key,
- code: action.key,
- windowsVirtualKeyCode: codes[action.key],
- })
+ case "cpu.start":
+ await profiling.startCpu()
+ return result({ tab: state(), recording: true })
+ case "cpu.stop": {
+ const value = await profiling.stopCpu()
+ return result({ tab: state(), durationMs: value.durationMs }, [await files.transfer(value.id)])
+ }
+ case "heap.snapshot":
+ return result({ tab: state() }, [await files.transfer(await profiling.heap())])
+ case "trace.analyze":
+ case "cpu.analyze":
+ case "heap.summary":
+ case "heap.query":
+ case "heap.object":
+ case "heap.compare":
+ return result({ tab: state(), ...(await profiling.analyze(action)) })
+ case "lighthouse": {
+ const { audit } = await import("./browser/lighthouse")
+ const report = await audit(contents, files, cdp)
+ return result(
+ { tab: state(), scores: report.scores, failures: report.failures },
+ await Promise.all(report.files.map((id) => files.transfer(id))),
+ )
+ }
+ default:
+ throw new Error("Tab management is handled by the browser session, not a page.")
}
- if (action.type === "scroll") {
- const bounds = view.getBounds()
- await send("Input.dispatchMouseEvent", {
- type: "mouseWheel",
- x: bounds.width / 2,
- y: bounds.height / 2,
- deltaX: action.direction === "left" ? -action.pixels : action.direction === "right" ? action.pixels : 0,
- deltaY: action.direction === "up" ? -action.pixels : action.direction === "down" ? action.pixels : 0,
- })
- }
- check()
- return { type: "state", state: state() }
+ abortError(signal)
+ return result(state())
+ }
- function check() {
- if (closed) throw new Error("not_attached")
- if (signal.aborted) throw new Error("aborted")
- // Opening may create a new document before the command runs.
- if (action.type !== "open" && generation !== command.generation) throw new Error("stale_ref")
- }
+ function target(ref: Browser.Ref): Element {
+ const value = refs.get(ref.replace(/^@/, ""))
+ if (!value) throw new Error("Element ref is stale or belongs to another tab. Take a new snapshot.")
+ return value
+ }
- function key(params: Record) {
- return send("Input.dispatchKeyEvent", { type: "keyDown", ...params }).finally(() =>
- contents.debugger.sendCommand("Input.dispatchKeyEvent", { type: "keyUp", ...params }),
+ async function frames() {
+ const root = await cdp.send("Page.getFrameTree")
+ const result: { id: string; parentID?: string; url: string; name: string }[] = []
+ const walk = (tree: Protocol.Page.FrameTree, parentID?: string) => {
+ if (!result.some((frame) => frame.id === tree.frame.id))
+ result.push({
+ id: tree.frame.id,
+ ...(tree.frame.parentId || parentID ? { parentID: tree.frame.parentId ?? parentID } : {}),
+ url: tree.frame.url,
+ name: tree.frame.name ?? "",
+ })
+ tree.childFrames?.forEach((child) => walk(child, tree.frame.id))
+ }
+ walk(root.frameTree)
+ const children = await Promise.all(
+ Array.from(sessions, async ([id, sessionID]) => ({
+ id,
+ tree: await cdp.send("Page.getFrameTree", {}, sessionID).catch(() => undefined),
+ })),
+ )
+ children.forEach(({ id, tree }) => {
+ if (tree) walk(tree.frameTree, parents.get(id) ?? root.frameTree.frame.id)
+ })
+ return result
+ }
+
+ async function call(element: Element, functionDeclaration: string, args: unknown[] = []) {
+ const object = await cdp.send("DOM.resolveNode", { backendNodeId: element.backendID }, element.sessionID)
+ const objectId = object.object.objectId
+ if (!objectId) throw new Error("Element is no longer available.")
+ try {
+ const result = await cdp.send(
+ "Runtime.callFunctionOn",
+ {
+ objectId,
+ functionDeclaration,
+ arguments: args.map((value) => ({ value })),
+ returnByValue: true,
+ awaitPromise: true,
+ userGesture: true,
+ },
+ element.sessionID,
)
- }
-
- async function send(method: string, params: Record): Promise {
- check()
- if (!contents.debugger.isAttached()) contents.debugger.attach("1.3")
- const result: unknown = await contents.debugger.sendCommand(method, params)
- check()
- return result
+ if (result.exceptionDetails)
+ throw new Error(result.exceptionDetails.exception?.description ?? result.exceptionDetails.text)
+ return result.result.value as unknown
+ } finally {
+ await cdp.send("Runtime.releaseObject", { objectId }, element.sessionID).catch(() => undefined)
}
}
- async function navigate(input: string, signal: AbortSignal) {
- const value = input.trim() || "about:blank"
- const local = /^(?:localhost|127(?:\.\d{1,3}){3}|\[::1\])(?::\d+)?(?:[/?#]|$)/i.test(value)
- const url =
- value === "about:blank" || /^[a-z][a-z\d+.-]*:\/\//i.test(value)
- ? value
- : `${local ? "http" : "https"}://${value}`
- if (url.length > 16_384 || (url !== "about:blank" && !destinationOrigin(url))) throw new Error("invalid_url")
- const cancel = () => {
- if (!closed) contents.stop()
+ async function rect(element: Element, scroll = false) {
+ if (scroll) {
+ await cdp.send("DOM.scrollIntoViewIfNeeded", { backendNodeId: element.backendID }, element.sessionID)
+ // Force a compositor update after scrolling. requestAnimationFrame can
+ // stall in a hidden WebContentsView, even with background throttling off.
+ await contents.capturePage(undefined, { stayHidden: false, stayAwake: true })
}
- signal.addEventListener("abort", cancel, { once: true })
- await contents.loadURL(url).finally(() => signal.removeEventListener("abort", cancel))
- if (signal.aborted) throw new Error("aborted")
+ const shape = Schema.Struct({ x: Schema.Finite, y: Schema.Finite, width: Schema.Finite, height: Schema.Finite })
+ const value = {
+ ...Schema.decodeUnknownSync(shape)(
+ await call(
+ element,
+ "function() { const r = this.getBoundingClientRect(); return {x:r.x,y:r.y,width:r.width,height:r.height}; }",
+ ),
+ ),
+ }
+ const tree = await frames()
+ let frame = tree.find((frame) => frame.id === element.frameID)
+ while (frame?.parentID) {
+ const owner = await cdp.send("DOM.getFrameOwner", { frameId: frame.id }, sessions.get(frame.parentID))
+ const offset = Schema.decodeUnknownSync(shape)(
+ await call(
+ { backendID: owner.backendNodeId, frameID: frame.parentID, sessionID: sessions.get(frame.parentID) },
+ "function() { const r = this.getBoundingClientRect(); return {x:r.x+this.clientLeft,y:r.y+this.clientTop,width:r.width,height:r.height}; }",
+ ),
+ )
+ value.x += offset.x
+ value.y += offset.y
+ frame = tree.find((item) => item.id === frame?.parentID)
+ }
+ return value
}
-}
-function clean(value: unknown) {
- return typeof value === "string" ? value.replaceAll(/\s+/g, " ").trim().slice(0, 300) : ""
+ async function point(element: Element) {
+ const box = await rect(element, true)
+ return { x: box.x + box.width / 2, y: box.y + box.height / 2 }
+ }
+
+ async function click(element: Element, button = "left", count = 1, modifiers: readonly string[] = []) {
+ const position = await point(element)
+ const flags = modifiers.reduce((mask, key) => mask | ({ Alt: 1, Control: 2, Meta: 4, Shift: 8 }[key] ?? 0), 0)
+ await cdp.send("Input.dispatchMouseEvent", { type: "mouseMoved", ...position, modifiers: flags })
+ for (let clickCount = 1; clickCount <= count; clickCount++) {
+ await cdp.send("Input.dispatchMouseEvent", {
+ type: "mousePressed",
+ ...position,
+ button,
+ clickCount,
+ modifiers: flags,
+ })
+ await cdp.send("Input.dispatchMouseEvent", {
+ type: "mouseReleased",
+ ...position,
+ button,
+ clickCount,
+ modifiers: flags,
+ })
+ }
+ }
+
+ async function fill(element: Element, value: string) {
+ const editable = await call(
+ element,
+ "function() { return (this instanceof HTMLInputElement || this instanceof HTMLTextAreaElement || this.isContentEditable) && !this.disabled && !this.readOnly; }",
+ )
+ if (!editable) throw new Error("Element is not an editable field.")
+ await cdp.send("DOM.focus", { backendNodeId: element.backendID }, element.sessionID)
+ await key(process.platform === "darwin" ? "Meta+A" : "Control+A")
+ await key("Backspace")
+ await cdp.send("Input.insertText", { text: value })
+ }
+
+ async function select(element: Element, values: readonly string[]) {
+ await call(
+ element,
+ `function(values) { if (!(this instanceof HTMLSelectElement) || this.disabled) throw new Error('Element is not an enabled select.'); if (!this.multiple && values.length !== 1) throw new Error('Select accepts one value.'); for (const value of values) if (!Array.from(this.options).some(option => option.value === value && !option.disabled)) throw new Error('Option value was not found.'); for (const option of this.options) option.selected = values.includes(option.value); this.dispatchEvent(new Event('input',{bubbles:true})); this.dispatchEvent(new Event('change',{bubbles:true})); }`,
+ [values],
+ )
+ }
+
+ async function check(element: Element, checked: boolean) {
+ const current = await call(
+ element,
+ "function() { if (!(this instanceof HTMLInputElement) || !['checkbox','radio'].includes(this.type) || this.disabled) throw new Error('Element is not an enabled checkbox or radio.'); return this.checked; }",
+ )
+ if (current !== checked) await click(element)
+ if ((await call(element, "function() { return this.checked; }")) !== checked)
+ throw new Error("Element did not reach the requested checked state.")
+ }
+
+ async function key(chord: string) {
+ const parts = chord.split("+")
+ const key = parts.pop() ?? ""
+ const modifiers = parts.reduce((mask, key) => {
+ const bit = { Alt: 1, Control: 2, Meta: 4, Shift: 8 }[key]
+ if (!bit) throw new Error(`Unknown key modifier: ${key}`)
+ return mask | bit
+ }, 0)
+ const codes: Record = {
+ Enter: 13,
+ Tab: 9,
+ Escape: 27,
+ Backspace: 8,
+ Delete: 46,
+ ArrowUp: 38,
+ ArrowDown: 40,
+ ArrowLeft: 37,
+ ArrowRight: 39,
+ PageUp: 33,
+ PageDown: 34,
+ Home: 36,
+ End: 35,
+ Space: 32,
+ }
+ const code =
+ codes[key] ??
+ (key.length === 1
+ ? key.toUpperCase().charCodeAt(0)
+ : /^F([1-9]|1[0-2])$/.test(key)
+ ? 111 + Number(key.slice(1))
+ : undefined)
+ if (code === undefined) throw new Error(`Unknown key: ${key}`)
+ const params = {
+ key: key === "Space" ? " " : key,
+ windowsVirtualKeyCode: code,
+ modifiers,
+ ...(key.length === 1 && !(modifiers & 6) ? { text: key } : {}),
+ }
+ await cdp.send("Input.dispatchKeyEvent", { type: "keyDown", ...params })
+ await cdp.send("Input.dispatchKeyEvent", { type: "keyUp", ...params })
+ }
+
+ async function snapshot(action: Extract) {
+ const tree = await frames()
+ const selected = action.type === "snapshot" && action.ref ? target(action.ref) : undefined
+ const frameID = selected?.frameID ?? action.frameID ?? tree[0]?.id
+ if (!frameID || !tree.some((frame) => frame.id === frameID))
+ throw new Error("Frame is unavailable. Call browser.frames again.")
+ const sessionID = sessions.get(frameID)
+ const depth = action.type === "snapshot" ? (action.depth ?? 8) : 8
+ const ax = await cdp.send("Accessibility.getFullAXTree", { frameId: frameID, depth }, sessionID)
+ const nodes = new Map(ax.nodes.map((node) => [node.nodeId, node]))
+ const root = selected ? ax.nodes.find((node) => node.backendDOMNodeId === selected.backendID) : ax.nodes[0]
+ if (!root) throw new Error("Element is absent from the accessibility snapshot.")
+ refs.clear()
+ const lines: string[] = []
+ let truncated = false
+ const walk = async (node: Protocol.Accessibility.AXNode, level: number): Promise => {
+ if (level > depth || lines.length >= 500) {
+ truncated = true
+ return
+ }
+ const role = String(node.role?.value ?? "node")
+ .replace(/[^a-zA-Z0-9_-]/g, "")
+ .slice(0, 40)
+ const properties = new Map(node.properties?.map((property) => [property.name, property.value.value]) ?? [])
+ if (!node.ignored) {
+ const actionable =
+ role !== "RootWebArea" &&
+ (properties.get("focusable") || /^(button|link|textbox|combobox|checkbox|radio|option)$/.test(role))
+ const ref = actionable && node.backendDOMNodeId ? `e${++nextRef}` : ""
+ const element = node.backendDOMNodeId ? { backendID: node.backendDOMNodeId, frameID, sessionID } : undefined
+ if (ref && element) refs.set(ref, element)
+ const flags = (["checked", "disabled", "expanded", "selected"] as const).flatMap((name) =>
+ properties.has(name) ? [`${name}=${properties.get(name)}`] : [],
+ )
+ const box =
+ action.type === "snapshot" && action.boxes && ref && element
+ ? await rect(element).catch(() => undefined)
+ : undefined
+ lines.push(
+ `${" ".repeat(level)}${ref ? `@${ref} ` : ""}[${role}] ${JSON.stringify(
+ String(node.name?.value ?? "")
+ .replace(/\s+/g, " ")
+ .slice(0, 300),
+ )} ${flags.join(" ")}${box ? ` box=${JSON.stringify(box)}` : ""}`,
+ )
+ }
+ if (["textbox", "searchbox"].includes(role) || properties.get("editable")) return
+ for (const childID of node.childIds ?? []) {
+ const child = nodes.get(childID)
+ if (child) await walk(child, level + 1)
+ }
+ }
+ await walk(root, 0)
+ const content = (
+ action.type === "find" ? lines.filter((line) => line.toLowerCase().includes(action.text.toLowerCase())) : lines
+ ).join("\n")
+ return { content: content.slice(0, Browser.MAX_TEXT), truncated: truncated || content.length > Browser.MAX_TEXT }
+ }
}
export function destinationOrigin(input: string) {
@@ -284,3 +779,13 @@ export function destinationOrigin(input: string) {
const url = new URL(input)
return /^https?:$/.test(url.protocol) && !url.username && !url.password ? url.origin : undefined
}
+
+export function normalizeURL(input: string) {
+ const value = input.trim() || "about:blank"
+ const local = /^(?:localhost|127(?:\.\d{1,3}){3}|\[::1\])(?::\d+)?(?:[/?#]|$)/i.test(value)
+ const url =
+ value === "about:blank" || /^[a-z][a-z\d+.-]*:\/\//i.test(value) ? value : `${local ? "http" : "https"}://${value}`
+ if (url !== "about:blank" && !destinationOrigin(url))
+ throw new Error("Only HTTP, HTTPS, and about:blank URLs are supported.")
+ return url
+}
diff --git a/packages/desktop/src/main/browser-pane.ts b/packages/desktop/src/main/browser-pane.ts
index a94f7952a36..ccdcb60e24b 100644
--- a/packages/desktop/src/main/browser-pane.ts
+++ b/packages/desktop/src/main/browser-pane.ts
@@ -15,10 +15,13 @@ type Entry = {
win: BrowserWindow
abort: AbortController
registered: PromiseWithResolvers
- requests: Map
- report?: (event: Extract) => void
+ requests: Map
+ report?: (event: BrowserPaneEvent["event"]) => void
cleanup?: () => void
- page?: BrowserPage
+ pages: Map
+ focusedTabID: Browser.TabID | null
+ partition: string
+ lastState?: string
}
export function createBrowserPane() {
@@ -39,6 +42,9 @@ export function createBrowserPane() {
abort: new AbortController(),
registered: Promise.withResolvers(),
requests: new Map(),
+ pages: new Map(),
+ focusedTabID: null,
+ partition: `opencode-browser-${crypto.randomUUID()}`,
}
// "unsupported" means the server has no browser plugin; the renderer stops retrying.
let reason: "browser.pane.unsupported" | undefined
@@ -49,6 +55,7 @@ export function createBrowserPane() {
win.webContents.once("destroyed", stop)
win.webContents.on("did-start-navigation", navigate)
entry.cleanup = () => {
+ if (win.isDestroyed()) return
win.webContents.off("destroyed", stop)
win.webContents.off("did-start-navigation", navigate)
}
@@ -80,9 +87,10 @@ export function createBrowserPane() {
entry.report = (event) => {
Queue.offerUnsafe(
outbound,
- rpc
- .state({ ...attachment, state: event.state }, options)
- .pipe(Effect.tap(() => Effect.sync(() => publish(entry, event)))),
+ (event.type === "state"
+ ? rpc.state({ ...attachment, state: event.state ?? { tabs: [], focusedTabID: null } }, options)
+ : Effect.void
+ ).pipe(Effect.andThen(Effect.sync(() => publish(entry, event)))),
)
}
const receive = client.event.subscribe().pipe(
@@ -92,40 +100,61 @@ export function createBrowserPane() {
yield* Deferred.succeed(connected, undefined)
return
}
- if (event.type !== "rpc.experimental.browser.control") return
- const message = yield* Schema.decodeUnknownEffect(Browser.Control)(event.data)
- if (message.connectionID !== attachment.connectionID) return
- if (message.type === "attached") return entry.registered.resolve()
- if (message.type === "cancel") return entry.requests.get(message.requestID)?.abort()
- const abort = new AbortController()
- entry.requests.set(message.requestID, abort)
- yield* Effect.promise(async () => {
- const outcome: Browser.Outcome = await execute(entry, message.command, abort.signal).then(
- (result) => ({ type: "success" as const, result }),
- (error: unknown) => ({
- type: "failure" as const,
- message: (error instanceof Error ? error.message : String(error)).slice(0, 1_024),
+ if (
+ event.type !== "rpc.experimental.browser.control" ||
+ event.data.connectionID !== attachment.connectionID
+ )
+ return
+ const message = yield* Schema.decodeUnknownEffect(Browser.Control)(event.data).pipe(
+ Effect.tapError(() =>
+ Effect.sync(() => {
+ reason = "browser.pane.unsupported"
}),
- )
- Queue.offerUnsafe(
- outbound,
- rpc.result(
- {
- ...attachment,
- requestID: message.requestID,
- outcome: Schema.encodeSync(Browser.Outcome)(outcome),
- },
- options,
- ),
- )
- }).pipe(
+ ),
+ )
+ if (message.type === "attached") return entry.registered.resolve()
+ if (message.type === "cancel") return entry.requests.get(message.requestID)?.abort.abort()
+ const abort = new AbortController()
+ entry.requests.set(message.requestID, { abort })
+ yield* rpc.command({ ...attachment, requestID: message.requestID }, options).pipe(
+ Effect.flatMap((command) =>
+ Effect.promise(async () => {
+ entry.requests.set(message.requestID, {
+ abort,
+ ...("tabID" in command.action ? { tabID: command.action.tabID } : {}),
+ })
+ const outcome: Browser.Outcome = await execute(entry, command, abort.signal).then(
+ (result) => ({ type: "success" as const, result }),
+ (error: unknown) => ({
+ type: "failure" as const,
+ code: "operation_failed",
+ message: (error instanceof Error ? error.message : String(error)).slice(0, 1_024),
+ }),
+ )
+ Queue.offerUnsafe(
+ outbound,
+ rpc.result(
+ {
+ ...attachment,
+ requestID: message.requestID,
+ outcome: Schema.encodeSync(Browser.Outcome)(outcome),
+ },
+ options,
+ ),
+ )
+ }),
+ ),
Effect.ensuring(
Effect.sync(() => {
abort.abort()
entry.requests.delete(message.requestID)
}),
),
- Effect.catchCause(() => Effect.sync(stop)),
+ Effect.catchCause((cause) =>
+ abort.signal.aborted
+ ? Effect.void
+ : Effect.logError("Browser command failed", cause).pipe(Effect.andThen(Effect.sync(stop))),
+ ),
Effect.forkScoped,
)
}),
@@ -134,14 +163,15 @@ export function createBrowserPane() {
yield* Effect.raceAllFirst([
receive,
Stream.fromQueue(outbound).pipe(Stream.runForEach((send) => send)),
- Deferred.await(connected).pipe(Effect.andThen(rpc.attach(attachment, options))),
+ Deferred.await(connected).pipe(Effect.andThen(rpc.attach({ ...attachment, version: 2 }, options))),
])
}).pipe(
Effect.scoped,
Effect.tapError((error) =>
Effect.sync(() => {
const type = error instanceof Object && "type" in error ? error.type : undefined
- if (type === "rpc.unavailable" || type === "rpc.method_not_found") reason = "browser.pane.unsupported"
+ if (type === "rpc.unavailable" || type === "rpc.method_not_found" || type === "rpc.invalid_input")
+ reason = "browser.pane.unsupported"
}),
),
Effect.ensuring(Effect.sync(stop)),
@@ -156,23 +186,23 @@ export function createBrowserPane() {
},
layout(win: BrowserWindow, bindingID: string, value?: BrowserPaneLayout) {
const entry = owned(win, bindingID)
- if (!value) return closePage(entry)
+ if (!value) return entry.pages.forEach((page) => page.view.setVisible(false))
+ const page = entry.pages.get(value.tabID)
+ if (!page) return
const bounds = value.bounds
if (!value.visible || !bounds || bounds.width <= 0 || bounds.height <= 0) {
- entry.page?.view.setVisible(false)
+ page.view.setVisible(false)
return
}
- const page = create(entry)
+ entry.pages.forEach((other) => {
+ if (other !== page) other.view.setVisible(false)
+ })
page.view.setBounds(bounds)
page.view.setVisible(true)
},
async command(win: BrowserWindow, bindingID: string, command: BrowserPaneCommand) {
const entry = owned(win, bindingID)
- await execute(
- entry,
- { action: command, generation: entry.page?.state().generation ?? 0 },
- new AbortController().signal,
- )
+ await execute(entry, { action: command, files: [] }, new AbortController().signal)
},
async close(win: BrowserWindow, bindingID: string) {
close(owned(win, bindingID))
@@ -198,57 +228,117 @@ export function createBrowserPane() {
function close(entry: Entry, reason = "browser.pane.registration.closed") {
if (entries.get(entry.bindingID) !== entry) return
entry.report = undefined
- closePage(entry, reason)
+ entry.requests.forEach((request) => request.abort.abort())
+ entry.requests.clear()
+ entry.pages.forEach((page) => {
+ void page.dispose().catch(() => undefined)
+ })
+ entry.pages.clear()
+ entry.focusedTabID = null
+ publishState(entry, reason)
entries.delete(entry.bindingID)
entry.registered.reject(new Error("browser.pane.registration.closed"))
entry.cleanup?.()
entry.abort.abort()
}
- function closePage(entry: Entry, error?: string) {
- entry.requests.forEach((request) => request.abort())
- entry.requests.clear()
- entry.page?.dispose()
- entry.page = undefined
+ async function closePage(entry: Entry, tabID: Browser.TabID, error?: string) {
+ const page = entry.pages.get(tabID)
+ if (!page) throw new Error("Browser tab is unavailable.")
+ const focused = entry.focusedTabID === tabID
+ entry.requests.forEach((request) => {
+ if (request.tabID === tabID) request.abort.abort()
+ })
+ entry.pages.delete(tabID)
+ if (focused) entry.focusedTabID = entry.pages.keys().next().value ?? null
+ await page.dispose()
publishState(entry, error)
}
function publishState(entry: Entry, error?: string) {
const event = {
type: "state" as const,
- state: entry.page?.state() ?? null,
+ state: { tabs: Array.from(entry.pages.values(), (page) => page.state()), focusedTabID: entry.focusedTabID },
...(error === undefined ? {} : { error }),
}
+ const next = JSON.stringify(event)
+ if (entry.lastState === next) return
+ entry.lastState = next
+ report(entry, event)
+ }
+
+ function report(entry: Entry, event: BrowserPaneEvent["event"]) {
if (entry.report) return entry.report(event)
publish(entry, event)
}
- function create(entry: Entry) {
- if (entry.page) return entry.page
+ function create(entry: Entry, initialize = true, popupOptions?: Electron.BrowserWindowConstructorOptions) {
+ const id = Browser.TabID.make(`tab_${crypto.randomUUID()}`)
const fail = () => {
- if (entry.page === page) closePage(entry, "page_crashed")
+ if (entry.pages.has(id)) void closePage(entry, id, "page_crashed").catch(() => undefined)
}
- const page = createBrowserPage(
- entry.win,
- (error) => {
- if (entry.page === page) publishState(entry, error)
- },
+ const page = createBrowserPage(entry.win, {
+ id,
+ partition: entry.partition,
+ initialize,
+ popupOptions,
fail,
- )
- entry.page = page
+ publish: (error) => {
+ if (entry.pages.has(id)) publishState(entry, error)
+ },
+ popup: (popupOptions) => {
+ const popup = create(entry, false, popupOptions)
+ focus(entry, popup.state().id)
+ return popup.contents
+ },
+ })
+ entry.pages.set(id, page)
void page.ready
.then(() => {
- if (entry.page === page) publishState(entry)
+ if (entry.pages.get(id) === page) publishState(entry)
})
.catch(fail)
return page
}
async function execute(entry: Entry, command: Browser.Command, signal: AbortSignal) {
- if (command.action.type === "open") publish(entry, { type: "open" })
- const page = command.action.type === "open" ? create(entry) : entry.page
- if (!page) throw new Error("not_attached")
+ const action = command.action
+ const state = () => ({
+ tabs: Array.from(entry.pages.values(), (page) => page.state()),
+ focusedTabID: entry.focusedTabID,
+ })
+ if (signal.aborted) throw new Error("Browser request was cancelled.")
+ if (action.type === "tabs.list") return { value: state(), files: [] }
+ if (action.type === "tabs.open") {
+ const page = create(entry)
+ if (action.focus !== false) focus(entry, page.state().id)
+ await page.ready
+ await page.execute(
+ { action: { type: "navigate", tabID: page.state().id, url: action.url ?? "about:blank" }, files: [] },
+ signal,
+ )
+ publishState(entry)
+ return { value: page.state(), files: [] }
+ }
+ const page = entry.pages.get(action.tabID)
+ if (!page) throw new Error("Browser tab is unavailable. Call browser.tabs.list.")
+ if (action.type === "tabs.focus") {
+ focus(entry, action.tabID)
+ return { value: page.state(), files: [] }
+ }
+ if (action.type === "tabs.close") {
+ await closePage(entry, action.tabID)
+ return { value: state(), files: [] }
+ }
await page.ready
- return page.execute(command, signal)
+ const result = await page.execute(command, signal)
+ publishState(entry)
+ return result
+ }
+
+ function focus(entry: Entry, tabID: Browser.TabID) {
+ entry.focusedTabID = tabID
+ publishState(entry)
+ report(entry, { type: "focus", tabID })
}
}
diff --git a/packages/desktop/src/main/browser/analysis.ts b/packages/desktop/src/main/browser/analysis.ts
new file mode 100644
index 00000000000..27c73d3cf45
--- /dev/null
+++ b/packages/desktop/src/main/browser/analysis.ts
@@ -0,0 +1,193 @@
+import { Schema } from "effect"
+
+const number = Schema.Finite
+const Trace = Schema.Struct({
+ traceEvents: Schema.Array(
+ Schema.Struct({
+ name: Schema.optionalKey(Schema.String),
+ ph: Schema.optionalKey(Schema.String),
+ pid: Schema.optionalKey(number),
+ tid: Schema.optionalKey(number),
+ ts: Schema.optionalKey(number),
+ dur: Schema.optionalKey(number),
+ }),
+ ),
+})
+const Cpu = Schema.Struct({
+ startTime: number,
+ endTime: number,
+ nodes: Schema.Array(
+ Schema.Struct({
+ id: number,
+ callFrame: Schema.Struct({ functionName: Schema.String, url: Schema.String, lineNumber: number }),
+ }),
+ ),
+ samples: Schema.optionalKey(Schema.Array(number)),
+ timeDeltas: Schema.optionalKey(Schema.Array(number)),
+})
+const Heap = Schema.Struct({
+ snapshot: Schema.Struct({
+ meta: Schema.Struct({
+ node_fields: Schema.Array(Schema.String),
+ node_types: Schema.Array(Schema.Union([Schema.String, Schema.Array(Schema.String)])),
+ edge_fields: Schema.Array(Schema.String),
+ edge_types: Schema.Array(Schema.Union([Schema.String, Schema.Array(Schema.String)])),
+ }),
+ }),
+ nodes: Schema.Array(number),
+ edges: Schema.Array(number),
+ strings: Schema.Array(Schema.String),
+})
+
+export function analyzeTrace(value: unknown, limit = 100) {
+ const trace = Schema.decodeUnknownSync(Trace)(value)
+ const events = new Map()
+ const longTasks: number[] = []
+ trace.traceEvents.forEach((event) => {
+ if (event.ph !== "X" || !event.name || event.dur === undefined) return
+ const duration = event.dur / 1000
+ const item = events.get(event.name) ?? { name: event.name.slice(0, 2_048), count: 0, totalMs: 0, maxMs: 0 }
+ item.count++
+ item.totalMs += duration
+ item.maxMs = Math.max(item.maxMs, duration)
+ events.set(event.name, item)
+ if ((event.name === "RunTask" || event.name === "ThreadControllerImpl::RunTask") && duration > 50)
+ longTasks.push(duration)
+ })
+ return {
+ metrics: [
+ { name: "recordedEvents", value: trace.traceEvents.length, unit: "count" },
+ { name: "longTasks", value: longTasks.length, unit: "count" },
+ { name: "longTaskBlocking", value: longTasks.reduce((sum, duration) => sum + duration - 50, 0), unit: "ms" },
+ ],
+ events: Array.from(events.values())
+ .sort((a, b) => b.totalMs - a.totalMs)
+ .slice(0, limit),
+ insights: [
+ "Event durations can overlap and must not be summed into total page time.",
+ longTasks.length
+ ? `${longTasks.length} recorded tasks exceeded 50 ms; inspect their stacks in the exported trace.`
+ : "No tasks over 50 ms were observed in the retained trace. This is not proof that the page has no long tasks.",
+ "This renderer-process trace does not calculate LCP, INP, CLS, or Lighthouse performance scores.",
+ ],
+ }
+}
+
+export function analyzeCpu(value: unknown, limit = 100) {
+ const profile = Schema.decodeUnknownSync(Cpu)(value)
+ const times = new Map()
+ profile.samples?.forEach((id, index) =>
+ times.set(id, (times.get(id) ?? 0) + (profile.timeDeltas?.[index] ?? 0) / 1000),
+ )
+ return {
+ durationMs: Math.max(0, (profile.endTime - profile.startTime) / 1000),
+ functions: profile.nodes
+ .map((node) => ({
+ name: node.callFrame.functionName.slice(0, 2_048),
+ url: node.callFrame.url.slice(0, 100_000),
+ line: Math.max(0, node.callFrame.lineNumber + 1),
+ selfMs: times.get(node.id) ?? 0,
+ }))
+ .filter((node) => node.selfMs > 0)
+ .sort((a, b) => b.selfMs - a.selfMs)
+ .slice(0, limit),
+ }
+}
+
+export function parseHeap(value: unknown) {
+ const heap = Schema.decodeUnknownSync(Heap)(value)
+ const fields = heap.snapshot.meta.node_fields
+ const edgeFields = heap.snapshot.meta.edge_fields
+ const width = fields.length
+ const edgeWidth = edgeFields.length
+ const indexes = {
+ type: fields.indexOf("type"),
+ name: fields.indexOf("name"),
+ id: fields.indexOf("id"),
+ size: fields.indexOf("self_size"),
+ count: fields.indexOf("edge_count"),
+ edgeType: edgeFields.indexOf("type"),
+ edgeName: edgeFields.indexOf("name_or_index"),
+ to: edgeFields.indexOf("to_node"),
+ }
+ if (
+ !width ||
+ !edgeWidth ||
+ Object.values(indexes).some((index) => index < 0) ||
+ heap.nodes.length % width ||
+ heap.edges.length % edgeWidth
+ )
+ throw new Error("Unsupported heap snapshot layout.")
+ const types = heap.snapshot.meta.node_types[indexes.type]
+ const edgeTypes = heap.snapshot.meta.edge_types[indexes.edgeType]
+ if (!Array.isArray(types) || !Array.isArray(edgeTypes)) throw new Error("Unsupported heap snapshot types.")
+ const node = (offset: number) => ({
+ id: heap.nodes[offset + indexes.id],
+ name: (heap.strings[heap.nodes[offset + indexes.name]] ?? "").slice(0, 100_000),
+ type: types[heap.nodes[offset + indexes.type]] ?? "unknown",
+ selfBytes: heap.nodes[offset + indexes.size],
+ edgeCount: heap.nodes[offset + indexes.count],
+ })
+ const classes = new Map()
+ let selfBytes = 0
+ for (let offset = 0; offset < heap.nodes.length; offset += width) {
+ const item = node(offset)
+ const name = item.name.slice(0, 2_048)
+ const entry = classes.get(name) ?? { name, count: 0, bytes: 0 }
+ entry.count++
+ entry.bytes += item.selfBytes
+ selfBytes += item.selfBytes
+ classes.set(name, entry)
+ }
+ return {
+ summary(limit = 100) {
+ return {
+ nodes: heap.nodes.length / width,
+ edges: heap.edges.length / edgeWidth,
+ selfBytes,
+ classes: Array.from(classes.values())
+ .sort((a, b) => b.bytes - a.bytes)
+ .slice(0, limit),
+ }
+ },
+ classes,
+ query(name = "", limit = 100) {
+ const found: ReturnType[] = []
+ for (let offset = 0; offset < heap.nodes.length; offset += width) {
+ const item = node(offset)
+ if (item.name.toLowerCase().includes(name.toLowerCase())) found.push(item)
+ }
+ return { nodes: found.sort((a, b) => b.selfBytes - a.selfBytes).slice(0, limit), truncated: found.length > limit }
+ },
+ object(id: number, limit = 100) {
+ const target = heap.nodes.findIndex((value, index) => index % width === indexes.id && value === id) - indexes.id
+ if (target < 0) throw new Error("Object ID was not found in this heap snapshot.")
+ const references: { name: string; node: ReturnType }[] = []
+ const retainers: { name: string; node: ReturnType }[] = []
+ let edgeOffset = 0
+ let truncated = false
+ for (let offset = 0; offset < heap.nodes.length; offset += width) {
+ const count = heap.nodes[offset + indexes.count]
+ for (let index = 0; index < count; index++, edgeOffset += edgeWidth) {
+ const to = heap.edges[edgeOffset + indexes.to]
+ if (offset !== target && to !== target) continue
+ const type = edgeTypes[heap.edges[edgeOffset + indexes.edgeType]]
+ const raw = heap.edges[edgeOffset + indexes.edgeName]
+ const name = (type === "element" || type === "hidden" ? String(raw) : (heap.strings[raw] ?? "")).slice(
+ 0,
+ 100_000,
+ )
+ if (offset === target) {
+ if (references.length < limit) references.push({ name, node: node(to) })
+ else truncated = true
+ }
+ if (to === target) {
+ if (retainers.length < limit) retainers.push({ name, node: node(offset) })
+ else truncated = true
+ }
+ }
+ }
+ return { node: node(target), references, retainers, truncated }
+ },
+ }
+}
diff --git a/packages/desktop/src/main/browser/cdp.ts b/packages/desktop/src/main/browser/cdp.ts
new file mode 100644
index 00000000000..7d4d27b59b4
--- /dev/null
+++ b/packages/desktop/src/main/browser/cdp.ts
@@ -0,0 +1,72 @@
+import type { WebContents } from "electron"
+import type { ProtocolMapping } from "devtools-protocol/types/protocol-mapping.js"
+
+export type Cdp = ReturnType
+
+export function createCdp(contents: WebContents) {
+ const listeners = new Map void>>()
+ const sessions = new Set([""])
+ const receive = (_event: Electron.Event, name: string, params: unknown, sessionID?: string) => {
+ if (!sessions.has(sessionID ?? "")) return
+ if (name === "Target.attachedToTarget") {
+ const event = params as ProtocolMapping.Events["Target.attachedToTarget"][0]
+ if (event.targetInfo.type === "iframe") sessions.add(event.sessionId)
+ }
+ if (name === "Target.detachedFromTarget")
+ sessions.delete((params as ProtocolMapping.Events["Target.detachedFromTarget"][0]).sessionId)
+ listeners.get(name)?.forEach((callback) => callback(params, sessionID || undefined))
+ }
+ contents.debugger.on("message", receive)
+ return {
+ async send(
+ method: Method,
+ params: object = {},
+ sessionID?: string,
+ ): Promise {
+ if (contents.isDestroyed()) throw new Error("Browser tab was closed.")
+ if (!contents.debugger.isAttached()) contents.debugger.attach("1.3")
+ // Electron is the CDP boundary. Its native response follows the selected protocol method.
+ const result = contents.debugger.sendCommand(method, params, sessionID)
+ if (method !== "Page.captureScreenshot") return result
+ // Keep a hidden view's compositor awake for CDP (including Lighthouse's
+ // screenshot gatherer) without changing the selected Review tab.
+ const [capture] = await Promise.all([
+ result,
+ contents.capturePage(undefined, { stayHidden: false, stayAwake: true }),
+ ])
+ return capture
+ },
+ on(
+ method: Method,
+ callback: (params: ProtocolMapping.Events[Method][0], sessionID?: string) => void,
+ ) {
+ const handler = (params: unknown, sessionID?: string) =>
+ callback(params as ProtocolMapping.Events[Method][0], sessionID)
+ const handlers = listeners.get(method) ?? new Set()
+ handlers.add(handler)
+ listeners.set(method, handlers)
+ return () => {
+ handlers.delete(handler)
+ if (!handlers.size) listeners.delete(method)
+ }
+ },
+ dispose() {
+ contents.debugger.off("message", receive)
+ listeners.clear()
+ },
+ }
+}
+
+export function abortError(signal: AbortSignal) {
+ if (signal.aborted) throw new Error("Browser operation was cancelled.")
+}
+
+export async function waitFor(check: () => boolean | Promise, signal: AbortSignal, timeoutMs = 10_000) {
+ const deadline = Date.now() + timeoutMs
+ while (!(await check())) {
+ abortError(signal)
+ if (Date.now() >= deadline) throw new Error(`Condition was not met within ${timeoutMs} ms.`)
+ await new Promise((resolve) => setTimeout(resolve, 50))
+ }
+ abortError(signal)
+}
diff --git a/packages/desktop/src/main/browser/diagnostics.ts b/packages/desktop/src/main/browser/diagnostics.ts
new file mode 100644
index 00000000000..d559ec83a30
--- /dev/null
+++ b/packages/desktop/src/main/browser/diagnostics.ts
@@ -0,0 +1,290 @@
+import { Browser } from "@opencode-ai/schema/browser"
+import type { Protocol } from "devtools-protocol"
+import type { Cdp } from "./cdp"
+
+type Request = {
+ info: Browser.NetworkRequest
+ nativeID: string
+ sessionID?: string
+ started: number
+ request: Pick
+ response?: Pick
+ headersTruncated: boolean
+ postDataTruncated: boolean
+ redirected?: boolean
+}
+const levels = ["debug", "info", "warning", "error"] as const
+
+export function createDiagnostics(cdp: Cdp) {
+ const messages: Browser.ConsoleEntry[] = []
+ const requests = new Map()
+ const current = new Map()
+ const scope = crypto.randomUUID()
+ let sequence = 0
+ let droppedMessages = 0
+ let droppedRequests = 0
+ const add = (
+ level: (typeof levels)[number],
+ text: string,
+ timestampMs: number,
+ source?: Browser.ConsoleEntry["source"],
+ ) => {
+ messages.push({
+ id: `${scope}:${++sequence}`,
+ timestampMs,
+ level,
+ text: text.slice(0, 2_000),
+ textTruncated: text.length > 2_000,
+ ...(source ? { source } : {}),
+ })
+ if (messages.length > 500) {
+ messages.shift()
+ droppedMessages++
+ }
+ }
+ cdp.on("Runtime.consoleAPICalled", (event) => {
+ const source = event.stackTrace?.callFrames[0]
+ add(
+ event.type === "error" || event.type === "assert"
+ ? "error"
+ : event.type === "warning"
+ ? "warning"
+ : event.type === "debug"
+ ? "debug"
+ : "info",
+ event.args
+ .map((arg) =>
+ typeof arg.value === "string"
+ ? arg.value
+ : arg.value !== undefined
+ ? JSON.stringify(arg.value)
+ : (arg.description ?? arg.unserializableValue ?? arg.type),
+ )
+ .join(" "),
+ event.timestamp,
+ source
+ ? { url: source.url.slice(0, Browser.MAX_TEXT), line: source.lineNumber + 1, column: source.columnNumber + 1 }
+ : undefined,
+ )
+ })
+ cdp.on("Runtime.exceptionThrown", (event) => {
+ const error = event.exceptionDetails
+ add(
+ "error",
+ error.exception?.description ?? error.text,
+ event.timestamp,
+ error.url ? { url: error.url, line: error.lineNumber + 1, column: error.columnNumber + 1 } : undefined,
+ )
+ })
+ cdp.on("Network.requestWillBeSent", (event, sessionID) => {
+ const key = `${sessionID ?? ""}:${event.requestId}`
+ const previous = current.get(key)
+ if (previous && event.redirectResponse) {
+ const response = trimHeaders(event.redirectResponse.headers)
+ previous.response = { mimeType: event.redirectResponse.mimeType, headers: response.headers }
+ previous.headersTruncated ||= response.truncated
+ previous.redirected = true
+ previous.info = {
+ ...previous.info,
+ state: "completed",
+ statusCode: event.redirectResponse.status,
+ durationMs: Math.max(0, (event.timestamp - previous.started) * 1000),
+ }
+ }
+ const type = (event.type ?? "other").toLowerCase()
+ const id = `${scope}:${++sequence}`
+ const headers = trimHeaders(event.request.headers)
+ const request: Request = {
+ nativeID: event.requestId,
+ sessionID,
+ started: event.timestamp,
+ request: {
+ headers: headers.headers,
+ hasPostData: event.request.hasPostData,
+ postData: event.request.postData?.slice(0, 20_000),
+ },
+ headersTruncated: headers.truncated,
+ postDataTruncated: (event.request.postData?.length ?? 0) > 20_000,
+ info: {
+ id,
+ url: event.request.url.slice(0, 16_384),
+ method: event.request.method,
+ resourceType: resourceType(type),
+ timestampMs: event.wallTime * 1000,
+ state: "pending",
+ },
+ }
+ requests.set(id, request)
+ current.set(key, request)
+ if (requests.size > 500) {
+ const first = requests.values().next().value
+ if (first) {
+ requests.delete(first.info.id)
+ if (current.get(`${first.sessionID ?? ""}:${first.nativeID}`) === first)
+ current.delete(`${first.sessionID ?? ""}:${first.nativeID}`)
+ }
+ droppedRequests++
+ }
+ })
+ cdp.on("Network.responseReceived", (event, sessionID) => {
+ const request = current.get(`${sessionID ?? ""}:${event.requestId}`)
+ if (!request) return
+ const headers = trimHeaders(event.response.headers)
+ request.response = { mimeType: event.response.mimeType, headers: headers.headers }
+ request.headersTruncated ||= headers.truncated
+ request.info = { ...request.info, statusCode: event.response.status }
+ })
+ cdp.on("Network.loadingFinished", (event, sessionID) => {
+ const request = current.get(`${sessionID ?? ""}:${event.requestId}`)
+ if (request)
+ request.info = {
+ ...request.info,
+ state: "completed",
+ durationMs: Math.max(0, (event.timestamp - request.started) * 1000),
+ }
+ })
+ cdp.on("Network.loadingFailed", (event, sessionID) => {
+ const request = current.get(`${sessionID ?? ""}:${event.requestId}`)
+ if (request)
+ request.info = {
+ ...request.info,
+ state: "failed",
+ failure: event.errorText.slice(0, 2_048),
+ durationMs: Math.max(0, (event.timestamp - request.started) * 1000),
+ }
+ })
+ return {
+ clear() {
+ messages.length = 0
+ requests.clear()
+ current.clear()
+ droppedMessages = 0
+ droppedRequests = 0
+ },
+ async enable(sessionID?: string) {
+ await cdp.send("Runtime.enable", {}, sessionID)
+ await cdp.send(
+ "Network.enable",
+ { maxTotalBufferSize: 5 * 1024 * 1024, maxResourceBufferSize: 1024 * 1024, maxPostDataSize: 20_000 },
+ sessionID,
+ )
+ },
+ console(input: Extract) {
+ const matching = messages.filter((entry) => levels.indexOf(entry.level) >= levels.indexOf(input.level ?? "info"))
+ const result = bounded(matching, input.limit ?? 100)
+ return { messages: result, truncated: matching.length > result.length, dropped: droppedMessages }
+ },
+ list(input: Extract) {
+ const matching = Array.from(requests.values())
+ .map((request) => request.info)
+ .filter(
+ (request) =>
+ (!input.urlContains || request.url.includes(input.urlContains)) &&
+ (!input.resourceType || input.resourceType === request.resourceType),
+ )
+ const result = bounded(matching, input.limit ?? 100)
+ return { requests: result, truncated: matching.length > result.length, dropped: droppedRequests }
+ },
+ async get(input: Extract) {
+ const request = requests.get(input.id)
+ if (!request) throw new Error("Request is no longer retained in this tab. Call browser.network.list.")
+ const max = input.maxBodyChars ?? 20_000
+ const text = (value: string): Browser.Body => ({
+ state: "text",
+ text: value.slice(0, max),
+ truncated: value.length > max,
+ })
+ const responseBody = async (): Promise => {
+ if (!input.includeBody) return { state: "notRequested" }
+ if (request.info.state === "pending") return { state: "pending" }
+ if (request.redirected || !request.response) return { state: "unavailable", reason: "notCaptured" }
+ if (
+ !/^(text\/|application\/(json|.*\+json|javascript|xml|.*\+xml|x-www-form-urlencoded))/i.test(
+ request.response.mimeType,
+ )
+ )
+ return { state: "unavailable", reason: "binary" }
+ const body = await cdp
+ .send("Network.getResponseBody", { requestId: request.nativeID }, request.sessionID)
+ .catch(() => undefined)
+ if (!body) return { state: "unavailable", reason: "backendUnavailable" }
+ const value = body.base64Encoded ? Buffer.from(body.body, "base64").toString("utf8") : body.body
+ return value.length ? text(value) : { state: "empty" }
+ }
+ const requestBody: Browser.Body = !input.includeBody
+ ? { state: "notRequested" }
+ : request.request.postData !== undefined
+ ? {
+ state: "text",
+ text: request.request.postData.slice(0, max),
+ truncated: request.postDataTruncated || request.request.postData.length > max,
+ }
+ : request.request.hasPostData
+ ? { state: "unavailable", reason: "notCaptured" }
+ : { state: "empty" }
+ return {
+ request: request.info,
+ requestHeaders: headerEntries(request.request.headers),
+ responseHeaders: headerEntries(request.response?.headers ?? {}),
+ headersTruncated: request.headersTruncated,
+ requestBody,
+ responseBody: await responseBody(),
+ }
+ },
+ }
+}
+
+function resourceType(type: string): Browser.ResourceType {
+ switch (type) {
+ case "document":
+ case "stylesheet":
+ case "image":
+ case "media":
+ case "font":
+ case "script":
+ case "xhr":
+ case "fetch":
+ case "eventsource":
+ case "websocket":
+ case "manifest":
+ return type
+ default:
+ return "other"
+ }
+}
+
+function trimHeaders(headers: Protocol.Network.Headers) {
+ const entries = Object.entries(headers)
+ const kept: [string, string][] = []
+ let size = 0
+ let truncated = entries.length > 100
+ for (const [key, value] of entries.slice(0, 100)) {
+ const name = key.slice(0, 2_048)
+ const text = String(value)
+ const remaining = Math.max(0, 16_000 - size - name.length)
+ if (!remaining) {
+ truncated = true
+ break
+ }
+ const bounded = text.slice(0, Math.min(2_000, remaining))
+ truncated ||= bounded.length < text.length || name.length < key.length
+ kept.push([name, bounded])
+ size += name.length + bounded.length
+ }
+ return { headers: Object.fromEntries(kept), truncated }
+}
+
+function bounded- (items: readonly Item[], limit: number) {
+ const selected: Item[] = []
+ let size = 0
+ for (const item of items.slice(-limit).reverse()) {
+ size += JSON.stringify(item).length
+ if (size > Browser.MAX_TEXT) break
+ selected.push(item)
+ }
+ return selected.reverse()
+}
+
+function headerEntries(headers: Protocol.Network.Headers) {
+ return Object.entries(headers).map(([name, value]) => ({ name, value: String(value) }))
+}
diff --git a/packages/desktop/src/main/browser/files.ts b/packages/desktop/src/main/browser/files.ts
new file mode 100644
index 00000000000..792c3988746
--- /dev/null
+++ b/packages/desktop/src/main/browser/files.ts
@@ -0,0 +1,67 @@
+import { Browser } from "@opencode-ai/schema/browser"
+import { mkdir, readFile, stat, writeFile, rm } from "node:fs/promises"
+import { mkdirSync } from "node:fs"
+import { tmpdir } from "node:os"
+import path from "node:path"
+
+export type BrowserFiles = ReturnType
+
+export function createBrowserFiles() {
+ const directory = path.join(tmpdir(), `opencode-browser-client-${crypto.randomUUID()}`)
+ const files = new Map<
+ Browser.FileID,
+ {
+ id: Browser.FileID
+ name: string
+ mime: string
+ bytes: number
+ state: "pending" | "completed" | "failed"
+ path: string
+ }
+ >()
+ const ready = mkdir(directory, { recursive: true })
+ return {
+ directory,
+ ready,
+ list: () => Array.from(files.values()).map(({ path: _path, ...file }) => file),
+ add(name: string, mime: string) {
+ const id = Browser.FileID.make(`file_${crypto.randomUUID()}`)
+ const target = path.join(directory, id)
+ // setSavePath must run during Electron's synchronous will-download callback.
+ mkdirSync(target, { recursive: true })
+ const file = {
+ id,
+ name: name.slice(0, 2_048),
+ mime,
+ bytes: 0,
+ state: "pending" as "pending" | "completed" | "failed",
+ path: path.join(target, name.replace(/[^a-zA-Z0-9._-]/g, "_").slice(-120) || "file"),
+ }
+ files.set(id, file)
+ return file
+ },
+ async save(name: string, mime: string, data: Uint8Array) {
+ if (data.byteLength > Browser.MAX_FILE_BYTES)
+ throw new Error("File exceeds the 5 MiB transfer limit. Capture a smaller file.")
+ await ready
+ const file = this.add(name, mime)
+ await writeFile(file.path, data)
+ file.bytes = data.byteLength
+ file.state = "completed"
+ return file.id
+ },
+ get(id: Browser.FileID) {
+ const file = files.get(id)
+ if (!file || file.state !== "completed")
+ throw new Error("File is not available in this tab. Call browser.files.list.")
+ return file
+ },
+ async transfer(id: Browser.FileID): Promise {
+ const file = this.get(id)
+ if ((await stat(file.path)).size > Browser.MAX_FILE_BYTES)
+ throw new Error("File exceeds the 5 MiB transfer limit.")
+ return { id, name: file.name, mime: file.mime, data: new Uint8Array(await readFile(file.path)) }
+ },
+ dispose: () => ready.then(() => rm(directory, { recursive: true, force: true })),
+ }
+}
diff --git a/packages/desktop/src/main/browser/lighthouse.ts b/packages/desktop/src/main/browser/lighthouse.ts
new file mode 100644
index 00000000000..81321444961
--- /dev/null
+++ b/packages/desktop/src/main/browser/lighthouse.ts
@@ -0,0 +1,80 @@
+import type { WebContents } from "electron"
+import type { Page } from "puppeteer-core"
+import { EventEmitter } from "node:events"
+import type { BrowserFiles } from "./files"
+import type { Cdp } from "./cdp"
+
+export async function audit(contents: WebContents, files: BrowserFiles, cdp: Cdp) {
+ const { snapshot, generateReport } = await import("lighthouse")
+ const info = (await contents.debugger.sendCommand("Target.getTargetInfo")) as { targetInfo: { targetId: string } }
+ const sessions = new Map>()
+ function session(id: string) {
+ const emitter = new EventEmitter()
+ const value = Object.assign(emitter, {
+ id: () => id,
+ send: (method: string, params?: object) => cdp.send(method as Parameters[0], params, id),
+ detach: async () => {
+ sessions.delete(id)
+ await contents.debugger.sendCommand("Target.detachFromTarget", { sessionId: id })
+ },
+ })
+ sessions.set(id, value)
+ return value
+ }
+ const event = (_event: Electron.Event, method: string, params: unknown, sessionID?: string) => {
+ const owner = sessionID ? sessions.get(sessionID) : undefined
+ if (!owner) return
+ if (method === "Target.attachedToTarget") {
+ const child = params as { sessionId: string }
+ owner.emit("sessionattached", session(child.sessionId))
+ }
+ owner.emit(method, params)
+ owner.emit("*", method, params)
+ }
+ contents.debugger.on("message", event)
+ try {
+ const attached = (await contents.debugger.sendCommand("Target.attachToTarget", {
+ targetId: info.targetInfo.targetId,
+ flatten: true,
+ })) as { sessionId: string }
+ const root = session(attached.sessionId)
+ // Lighthouse's snapshot driver uses only url() and target().createCDPSession().
+ // Adapt that narrow boundary to Electron instead of exposing a browser-wide
+ // Puppeteer connection or emulating unsupported Browser/Target commands.
+ const page = {
+ url: () => contents.getURL(),
+ target: () => ({ createCDPSession: async () => root }),
+ } as unknown as Page
+ // Our screenshot tool handles captures separately. Lighthouse's screenshot
+ // gatherer resizes the viewport and waits for frames that hidden views may not paint.
+ const result = await snapshot(page, {
+ flags: {
+ onlyCategories: ["accessibility", "seo", "best-practices"],
+ formFactor: "desktop",
+ screenEmulation: { disabled: true },
+ throttlingMethod: "provided",
+ disableStorageReset: true,
+ disableFullPageScreenshot: true,
+ },
+ })
+ if (!result) throw new Error("Lighthouse did not produce a report.")
+ return {
+ scores: Object.values(result.lhr.categories).map((category) => ({
+ id: category.id,
+ title: category.title,
+ score: category.score,
+ })),
+ failures: Object.values(result.lhr.audits)
+ .filter((audit) => audit.score !== null && audit.score < 1)
+ .map((audit) => ({ id: audit.id, title: audit.title, description: audit.description }))
+ .slice(0, 100),
+ files: await Promise.all([
+ files.save("lighthouse.json", "application/json", Buffer.from(generateReport(result.lhr, "json"))),
+ files.save("lighthouse.html", "text/html", Buffer.from(generateReport(result.lhr, "html"))),
+ ]),
+ }
+ } finally {
+ contents.debugger.off("message", event)
+ await Promise.all(Array.from(sessions.values(), (session) => session.detach().catch(() => undefined)))
+ }
+}
diff --git a/packages/desktop/src/main/browser/profiling.ts b/packages/desktop/src/main/browser/profiling.ts
new file mode 100644
index 00000000000..54e47c07e8b
--- /dev/null
+++ b/packages/desktop/src/main/browser/profiling.ts
@@ -0,0 +1,218 @@
+import type { WebContents } from "electron"
+import { Browser } from "@opencode-ai/schema/browser"
+import { gzipSync, gunzipSync } from "node:zlib"
+import { readFile } from "node:fs/promises"
+import { Schema } from "effect"
+import type { Cdp } from "./cdp"
+import type { BrowserFiles } from "./files"
+import { analyzeCpu, analyzeTrace, parseHeap } from "./analysis"
+
+let recording:
+ | {
+ owner: WebContents
+ pid: number
+ started: number
+ timer?: ReturnType
+ finish: () => Promise<{ id: Browser.FileID; durationMs: number; incomplete: boolean }>
+ }
+ | undefined
+
+export function createProfiling(contents: WebContents, cdp: Cdp, files: BrowserFiles) {
+ let trace: Promise<{ id: Browser.FileID; durationMs: number; incomplete: boolean }> | undefined
+ let cpu:
+ | {
+ started: number
+ timer?: ReturnType
+ result?: Promise<{ id: Browser.FileID; durationMs: number }>
+ }
+ | undefined
+ let takingHeap = false
+ const json = async (id: Browser.FileID) => {
+ const file = files.get(id)
+ const data = await readFile(file.path)
+ return Schema.decodeUnknownSync(Schema.fromJsonString(Schema.Unknown))(
+ (file.name.endsWith(".gz") ? gunzipSync(data, { maxOutputLength: 128 * 1024 * 1024 }) : data).toString("utf8"),
+ )
+ }
+ const stopCpu = () => {
+ if (!cpu) return Promise.reject(new Error("No CPU profile has been started in this tab."))
+ if (cpu.result) return cpu.result
+ clearTimeout(cpu.timer)
+ cpu.result = cdp.send("Profiler.stop").then(async ({ profile }) => ({
+ id: await files.save("profile.cpuprofile", "application/json", Buffer.from(JSON.stringify(profile))),
+ durationMs: (profile.endTime - profile.startTime) / 1000,
+ }))
+ return cpu.result
+ }
+ return {
+ async startTrace(durationMs = 10_000) {
+ if (recording) throw new Error("Another performance trace is active. Do not stop another tab's recording.")
+ const complete = Promise.withResolvers<{ stream?: string; dataLossOccurred: boolean }>()
+ const off = cdp.on("Tracing.tracingComplete", (event) => complete.resolve(event))
+ const owner = {
+ owner: contents,
+ pid: contents.getOSProcessId(),
+ started: performance.now(),
+ timer: undefined as ReturnType | undefined,
+ finish: () => {
+ if (trace) return trace
+ trace = (async () => {
+ clearTimeout(owner.timer)
+ const durationMs = performance.now() - owner.started
+ const deadline = Promise.withResolvers()
+ const timeout = setTimeout(
+ () => deadline.reject(new Error("Chromium did not finish flushing the trace within 10 seconds.")),
+ 10_000,
+ )
+ try {
+ const result = await Promise.race([
+ cdp.send("Tracing.end").then(() => complete.promise),
+ deadline.promise,
+ ])
+ if (!result.stream) throw new Error("Chromium did not return a trace stream.")
+ const chunks: Buffer[] = []
+ let bytes = 0
+ try {
+ while (true) {
+ const part = await cdp.send("IO.read", { handle: result.stream, size: 256 * 1024 })
+ const buffer = Buffer.from(part.data, part.base64Encoded ? "base64" : "utf8")
+ bytes += buffer.byteLength
+ if (bytes > 64 * 1024 * 1024) throw new Error("Trace exceeded its 64 MiB local capture limit.")
+ chunks.push(buffer)
+ if (part.eof) break
+ }
+ } finally {
+ await cdp.send("IO.close", { handle: result.stream })
+ }
+ const raw = Schema.decodeUnknownSync(
+ Schema.fromJsonString(
+ Schema.Struct({ traceEvents: Schema.Array(Schema.Record(Schema.String, Schema.Json)) }),
+ ),
+ )(Buffer.concat(chunks).toString("utf8"))
+ // A CDP trace is browser-wide. Export only this renderer process, never
+ // the application renderer or another session's process metadata.
+ const traceEvents = raw.traceEvents.filter((event) => event.pid === owner.pid)
+ const id = await files.save(
+ "trace.json.gz",
+ "application/gzip",
+ gzipSync(
+ JSON.stringify({
+ traceEvents,
+ metadata: { source: "opencode", scope: "renderer-process", processId: owner.pid },
+ }),
+ ),
+ )
+ return {
+ id,
+ durationMs,
+ incomplete:
+ result.dataLossOccurred || contents.isDestroyed() || contents.getOSProcessId() !== owner.pid,
+ }
+ } finally {
+ clearTimeout(timeout)
+ off()
+ if (recording === owner) recording = undefined
+ }
+ })()
+ return trace
+ },
+ }
+ recording = owner
+ trace = undefined
+ try {
+ await cdp.send("Tracing.start", {
+ transferMode: "ReturnAsStream",
+ traceConfig: {
+ recordMode: "recordUntilFull",
+ traceBufferSizeInKb: 8192,
+ includedCategories: [
+ "devtools.timeline",
+ "disabled-by-default-devtools.timeline",
+ "disabled-by-default-devtools.timeline.stack",
+ "v8.execute",
+ "blink.user_timing",
+ "disabled-by-default-v8.cpu_profiler",
+ ],
+ excludedCategories: ["*"],
+ },
+ })
+ owner.timer = setTimeout(() => {
+ void owner.finish().catch(() => undefined)
+ }, durationMs)
+ } catch (error) {
+ off()
+ if (recording === owner) recording = undefined
+ throw error
+ }
+ },
+ stopTrace() {
+ if (recording?.owner === contents) return recording.finish()
+ if (trace) return trace
+ return Promise.reject(new Error("This tab has no performance trace to stop."))
+ },
+ async startCpu() {
+ if (cpu && !cpu.result) throw new Error("A CPU profile is already active in this tab.")
+ await cdp.send("Profiler.enable")
+ await cdp.send("Profiler.start")
+ cpu = { started: Date.now() }
+ cpu.timer = setTimeout(() => {
+ void stopCpu().catch(() => undefined)
+ }, 30_000)
+ },
+ stopCpu,
+ async heap() {
+ if (takingHeap) throw new Error("A heap snapshot is already being captured in this tab.")
+ takingHeap = true
+ const chunks: string[] = []
+ let size = 0
+ let overflow = false
+ const off = cdp.on("HeapProfiler.addHeapSnapshotChunk", ({ chunk }) => {
+ size += Buffer.byteLength(chunk)
+ if (size > 128 * 1024 * 1024) overflow = true
+ if (!overflow) chunks.push(chunk)
+ })
+ try {
+ await cdp.send("HeapProfiler.enable")
+ await cdp.send("HeapProfiler.takeHeapSnapshot", { reportProgress: false })
+ } finally {
+ takingHeap = false
+ off()
+ }
+ if (overflow) throw new Error("Heap snapshot exceeded the 128 MiB local capture limit.")
+ return files.save("heap.heapsnapshot.gz", "application/gzip", gzipSync(chunks.join("")))
+ },
+ async analyze(
+ action: Extract<
+ Browser.Action,
+ { type: "trace.analyze" | "cpu.analyze" | "heap.summary" | "heap.query" | "heap.object" | "heap.compare" }
+ >,
+ ) {
+ if (action.type === "heap.compare") {
+ const before = parseHeap(await json(action.before)).classes
+ const after = parseHeap(await json(action.after)).classes
+ return {
+ classes: Array.from(new Set([...before.keys(), ...after.keys()]))
+ .map((name) => ({
+ name,
+ countDelta: (after.get(name)?.count ?? 0) - (before.get(name)?.count ?? 0),
+ bytesDelta: (after.get(name)?.bytes ?? 0) - (before.get(name)?.bytes ?? 0),
+ }))
+ .filter((item) => item.countDelta || item.bytesDelta)
+ .sort((a, b) => Math.abs(b.bytesDelta) - Math.abs(a.bytesDelta))
+ .slice(0, action.limit ?? 100),
+ }
+ }
+ const value = await json(action.fileID)
+ if (action.type === "trace.analyze") return analyzeTrace(value, action.limit)
+ if (action.type === "cpu.analyze") return analyzeCpu(value, action.limit)
+ const heap = parseHeap(value)
+ if (action.type === "heap.summary") return heap.summary(action.limit)
+ if (action.type === "heap.query") return heap.query(action.name, action.limit)
+ return heap.object(action.id, action.limit)
+ },
+ async dispose() {
+ if (recording?.owner === contents) await recording.finish().catch(() => undefined)
+ if (cpu && !cpu.result) await stopCpu().catch(() => undefined)
+ },
+ }
+}
diff --git a/packages/desktop/src/renderer/api.ts b/packages/desktop/src/renderer/api.ts
index 44fe3ab9676..ce3a39965e1 100644
--- a/packages/desktop/src/renderer/api.ts
+++ b/packages/desktop/src/renderer/api.ts
@@ -28,7 +28,7 @@ export const api: ElectronAPI = {
browserPane: {
request: (request) => invoke("BrowserPane", { request }),
send: (request) => send("BrowserPane", { request }),
- onEvent: (callback) => listen("BrowserPaneEvent", (value) => callback(mutable(value))),
+ onEvent: (callback) => listen("BrowserPaneEvent", (value) => callback(value)),
},
wslServers: {
getState: () => invoke("WslGetState").then(mutable),
diff --git a/packages/desktop/src/shared/ipc-rpc/browser.ts b/packages/desktop/src/shared/ipc-rpc/browser.ts
index db5aca70d5b..2546447cfb1 100644
--- a/packages/desktop/src/shared/ipc-rpc/browser.ts
+++ b/packages/desktop/src/shared/ipc-rpc/browser.ts
@@ -11,7 +11,7 @@ const endpoint = Schema.Struct({
})
const target = Schema.Struct({ sessionID: text(256).check(Schema.isStartsWith("ses")), endpoint })
const bounds = Schema.Struct({ x: Schema.Finite, y: Schema.Finite, width: Schema.Finite, height: Schema.Finite })
-const layout = Schema.Struct({ visible: Schema.Boolean, bounds: Schema.optionalKey(bounds) })
+const layout = Schema.Struct({ tabID: Browser.TabID, visible: Schema.Boolean, bounds: Schema.optionalKey(bounds) })
export const BrowserPaneRequestSchema = Schema.Union([
Schema.Struct({ type: Schema.Literal("register"), bindingID, target }),
Schema.Struct({ type: Schema.Literal("layout"), bindingID, layout: Schema.optionalKey(layout) }),
@@ -21,7 +21,7 @@ export const BrowserPaneRequestSchema = Schema.Union([
export type BrowserPaneRequest = Schema.Schema.Type
export const BrowserPaneEventSchema = Schema.Union([
- Schema.Struct({ type: Schema.Literal("open") }),
+ Schema.Struct({ type: Schema.Literal("focus"), tabID: Browser.TabID }),
Schema.Struct({
type: Schema.Literal("state"),
state: Schema.NullOr(Browser.State),
diff --git a/packages/desktop/test/browser-analysis.test.ts b/packages/desktop/test/browser-analysis.test.ts
new file mode 100644
index 00000000000..974e01be2d6
--- /dev/null
+++ b/packages/desktop/test/browser-analysis.test.ts
@@ -0,0 +1,58 @@
+import { expect, test } from "bun:test"
+import { analyzeCpu, analyzeTrace, parseHeap } from "../src/main/browser/analysis"
+
+test("trace analysis reports observed durations without inventing Web Vitals", () => {
+ const result = analyzeTrace({
+ traceEvents: [
+ { name: "RunTask", ph: "X", dur: 75_000 },
+ { name: "Paint", ph: "X", dur: 2_500 },
+ { name: "Paint", ph: "X", dur: 1_000 },
+ { name: "marker", ph: "i" },
+ ],
+ })
+ expect(result.metrics).toEqual([
+ { name: "recordedEvents", value: 4, unit: "count" },
+ { name: "longTasks", value: 1, unit: "count" },
+ { name: "longTaskBlocking", value: 25, unit: "ms" },
+ ])
+ expect(result.events).toContainEqual({ name: "Paint", count: 2, totalMs: 3.5, maxMs: 2.5 })
+})
+
+test("CPU analysis attributes sample intervals to their functions", () => {
+ const result = analyzeCpu({
+ startTime: 0,
+ endTime: 6000,
+ nodes: [
+ { id: 1, callFrame: { functionName: "first", url: "a.js", lineNumber: 0 } },
+ { id: 2, callFrame: { functionName: "second", url: "b.js", lineNumber: 2 } },
+ ],
+ samples: [1, 2, 1],
+ timeDeltas: [1000, 2000, 3000],
+ })
+ expect(result.durationMs).toBe(6)
+ expect(result.functions).toEqual([
+ { name: "first", url: "a.js", line: 1, selfMs: 4 },
+ { name: "second", url: "b.js", line: 3, selfMs: 2 },
+ ])
+})
+
+test("heap queries and object links use snapshot IDs and shallow sizes", () => {
+ const heap = parseHeap({
+ snapshot: {
+ meta: {
+ node_fields: ["type", "name", "id", "self_size", "edge_count"],
+ node_types: [["object"], "string", "number", "number", "number"],
+ edge_fields: ["type", "name_or_index", "to_node"],
+ edge_types: [["property"], "string", "node"],
+ },
+ },
+ nodes: [0, 0, 1, 10, 1, 0, 1, 3, 20, 0],
+ edges: [0, 2, 5],
+ strings: ["root", "child", "next"],
+ })
+ expect(heap.summary()).toMatchObject({ nodes: 2, edges: 1, selfBytes: 30 })
+ expect(heap.query("", 1)).toMatchObject({ nodes: [{ id: 3, selfBytes: 20 }], truncated: true })
+ expect(heap.object(1).references).toMatchObject([{ name: "next", node: { id: 3 } }])
+ expect(heap.object(3).retainers).toMatchObject([{ name: "next", node: { id: 1 } }])
+ expect(() => heap.object(99)).toThrow("Object ID was not found")
+})
diff --git a/packages/desktop/test/browser-native.test.ts b/packages/desktop/test/browser-native.test.ts
new file mode 100644
index 00000000000..c5a64331318
--- /dev/null
+++ b/packages/desktop/test/browser-native.test.ts
@@ -0,0 +1,105 @@
+import { test, expect } from "bun:test"
+import { mkdir, mkdtemp, rm } from "node:fs/promises"
+import path from "node:path"
+import { tmpdir } from "node:os"
+
+test("browser suite over authenticated HTTP RPC with separate server and desktop storage", async () => {
+ const root = await mkdtemp(path.join(tmpdir(), "opencode-browser-suite-"))
+ const output = await mkdtemp(path.resolve(import.meta.dir, "../node_modules/.browser-suite-"))
+ const names = ["home", "config", "data", "cache", "state", "server-files", "client-files", "electron-data"]
+ await Promise.all(names.map((name) => mkdir(path.join(root, name), { recursive: true })))
+ const built = await Bun.build({
+ entrypoints: [path.join(import.meta.dir, "browser/native.ts")],
+ outdir: output,
+ naming: "native.mjs",
+ target: "node",
+ format: "esm",
+ external: ["electron", "lighthouse", "puppeteer-core"],
+ })
+ if (!built.success) throw new AggregateError(built.logs)
+ const environment = {
+ ...process.env,
+ OPENCODE_TEST_HOME: path.join(root, "home"),
+ OPENCODE_CONFIG_DIR: path.join(root, "config"),
+ XDG_CONFIG_HOME: path.join(root, "config"),
+ XDG_DATA_HOME: path.join(root, "data"),
+ XDG_CACHE_HOME: path.join(root, "cache"),
+ XDG_STATE_HOME: path.join(root, "state"),
+ SMOKE_PASSWORD: crypto.randomUUID(),
+ SMOKE_SERVER_FILES: path.join(root, "server-files"),
+ SMOKE_ROOT: root,
+ ELECTRON_RUN_AS_NODE: undefined,
+ }
+ const ready = Promise.withResolvers()
+ const server = Bun.spawn([process.execPath, path.join(import.meta.dir, "browser/server.ts")], {
+ cwd: root,
+ env: { ...environment, TMP: path.join(root, "server-files"), TEMP: path.join(root, "server-files") },
+ stdout: "inherit",
+ stderr: "inherit",
+ ipc(message: unknown) {
+ if (typeof message === "string") ready.resolve(message)
+ },
+ })
+ void server.exited.then((code) => ready.reject(new Error(`Fixture server exited: ${code}`)))
+ let native: ReturnType | undefined
+ let proxy: Bun.Server | undefined
+ try {
+ const url = await Promise.race([
+ ready.promise,
+ new Promise((_, reject) =>
+ setTimeout(() => reject(new Error("Fixture server startup timed out")), 30_000).unref(),
+ ),
+ ])
+ // Exercise the real HTTP boundary with delayed state acknowledgments, as on
+ // a remote server. Neither endpoint can rely on synchronous UI/state updates.
+ proxy = Bun.serve({
+ hostname: "127.0.0.1",
+ port: 0,
+ idleTimeout: 0,
+ async fetch(request) {
+ const incoming = new URL(request.url)
+ if (incoming.pathname.endsWith("/experimental.browser/state"))
+ await new Promise((resolve) => setTimeout(resolve, 75))
+ return fetch(new Request(new URL(incoming.pathname + incoming.search, url), request), { decompress: false })
+ },
+ })
+ const electron: unknown = (await import("electron")).default
+ if (typeof electron !== "string") throw new Error("Electron binary path is unavailable.")
+ native = Bun.spawn([electron, path.join(output, "native.mjs")], {
+ cwd: output,
+ env: {
+ ...environment,
+ SMOKE_URL: proxy.url.href,
+ TMP: path.join(root, "client-files"),
+ TEMP: path.join(root, "client-files"),
+ },
+ stdout: "inherit",
+ stderr: "inherit",
+ })
+ expect(
+ await Promise.race([
+ native.exited,
+ new Promise((_, reject) =>
+ setTimeout(() => reject(new Error("Native browser suite timed out")), 140_000).unref(),
+ ),
+ ]),
+ ).toBe(0)
+ } finally {
+ if (native?.exitCode === null) {
+ native.kill()
+ await native.exited
+ }
+ if (server.exitCode === null) server.send("stop")
+ proxy?.stop(true)
+ await Promise.race([
+ server.exited,
+ new Promise((resolve) =>
+ setTimeout(() => {
+ if (server.exitCode === null) server.kill()
+ resolve()
+ }, 10_000).unref(),
+ ),
+ ])
+ await Promise.all([rm(root, { recursive: true, force: true }), rm(output, { recursive: true, force: true })])
+ }
+}, 180_000)
diff --git a/packages/desktop/test/browser/contract.ts b/packages/desktop/test/browser/contract.ts
new file mode 100644
index 00000000000..7b7f8a95925
--- /dev/null
+++ b/packages/desktop/test/browser/contract.ts
@@ -0,0 +1,16 @@
+import { Rpc } from "@opencode-ai/schema/rpc"
+import { Session } from "@opencode-ai/schema/session"
+import { Schema } from "effect"
+
+export const Smoke = Rpc.define({
+ id: "browser.smoke",
+ methods: {
+ execute: {
+ input: Schema.Struct({ sessionID: Session.ID, code: Schema.String }),
+ output: Schema.Struct({ output: Schema.String, error: Schema.optionalKey(Schema.Boolean) }),
+ },
+ write: { input: Schema.Struct({ text: Schema.String }), output: Schema.String },
+ read: { input: Schema.Struct({ path: Schema.String }), output: Schema.String },
+ },
+ events: {},
+})
diff --git a/packages/desktop/test/browser/native.ts b/packages/desktop/test/browser/native.ts
new file mode 100644
index 00000000000..44cad4cada7
--- /dev/null
+++ b/packages/desktop/test/browser/native.ts
@@ -0,0 +1,313 @@
+import assert from "node:assert/strict"
+import { createServer } from "node:http"
+import { once } from "node:events"
+import path from "node:path"
+import { app, BrowserWindow } from "electron"
+import { Browser } from "@opencode-ai/schema/browser"
+import { OpenCode } from "@opencode-ai/client"
+import { Effect, Fiber, Schema, Stream } from "effect"
+import { createBrowserPane } from "../../src/main/browser-pane"
+import { bindIpcEvents, ipcEventStream } from "../../src/main/ipc-events"
+import { Smoke } from "./contract"
+
+type Output = Schema.Schema.Type["output"]>
+
+// Fail the disposable fixture in stderr instead of opening Electron's error dialog.
+process.on("uncaughtException", (error) => {
+ console.error(error)
+ app.exit(1)
+})
+process.on("unhandledRejection", (error) => {
+ console.error(error)
+ app.exit(1)
+})
+
+async function main() {
+ const root = process.env.SMOKE_ROOT!
+ app.setPath("userData", path.join(root, "electron-data"))
+ app.on("window-all-closed", () => {})
+ await app.whenReady()
+ const web = createServer((request, response) => {
+ if (request.url === "/api/test") {
+ response.setHeader("content-type", "application/json")
+ response.end('{"message":"network body"}')
+ return
+ }
+ if (request.url === "/missing") {
+ response.writeHead(404, { "content-type": "text/plain" })
+ response.end("not found")
+ return
+ }
+ if (request.url === "/download") {
+ response.setHeader("content-disposition", 'attachment; filename="report.txt"')
+ response.setHeader("content-type", "text/plain")
+ response.end("desktop download bytes")
+ return
+ }
+ if (request.url === "/frame") {
+ response.setHeader("content-type", "text/html")
+ response.end("")
+ return
+ }
+ response.setHeader("content-type", "text/html")
+ response.end(
+ `Browser suite
Browser suite
DownloadPopupScroll content
`,
+ )
+ })
+ await once(web.listen(0, "127.0.0.1"), "listening")
+ const address = web.address()
+ assert(address && typeof address !== "string")
+ const fixture = `http://127.0.0.1:${address.port}`
+ const client = OpenCode.make({
+ baseUrl: process.env.SMOKE_URL!,
+ headers: { authorization: `Basic ${Buffer.from(`opencode:${process.env.SMOKE_PASSWORD}`).toString("base64")}` },
+ })
+ const location = { directory: process.env.SMOKE_SERVER_FILES! }
+ const rpc = client.rpc(Smoke)
+ const session = await client.session.create({ title: "Browser suite", location })
+ const pane = createBrowserPane()
+ const win = new BrowserWindow({ show: false, width: 1100, height: 800, webPreferences: { sandbox: true } })
+ const readyToShow = once(win, "ready-to-show")
+ await win.loadURL("about:blank")
+ await readyToShow
+ win.setTitle("Browser suite (isolated test)")
+ win.showInactive()
+ await win.webContents.executeJavaScript(
+ "new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(() => resolve(null))))",
+ )
+ const ipcErrors: string[] = []
+ const inventories = new Map()
+ const unbind = await Effect.runPromise(bindIpcEvents(win.webContents.id))
+ const events = Effect.runFork(
+ ipcEventStream(win.webContents.id).pipe(
+ Stream.runForEach((event) =>
+ Effect.sync(() => {
+ if (event._tag !== "BrowserPaneEvent") return
+ if (event.event.type === "state") {
+ inventories.set(event.bindingID, event.event.state)
+ return
+ }
+ if (!inventories.get(event.bindingID)?.tabs.some((tab) => tab.id === event.event.tabID))
+ ipcErrors.push("Focus arrived before its tab inventory")
+ }),
+ ),
+ ),
+ )
+ const visited = new Set()
+ async function call(
+ name: Name,
+ input: Omit, "type">,
+ ): Promise> {
+ console.log(`BROWSER ${name}`)
+ const result = await rpc.execute(
+ { sessionID: session.id, code: `return await tools.browser.${name}(${JSON.stringify(input)})` },
+ { location },
+ )
+ assert(!result.error, result.output)
+ const operation = Browser.Operations.find((operation) => operation.name === name)
+ assert(operation)
+ visited.add(name)
+ return Schema.decodeUnknownSync(operation.output)(JSON.parse(result.output)) as Output
+ }
+ try {
+ await pane.register(win, "suite", {
+ sessionID: session.id,
+ endpoint: { url: process.env.SMOKE_URL!, password: process.env.SMOKE_PASSWORD },
+ })
+ const first = await call("tabs.open", { url: fixture })
+ const second = await call("tabs.open", { url: `${fixture}/other`, focus: false })
+ assert.equal((await call("tabs.list", {})).tabs.length, 2)
+ const tabID = first.id
+ await call("evaluate", {
+ tabID,
+ script: `(async () => {
+ const source=document.createElement('div'); source.draggable=true; source.tabIndex=0; source.setAttribute('role','button'); source.textContent='Drag source'; source.ondragstart=e=>e.dataTransfer.setData('text/plain','element dropped'); document.body.prepend(source);
+ const drop=document.createElement('div'); drop.tabIndex=0; drop.setAttribute('role','button'); drop.textContent='Drop target'; drop.style.cssText='height:40px;width:300px;background:#ddd'; drop.ondragover=e=>e.preventDefault(); drop.ondrop=async e=>{e.preventDefault();document.querySelector('output').textContent=e.dataTransfer.files.length?await e.dataTransfer.files[0].text():e.dataTransfer.getData('text/plain')}; document.body.prepend(drop);
+ await new Promise(resolve=>{const frame=document.querySelector('iframe'); frame.onload=()=>resolve(null); frame.src=${JSON.stringify(`http://localhost:${address.port}/frame`)};});
+ })()`,
+ })
+ pane.layout(win, "suite", { tabID, visible: true, bounds: { x: 0, y: 0, width: 1000, height: 700 } })
+ await call("tabs.focus", { tabID: second.id })
+ pane.layout(win, "suite", { tabID: second.id, visible: true, bounds: { x: 0, y: 0, width: 1000, height: 700 } })
+ const snap = await call("snapshot", { tabID, boxes: true })
+ const ref = (text: string) => {
+ const match = snap.content
+ .split("\n")
+ .find((line) => /@e\d+/.test(line) && line.includes(`"${text}"`))
+ ?.match(/@e\d+/)?.[0]
+ assert(match, `Missing ${text}: ${snap.content}`)
+ return Browser.Ref.make(match)
+ }
+ await call("fill", { tabID, ref: ref("Name"), text: "remote browser" })
+ await call("hover", { tabID, ref: ref("Apply") })
+ await call("click", { tabID, ref: ref("Apply") })
+ assert.equal(
+ (await call("evaluate", { tabID, script: "document.querySelector('output').textContent" })).value,
+ "remote browser",
+ )
+ assert.equal(
+ (await call("evaluate", { tabID: second.id, script: "document.querySelector('input').value" })).value,
+ "",
+ )
+ assert.equal((await call("tabs.list", {})).focusedTabID, second.id)
+ const wrongTab = await rpc.execute(
+ {
+ sessionID: session.id,
+ code: `return await tools.browser.click({tabID:${JSON.stringify(second.id)},ref:${JSON.stringify(ref("Apply"))}})`,
+ },
+ { location },
+ )
+ assert(wrongTab.error && wrongTab.output.includes("another tab"))
+ await call("check", { tabID, ref: ref("Remember"), checked: true })
+ await call("select", { tabID, ref: ref("Color"), values: ["blue"] })
+ await call("fill_form", {
+ tabID,
+ fields: [
+ { type: "text", ref: ref("Name"), value: "batch" },
+ { type: "check", ref: ref("Remember"), checked: false },
+ ],
+ })
+ await call("press", { tabID, key: "Tab" })
+ await call("scroll", { tabID, deltaY: 100 })
+ await call("wait", { tabID, condition: "text", text: "Scroll content" })
+ await call("drag", { tabID, from: ref("Drag source"), to: ref("Drop target") })
+ assert.equal(
+ (await call("evaluate", { tabID, script: "document.querySelector('output').textContent" })).value,
+ "element dropped",
+ )
+ const frames = await call("frames", { tabID })
+ const child = frames.frames.find((frame) => frame.parentID)
+ assert(child)
+ assert.equal(
+ (await call("evaluate", { tabID, frameID: child.id, script: "document.querySelector('button').textContent" }))
+ .value,
+ "Frame button",
+ )
+ const childSnapshot = await call("snapshot", { tabID, frameID: child.id })
+ const childRef = childSnapshot.content
+ .split("\n")
+ .find((line) => line.includes('[button] "Frame button"'))
+ ?.match(/@e\d+/)?.[0]
+ assert(childRef, childSnapshot.content)
+ await call("click", { tabID, ref: Browser.Ref.make(childRef) })
+ assert.equal(
+ (await call("evaluate", { tabID, frameID: child.id, script: "document.querySelector('button').textContent" }))
+ .value,
+ "Frame clicked",
+ )
+ const found = await call("find", { tabID, text: "Apply" })
+ assert(found.content.includes("Apply"))
+ const screenshot = await call("screenshot", { tabID, fullPage: true, maxWidth: 1000 })
+ const screenshotBytes = await rpc.read({ path: screenshot.files[0].path }, { location })
+ assert(
+ Buffer.from(screenshotBytes, "base64")
+ .subarray(0, 8)
+ .equals(Buffer.from([137, 80, 78, 71, 13, 10, 26, 10])),
+ )
+ assert(screenshot.files[0].path.startsWith(process.env.SMOKE_SERVER_FILES!))
+ const logs = await call("console", { tabID, level: "debug" })
+ assert(logs.messages.some((message) => message.text.includes("fixture error")))
+ const network = await call("network.list", { tabID, urlContains: "/api/test" })
+ assert(network.requests.length)
+ const detail = await call("network.get", { tabID, id: network.requests[0].id, includeBody: true })
+ assert.equal(detail.responseBody.state, "text")
+ const upload = await rpc.write({ text: "server upload bytes" }, { location })
+ const fileSnap = await call("snapshot", { tabID })
+ const input = fileSnap.content
+ .split("\n")
+ .find((line) => line.includes('"Upload"'))
+ ?.match(/@e\d+/)?.[0]
+ assert(input, fileSnap.content)
+ await call("files.upload", { tabID, ref: Browser.Ref.make(input), paths: [upload] })
+ assert.equal(
+ (await call("evaluate", { tabID, script: "document.querySelector('input[type=file]').files[0].name" })).value,
+ "upload.txt",
+ )
+ assert.equal(
+ (await call("evaluate", { tabID, script: "document.querySelector('input[type=file]').files[0].text()" })).value,
+ "server upload bytes",
+ )
+ const drop = fileSnap.content
+ .split("\n")
+ .find((line) => line.includes('[button] "Drop target"'))
+ ?.match(/@e\d+/)?.[0]
+ assert(drop, fileSnap.content)
+ await call("files.drop", { tabID, ref: Browser.Ref.make(drop), paths: [upload] })
+ await call("wait", { tabID, condition: "text", text: "server upload bytes" })
+ await call("evaluate", { tabID, script: "document.querySelector('a[href=\"/download\"]').click()" })
+ const downloads = await until(async () => {
+ const result = await call("files.list", { tabID })
+ return result.files.find((file) => file.name === "report.txt" && file.state === "completed")
+ })
+ const download = await call("files.get", { tabID, fileID: downloads.id })
+ assert.equal(
+ Buffer.from(await rpc.read({ path: download.files[0].path }, { location }), "base64").toString(),
+ "desktop download bytes",
+ )
+ await call("evaluate", { tabID, script: "setTimeout(()=>alert('hello dialog'),0); null" })
+ await until(async () => (await call("dialog", { tabID, action: "get" })).dialog)
+ await call("dialog", { tabID, action: "dismiss" })
+ await call("evaluate", { tabID, script: "window.open('/frame'); null" })
+ await until(async () => (await call("tabs.list", {})).tabs.length === 3)
+ await call("navigate", { tabID, url: `${fixture}/next` })
+ await call("back", { tabID })
+ await call("forward", { tabID })
+ await call("trace.start", { tabID, durationMs: 30_000 })
+ await call("reload", { tabID })
+ await call("evaluate", {
+ tabID,
+ script: "performance.mark('browser-suite-marker'); let n=0; for(let i=0;i<100000;i++) n+=i; n",
+ })
+ const trace = await call("trace.stop", { tabID })
+ const traceAnalysis = await call("trace.analyze", { tabID, fileID: trace.files[0].id })
+ assert(traceAnalysis.metrics[0].value > 0)
+ await call("cpu.start", { tabID })
+ await call("evaluate", { tabID, script: "Array.from({length:100000},(_,i)=>Math.sqrt(i)).reduce((a,b)=>a+b,0)" })
+ const cpu = await call("cpu.stop", { tabID })
+ await call("cpu.analyze", { tabID, fileID: cpu.files[0].id })
+ const heap = await call("heap.snapshot", { tabID })
+ const heapID = heap.files[0].id
+ assert((await call("heap.summary", { tabID, fileID: heapID })).nodes > 0)
+ const query = await call("heap.query", { tabID, fileID: heapID, name: "Object", limit: 3 })
+ assert(query.nodes.length)
+ await call("heap.object", { tabID, fileID: heapID, id: query.nodes[0].id })
+ assert.equal((await call("heap.compare", { tabID, before: heapID, after: heapID })).classes.length, 0)
+ const audit = await call("lighthouse", { tabID })
+ assert(audit.scores.some((score) => score.id === "accessibility"))
+ await call("stop", { tabID })
+ await call("tabs.close", { tabID: second.id })
+ assert.equal((await call("tabs.list", {})).tabs.length, 2)
+ assert.deepEqual(
+ Browser.Operations.map((operation) => operation.name).filter((name) => !visited.has(name)),
+ [],
+ )
+ assert.deepEqual(ipcErrors, [])
+ console.log(
+ `PASS ${visited.size} browser operations over physical authenticated HTTP, including file bytes in both directions`,
+ )
+ } finally {
+ await pane.close(win, "suite")
+ await pane.dispose()
+ await Effect.runPromise(Fiber.interrupt(events))
+ await Effect.runPromise(unbind)
+ win.destroy()
+ web.closeAllConnections()
+ await new Promise((resolve) => web.close(() => resolve()))
+ app.quit()
+ }
+}
+
+async function until(read: () => Promise) {
+ const deadline = Date.now() + 10_000
+ while (true) {
+ const value = await read()
+ if (value) return value
+ if (Date.now() > deadline) throw new Error("Condition timed out")
+ await new Promise((resolve) => setTimeout(resolve, 50))
+ }
+}
+
+main().catch((error) => {
+ console.error(error)
+ app.exit(1)
+})
diff --git a/packages/desktop/test/browser/plugin/index.ts b/packages/desktop/test/browser/plugin/index.ts
new file mode 100644
index 00000000000..c42e8d0c6f5
--- /dev/null
+++ b/packages/desktop/test/browser/plugin/index.ts
@@ -0,0 +1,55 @@
+import { Plugin } from "@opencode-ai/plugin/effect"
+import { Agent } from "@opencode-ai/schema/agent"
+import { SessionMessage } from "@opencode-ai/schema/session-message"
+import { Tool } from "@opencode-ai/schema/tool"
+import { CodeModeTool } from "../../../../core/src/codemode/tool"
+import { execute } from "../../../../core/src/tool/runtime"
+import { Effect, Schema } from "effect"
+import path from "node:path"
+import { readFile, writeFile } from "node:fs/promises"
+import { Smoke } from "../contract"
+
+export default Plugin.define({
+ id: "browser.smoke",
+ effect: (ctx) =>
+ Effect.gen(function* () {
+ const tools = new Map()
+ yield* ctx.tool
+ .transform((editor) => {
+ editor
+ .list()
+ .filter((tool) => tool.options?.namespace?.startsWith("browser"))
+ .forEach((tool) => tools.set(tool.id, tool))
+ })
+ .pipe(Effect.orDie)
+ yield* ctx.rpc
+ .register(Smoke, {
+ execute: (input) =>
+ Effect.gen(function* () {
+ const result = yield* CodeModeTool.create({ tools }, (name, tool, input, context) =>
+ execute(tool, input, context),
+ ).execute(
+ { code: input.code },
+ {
+ sessionID: input.sessionID,
+ agent: Agent.ID.make("build"),
+ messageID: SessionMessage.ID.create(),
+ id: Tool.CallID.make(crypto.randomUUID()),
+ progress: () => Effect.void,
+ },
+ )
+ return Schema.decodeUnknownSync(
+ Schema.Struct({ output: Schema.String, error: Schema.optionalKey(Schema.Boolean) }),
+ )(result.output)
+ }).pipe(Effect.orDie),
+ write: ({ text }) =>
+ Effect.promise(async () => {
+ const file = path.join(process.env.SMOKE_SERVER_FILES!, "upload.txt")
+ await writeFile(file, text)
+ return file
+ }),
+ read: ({ path }) => Effect.promise(async () => (await readFile(path)).toString("base64")),
+ })
+ .pipe(Effect.orDie)
+ }),
+})
diff --git a/packages/desktop/test/browser/server.ts b/packages/desktop/test/browser/server.ts
new file mode 100644
index 00000000000..8224d73c075
--- /dev/null
+++ b/packages/desktop/test/browser/server.ts
@@ -0,0 +1,31 @@
+import path from "node:path"
+import { Effect } from "effect"
+import { HttpServer } from "effect/unstable/http"
+import { ServerProcess } from "../../../server/src/process"
+
+const stopped = Promise.withResolvers()
+process.on("message", (message) => {
+ if (message === "stop") stopped.resolve()
+})
+await Effect.gen(function* () {
+ const server = yield* ServerProcess.start({
+ hostname: "127.0.0.1",
+ port: 0,
+ password: process.env.SMOKE_PASSWORD,
+ app: { name: "browser-suite-test", version: "test", channel: "test" },
+ database: { path: ":memory:" },
+ models: { fetch: false },
+ fs: { filewatcher: false, fff: false },
+ config: {
+ directory: process.env.OPENCODE_CONFIG_DIR!,
+ project: false,
+ content: JSON.stringify({
+ plugins: ["-opencode.provider.*", path.join(import.meta.dir, "plugin")],
+ permissions: [{ action: "*", resource: "*", effect: "allow" }],
+ }),
+ },
+ })
+ process.send?.(HttpServer.formatAddress(server.address))
+ yield* Effect.promise(() => stopped.promise)
+}).pipe(Effect.scoped, Effect.runPromise)
+process.disconnect?.()