From 58d8f7457bb5a9b8f8e3cdc5757618f4ee77e576 Mon Sep 17 00:00:00 2001 From: Kit Langton Date: Sat, 3 Oct 2026 22:29:54 -0700 Subject: [PATCH] fix(app): load component-test modules at the URLs Vite imports them by --- packages/app/component-tests/browser-pane-restore.spec.ts | 5 ++--- packages/app/component-tests/browser-pane.spec.ts | 5 ++--- packages/app/component-tests/extension-graph.spec.ts | 5 ++--- packages/app/component-tests/extension-host.spec.ts | 5 ++--- packages/app/component-tests/timeline-virtualizer.spec.ts | 5 ++--- packages/session-ui/component-tests/basic-tool.spec.ts | 5 ++--- packages/session-ui/component-tests/markdown.spec.ts | 5 ++--- packages/session-ui/component-tests/read-image.spec.ts | 5 ++--- packages/storybook/playwright/story.d.ts | 5 +++++ packages/storybook/playwright/story.ts | 6 ++++++ 10 files changed, 27 insertions(+), 24 deletions(-) diff --git a/packages/app/component-tests/browser-pane-restore.spec.ts b/packages/app/component-tests/browser-pane-restore.spec.ts index 351494166977..3bf5a4072cd4 100644 --- a/packages/app/component-tests/browser-pane-restore.spec.ts +++ b/packages/app/component-tests/browser-pane-restore.spec.ts @@ -1,7 +1,6 @@ -import { fileURLToPath } from "node:url" -import { expect, story } from "../../storybook/playwright/story" +import { expect, sourceURL, story } from "../../storybook/playwright/story" -const source = (path: string) => `/@fs/${fileURLToPath(new URL(path, import.meta.url)).replaceAll("\\", "/")}` +const source = (path: string) => sourceURL(new URL(path, import.meta.url)) const modules = { fixture: source("../../gui-extensions/src/browser/panel.fixture.tsx"), diff --git a/packages/app/component-tests/browser-pane.spec.ts b/packages/app/component-tests/browser-pane.spec.ts index 5c04f27bbb2f..ad43dc13595d 100644 --- a/packages/app/component-tests/browser-pane.spec.ts +++ b/packages/app/component-tests/browser-pane.spec.ts @@ -1,7 +1,6 @@ -import { fileURLToPath } from "node:url" -import { expect, story } from "../../storybook/playwright/story" +import { expect, sourceURL, story } from "../../storybook/playwright/story" -const source = (path: string) => `/@fs/${fileURLToPath(new URL(path, import.meta.url)).replaceAll("\\", "/")}` +const source = (path: string) => sourceURL(new URL(path, import.meta.url)) const modules = { fixture: source("../../gui-extensions/src/browser/panel.fixture.tsx"), diff --git a/packages/app/component-tests/extension-graph.spec.ts b/packages/app/component-tests/extension-graph.spec.ts index d5a07c925cf6..3ed011d5d3e3 100644 --- a/packages/app/component-tests/extension-graph.spec.ts +++ b/packages/app/component-tests/extension-graph.spec.ts @@ -1,8 +1,7 @@ -import { fileURLToPath } from "node:url" import type { Definition } from "@opencode/gui-extensions/sdk" -import { expect, story } from "../../storybook/playwright/story" +import { expect, sourceURL, story } from "../../storybook/playwright/story" -const source = (path: string) => `/@fs/${fileURLToPath(new URL(path, import.meta.url)).replaceAll("\\", "/")}` +const source = (path: string) => sourceURL(new URL(path, import.meta.url)) const modules = { fixture: source("./extension-host.fixture.tsx"), diff --git a/packages/app/component-tests/extension-host.spec.ts b/packages/app/component-tests/extension-host.spec.ts index 0d4cf11f60cd..ba48e031e8a7 100644 --- a/packages/app/component-tests/extension-host.spec.ts +++ b/packages/app/component-tests/extension-host.spec.ts @@ -1,9 +1,8 @@ -import { fileURLToPath } from "node:url" import type { Owner } from "solid-js" import type { Context, Contract, DialogHandle, Dialogs, SessionRef } from "@opencode/gui-extensions/sdk" -import { expect, story } from "../../storybook/playwright/story" +import { expect, sourceURL, story } from "../../storybook/playwright/story" -const fixture = `/@fs/${fileURLToPath(new URL("./extension-host.fixture.tsx", import.meta.url)).replaceAll("\\", "/")}` +const fixture = sourceURL(new URL("./extension-host.fixture.tsx", import.meta.url)) /** What the scoped-registration case keeps from inside its extension. */ type Scope = { owner?: Owner | null; end: () => void; ctx?: Context } diff --git a/packages/app/component-tests/timeline-virtualizer.spec.ts b/packages/app/component-tests/timeline-virtualizer.spec.ts index acebfa88b582..824792f6750a 100644 --- a/packages/app/component-tests/timeline-virtualizer.spec.ts +++ b/packages/app/component-tests/timeline-virtualizer.spec.ts @@ -1,7 +1,6 @@ -import { fileURLToPath } from "node:url" -import { expect, story } from "../../storybook/playwright/story" +import { expect, sourceURL, story } from "../../storybook/playwright/story" -const fixture = `/@fs/${fileURLToPath(new URL("./timeline-virtualizer.fixture.tsx", import.meta.url)).replaceAll("\\", "/")}` +const fixture = sourceURL(new URL("./timeline-virtualizer.fixture.tsx", import.meta.url)) story.beforeEach(async ({ mount }) => { const component = await mount("opencode-composer-flow--mixed-attachments") diff --git a/packages/session-ui/component-tests/basic-tool.spec.ts b/packages/session-ui/component-tests/basic-tool.spec.ts index 6c065ff76dea..f03eb70d5453 100644 --- a/packages/session-ui/component-tests/basic-tool.spec.ts +++ b/packages/session-ui/component-tests/basic-tool.spec.ts @@ -1,7 +1,6 @@ -import { fileURLToPath } from "node:url" -import { expect, story } from "../../storybook/playwright/story" +import { expect, sourceURL, story } from "../../storybook/playwright/story" -const fixture = `/@fs/${fileURLToPath(new URL("./basic-tool.fixture.tsx", import.meta.url)).replaceAll("\\", "/")}` +const fixture = sourceURL(new URL("./basic-tool.fixture.tsx", import.meta.url)) story("does not render completed reasoning until it is opened", async ({ mount, page }) => { const root = await mount("current-session-timeline-rows--conversation", { diff --git a/packages/session-ui/component-tests/markdown.spec.ts b/packages/session-ui/component-tests/markdown.spec.ts index c7dc4a6781db..c9dc7b345d0f 100644 --- a/packages/session-ui/component-tests/markdown.spec.ts +++ b/packages/session-ui/component-tests/markdown.spec.ts @@ -1,13 +1,12 @@ -import { fileURLToPath } from "node:url" import type { Page } from "@playwright/test" -import { expect, story } from "../../storybook/playwright/story" +import { expect, sourceURL, story } from "../../storybook/playwright/story" const png = Buffer.from( "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAwMCAO+a4ioAAAAASUVORK5CYII=", "base64", ) -const fixture = `/@fs/${fileURLToPath(new URL("./markdown.fixture.tsx", import.meta.url)).replaceAll("\\", "/")}` +const fixture = sourceURL(new URL("./markdown.fixture.tsx", import.meta.url)) story.beforeEach(async ({ mount }) => { const root = await mount("components-markdown--complete-response") diff --git a/packages/session-ui/component-tests/read-image.spec.ts b/packages/session-ui/component-tests/read-image.spec.ts index 966d91770b24..7e7570adba0e 100644 --- a/packages/session-ui/component-tests/read-image.spec.ts +++ b/packages/session-ui/component-tests/read-image.spec.ts @@ -1,7 +1,6 @@ -import { fileURLToPath } from "node:url" -import { expect, story } from "../../storybook/playwright/story" +import { expect, sourceURL, story } from "../../storybook/playwright/story" -const fixture = `/@fs/${fileURLToPath(new URL("./read-image.fixture.tsx", import.meta.url)).replaceAll("\\", "/")}` +const fixture = sourceURL(new URL("./read-image.fixture.tsx", import.meta.url)) const png = Buffer.from( "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAwMCAO+a4ioAAAAASUVORK5CYII=", "base64", diff --git a/packages/storybook/playwright/story.d.ts b/packages/storybook/playwright/story.d.ts index 29c35dc330f8..a4da6d7e60e0 100644 --- a/packages/storybook/playwright/story.d.ts +++ b/packages/storybook/playwright/story.d.ts @@ -1,6 +1,11 @@ import { expect } from "@playwright/test"; import type { Locator } from "@playwright/test"; export { expect }; +/** + * The dev server URL of a source module, in the form Vite rewrites imports to. A different spelling, such as + * `/@fs//Users/...`, loads a second instance of the module, whose contexts the rest of the page never provides. + */ +export declare const sourceURL: (url: URL) => string; export declare const story: import("@playwright/test").TestType | undefined; diff --git a/packages/storybook/playwright/story.ts b/packages/storybook/playwright/story.ts index f11b25fa4edc..e869edc0d85c 100644 --- a/packages/storybook/playwright/story.ts +++ b/packages/storybook/playwright/story.ts @@ -3,6 +3,12 @@ import type { Locator } from "@playwright/test" export { expect } +/** + * The dev server URL of a source module, in the form Vite rewrites imports to. A different spelling, such as + * `/@fs//Users/...`, loads a second instance of the module, whose contexts the rest of the page never provides. + */ +export const sourceURL = (url: URL) => `/@fs${url.pathname}` + export const story = test.extend<{ mount: ( id: string,