diff options
| author | Shoubhit Dash <[email protected]> | 2026-04-16 17:30:14 +0530 |
|---|---|---|
| committer | Shoubhit Dash <[email protected]> | 2026-04-16 17:30:14 +0530 |
| commit | 2e18a603f0ea24154908e748493fd4bfaa74fc00 (patch) | |
| tree | b723e00af2821b213573b16fa199b64babd5f1f5 /packages/app | |
| parent | 9819eb04614fd607cacb07d754052f1531a82331 (diff) | |
| parent | 7341718f9234b0cf3a8758c87e91d2006b71bff6 (diff) | |
| download | opencode-2e18a603f0ea24154908e748493fd4bfaa74fc00.tar.gz opencode-2e18a603f0ea24154908e748493fd4bfaa74fc00.zip | |
merge dev
Diffstat (limited to 'packages/app')
132 files changed, 563 insertions, 9248 deletions
diff --git a/packages/app/README.md b/packages/app/README.md index 54d1b2861..304e272cd 100644 --- a/packages/app/README.md +++ b/packages/app/README.md @@ -31,11 +31,10 @@ Your app is ready to be deployed! ## E2E Testing -Playwright starts the Vite dev server automatically via `webServer`, and UI tests need an opencode backend (defaults to `localhost:4096`). -Use the local runner to create a temp sandbox, seed data, and run the tests. +Playwright starts the Vite dev server automatically via `webServer`, and UI tests expect an opencode backend at `localhost:4096` by default. ```bash -bunx playwright install +bunx playwright install chromium bun run test:e2e:local bun run test:e2e:local -- --grep "settings" ``` diff --git a/packages/app/e2e/AGENTS.md b/packages/app/e2e/AGENTS.md deleted file mode 100644 index bdd6ba185..000000000 --- a/packages/app/e2e/AGENTS.md +++ /dev/null @@ -1,225 +0,0 @@ -# E2E Testing Guide - -## Build/Lint/Test Commands - -```bash -# Run all e2e tests -bun test:e2e - -# Run specific test file -bun test:e2e -- app/home.spec.ts - -# Run single test by title -bun test:e2e -- -g "home renders and shows core entrypoints" - -# Run tests with UI mode (for debugging) -bun test:e2e:ui - -# Run tests locally with full server setup -bun test:e2e:local - -# View test report -bun test:e2e:report - -# Typecheck -bun typecheck -``` - -## Test Structure - -All tests live in `packages/app/e2e/`: - -``` -e2e/ -├── fixtures.ts # Test fixtures (test, expect, gotoSession, sdk) -├── actions.ts # Reusable action helpers -├── selectors.ts # DOM selectors -├── utils.ts # Utilities (serverUrl, modKey, path helpers) -└── [feature]/ - └── *.spec.ts # Test files -``` - -## Test Patterns - -### Basic Test Structure - -```typescript -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" -import { withSession } from "../actions" - -test("test description", async ({ page, sdk, gotoSession }) => { - await gotoSession() // or gotoSession(sessionID) - - // Your test code - await expect(page.locator(promptSelector)).toBeVisible() -}) -``` - -### Using Fixtures - -- `page` - Playwright page -- `llm` - Mock LLM server for queuing responses (`text`, `tool`, `toolMatch`, `textMatch`, etc.) -- `project` - Golden-path project fixture (call `project.open()` first, then use `project.sdk`, `project.prompt(...)`, `project.gotoSession(...)`, `project.trackSession(...)`) -- `sdk` - OpenCode SDK client for API calls (worker-scoped, shared directory) -- `gotoSession(sessionID?)` - Navigate to session (worker-scoped, shared directory) - -### Helper Functions - -**Actions** (`actions.ts`): - -- `openPalette(page)` - Open command palette -- `openSettings(page)` - Open settings dialog -- `closeDialog(page, dialog)` - Close any dialog -- `openSidebar(page)` / `closeSidebar(page)` - Toggle sidebar -- `waitTerminalReady(page, { term? })` - Wait for a mounted terminal to connect and finish rendering output -- `runTerminal(page, { cmd, token, term?, timeout? })` - Type into the terminal via the browser and wait for rendered output -- `withSession(sdk, title, callback)` - Create temp session -- `sessionIDFromUrl(url)` - Read session ID from URL -- `slugFromUrl(url)` - Read workspace slug from URL -- `waitSlug(page, skip?)` - Wait for resolved workspace slug -- `clickListItem(container, filter)` - Click list item by key/text - -**Selectors** (`selectors.ts`): - -- `promptSelector` - Prompt input -- `terminalSelector` - Terminal panel -- `sessionItemSelector(id)` - Session in sidebar -- `listItemSelector` - Generic list items - -**Utils** (`utils.ts`): - -- `modKey` - Meta (Mac) or Control (Linux/Win) -- `serverUrl` - Backend server URL -- `sessionPath(dir, id?)` - Build session URL - -## Code Style Guidelines - -### Imports - -Always import from `../fixtures`, not `@playwright/test`: - -```typescript -// ✅ Good -import { test, expect } from "../fixtures" - -// ❌ Bad -import { test, expect } from "@playwright/test" -``` - -### Naming Conventions - -- Test files: `feature-name.spec.ts` -- Test names: lowercase, descriptive: `"sidebar can be toggled"` -- Variables: camelCase -- Constants: SCREAMING_SNAKE_CASE - -### Error Handling - -Tests should clean up after themselves. Prefer fixture-managed cleanup: - -```typescript -test("test with cleanup", async ({ page, sdk, gotoSession }) => { - await withSession(sdk, "test session", async (session) => { - await gotoSession(session.id) - // Test code... - }) // Auto-deletes session -}) -``` - -- Prefer the `project` fixture for tests that need a dedicated project with LLM mocking — call `project.open()` then use `project.prompt(...)`, `project.trackSession(...)`, etc. -- Use `withSession(sdk, title, callback)` for lightweight temp sessions on the shared worker directory -- Call `project.trackSession(sessionID, directory?)` and `project.trackDirectory(directory)` for any resources created outside the fixture so teardown can clean them up -- Avoid calling `sdk.session.delete(...)` directly - -### Timeouts - -Default: 60s per test, 10s per assertion. Override when needed: - -```typescript -test.setTimeout(120_000) // For long LLM operations -test("slow test", async () => { - await expect.poll(() => check(), { timeout: 90_000 }).toBe(true) -}) -``` - -### Selectors - -Use `data-component`, `data-action`, or semantic roles: - -```typescript -// ✅ Good -await page.locator('[data-component="prompt-input"]').click() -await page.getByRole("button", { name: "Open settings" }).click() - -// ❌ Bad -await page.locator(".css-class-name").click() -await page.locator("#id-name").click() -``` - -### Keyboard Shortcuts - -Use `modKey` for cross-platform compatibility: - -```typescript -import { modKey } from "../utils" - -await page.keyboard.press(`${modKey}+B`) // Toggle sidebar -await page.keyboard.press(`${modKey}+Comma`) // Open settings -``` - -### Terminal Tests - -- In terminal tests, type through the browser. Do not write to the PTY through the SDK. -- Use `waitTerminalReady(page, { term? })` and `runTerminal(page, { cmd, token, term?, timeout? })` from `actions.ts`. -- These helpers use the fixture-enabled test-only terminal driver and wait for output after the terminal writer settles. -- After opening the terminal, use `waitTerminalFocusIdle(...)` before the next keyboard action when prompt focus or keyboard routing matters. -- This avoids racing terminal mount, focus handoff, and prompt readiness when the next step types or sends shortcuts. -- Avoid `waitForTimeout` and custom DOM or `data-*` readiness checks. - -### Wait on state - -- Never use wall-clock waits like `page.waitForTimeout(...)` to make a test pass -- Avoid race-prone flows that assume work is finished after an action -- Wait or poll on observable state with `expect(...)`, `expect.poll(...)`, or existing helpers -- Prefer locator assertions like `toBeVisible()`, `toHaveCount(0)`, and `toHaveAttribute(...)` for normal UI state, and reserve `expect.poll(...)` for probe, mock, or backend state -- Prefer semantic app state over transient DOM visibility when behavior depends on active selection, focus ownership, or async retry loops -- Do not treat a visible element as proof that the app will route the next action to it -- When fixing a flake, validate with `--repeat-each` and multiple workers when practical - -### Add hooks - -- If required state is not observable from the UI, add a small test-only driver or probe in app code instead of sleeps or fragile DOM checks -- Keep these hooks minimal and purpose-built, following the style of `packages/app/src/testing/terminal.ts` -- Test-only hooks must be inert unless explicitly enabled; do not add normal-runtime listeners, reactive subscriptions, or per-update allocations for e2e ceremony -- When mocking routes or APIs, expose explicit mock state and wait on that before asserting post-action UI -- Add minimal test-only probes for semantic state like the active list item or selected command when DOM intermediates are unstable -- Prefer probing committed app state over asserting on transient highlight, visibility, or animation states - -### Prefer helpers - -- Prefer fluent helpers and drivers when they make intent obvious and reduce locator-heavy noise -- Use direct locators when the interaction is simple and a helper would not add clarity -- Prefer helpers that both perform an action and verify the app consumed it -- Avoid composing helpers redundantly when one already includes the other or already waits for the resulting state -- If a helper already covers the required wait or verification, use it directly instead of layering extra clicks, keypresses, or assertions - -## Writing New Tests - -1. Choose appropriate folder or create new one -2. Import from `../fixtures` -3. Use helper functions from `../actions` and `../selectors` -4. When validating routing, use shared helpers from `../actions`. Workspace URL slugs can be canonicalized on Windows, so assert against canonical or resolved workspace slugs. -5. Clean up any created resources -6. Use specific selectors (avoid CSS classes) -7. Test one feature per test file - -## Local Development - -For UI debugging, use: - -```bash -bun test:e2e:ui -``` - -This opens Playwright's interactive UI for step-through debugging. diff --git a/packages/app/e2e/actions.ts b/packages/app/e2e/actions.ts deleted file mode 100644 index ac9439360..000000000 --- a/packages/app/e2e/actions.ts +++ /dev/null @@ -1,949 +0,0 @@ -import { base64Decode, base64Encode } from "@opencode-ai/util/encode" -import { expect, type Locator, type Page } from "@playwright/test" -import fs from "node:fs/promises" -import os from "node:os" -import path from "node:path" -import { execSync } from "node:child_process" -import { terminalAttr, type E2EWindow } from "../src/testing/terminal" -import { createSdk, modKey, resolveDirectory, serverUrl } from "./utils" -import { - dropdownMenuContentSelector, - projectSwitchSelector, - projectMenuTriggerSelector, - projectCloseMenuSelector, - projectWorkspacesToggleSelector, - titlebarRightSelector, - popoverBodySelector, - listItemSelector, - listItemKeySelector, - listItemKeyStartsWithSelector, - promptSelector, - terminalSelector, - workspaceItemSelector, - workspaceMenuTriggerSelector, -} from "./selectors" - -const phase = new WeakMap<Page, "test" | "cleanup">() - -export function setHealthPhase(page: Page, value: "test" | "cleanup") { - phase.set(page, value) -} - -export function healthPhase(page: Page) { - return phase.get(page) ?? "test" -} - -export async function defocus(page: Page) { - await page - .evaluate(() => { - const el = document.activeElement - if (el instanceof HTMLElement) el.blur() - }) - .catch(() => undefined) -} - -async function terminalID(term: Locator) { - const id = await term.getAttribute(terminalAttr) - if (id) return id - throw new Error(`Active terminal missing ${terminalAttr}`) -} - -export async function terminalConnects(page: Page, input?: { term?: Locator }) { - const term = input?.term ?? page.locator(terminalSelector).first() - const id = await terminalID(term) - return page.evaluate((id) => { - return (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[id]?.connects ?? 0 - }, id) -} - -export async function disconnectTerminal(page: Page, input?: { term?: Locator }) { - const term = input?.term ?? page.locator(terminalSelector).first() - const id = await terminalID(term) - await page.evaluate((id) => { - ;(window as E2EWindow).__opencode_e2e?.terminal?.controls?.[id]?.disconnect?.() - }, id) -} - -async function terminalReady(page: Page, term?: Locator) { - const next = term ?? page.locator(terminalSelector).first() - const id = await terminalID(next) - return page.evaluate((id) => { - const state = (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[id] - return !!state?.connected && (state.settled ?? 0) > 0 - }, id) -} - -async function terminalFocusIdle(page: Page, term?: Locator) { - const next = term ?? page.locator(terminalSelector).first() - const id = await terminalID(next) - return page.evaluate((id) => { - const state = (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[id] - return (state?.focusing ?? 0) === 0 - }, id) -} - -async function terminalHas(page: Page, input: { term?: Locator; token: string }) { - const next = input.term ?? page.locator(terminalSelector).first() - const id = await terminalID(next) - return page.evaluate( - (input) => { - const state = (window as E2EWindow).__opencode_e2e?.terminal?.terminals?.[input.id] - return state?.rendered.includes(input.token) ?? false - }, - { id, token: input.token }, - ) -} - -async function promptSlashActive(page: Page, id: string) { - return page.evaluate((id) => { - const state = (window as E2EWindow).__opencode_e2e?.prompt?.current - if (state?.popover !== "slash") return false - if (!state.slash.ids.includes(id)) return false - return state.slash.active === id - }, id) -} - -async function promptSlashSelects(page: Page) { - return page.evaluate(() => { - return (window as E2EWindow).__opencode_e2e?.prompt?.current?.selects ?? 0 - }) -} - -async function promptSlashSelected(page: Page, input: { id: string; count: number }) { - return page.evaluate((input) => { - const state = (window as E2EWindow).__opencode_e2e?.prompt?.current - if (!state) return false - return state.selected === input.id && state.selects >= input.count - }, input) -} - -export async function waitTerminalReady(page: Page, input?: { term?: Locator; timeout?: number }) { - const term = input?.term ?? page.locator(terminalSelector).first() - const timeout = input?.timeout ?? 10_000 - await expect(term).toBeVisible() - await expect(term.locator("textarea")).toHaveCount(1) - await expect.poll(() => terminalReady(page, term), { timeout }).toBe(true) -} - -export async function waitTerminalFocusIdle(page: Page, input?: { term?: Locator; timeout?: number }) { - const term = input?.term ?? page.locator(terminalSelector).first() - const timeout = input?.timeout ?? 10_000 - await waitTerminalReady(page, { term, timeout }) - await expect.poll(() => terminalFocusIdle(page, term), { timeout }).toBe(true) -} - -export async function showPromptSlash( - page: Page, - input: { id: string; text: string; prompt?: Locator; timeout?: number }, -) { - const prompt = input.prompt ?? page.locator(promptSelector) - const timeout = input.timeout ?? 10_000 - await expect - .poll( - async () => { - await prompt.click().catch(() => false) - await prompt.fill(input.text).catch(() => false) - return promptSlashActive(page, input.id).catch(() => false) - }, - { timeout }, - ) - .toBe(true) -} - -export async function runPromptSlash( - page: Page, - input: { id: string; text: string; prompt?: Locator; timeout?: number }, -) { - const prompt = input.prompt ?? page.locator(promptSelector) - const timeout = input.timeout ?? 10_000 - const count = await promptSlashSelects(page) - await showPromptSlash(page, input) - await prompt.press("Enter") - await expect.poll(() => promptSlashSelected(page, { id: input.id, count: count + 1 }), { timeout }).toBe(true) -} - -export async function runTerminal(page: Page, input: { cmd: string; token: string; term?: Locator; timeout?: number }) { - const term = input.term ?? page.locator(terminalSelector).first() - const timeout = input.timeout ?? 10_000 - await waitTerminalReady(page, { term, timeout }) - const textarea = term.locator("textarea") - await term.click() - await expect(textarea).toBeFocused() - await page.keyboard.type(input.cmd) - await page.keyboard.press("Enter") - await expect.poll(() => terminalHas(page, { term, token: input.token }), { timeout }).toBe(true) -} - -export async function openPalette(page: Page, key = "K") { - await defocus(page) - await page.keyboard.press(`${modKey}+${key}`) - - const dialog = page.getByRole("dialog") - await expect(dialog).toBeVisible() - await expect(dialog.getByRole("textbox").first()).toBeVisible() - return dialog -} - -export async function closeDialog(page: Page, dialog: Locator) { - await page.keyboard.press("Escape") - const closed = await dialog - .waitFor({ state: "detached", timeout: 1500 }) - .then(() => true) - .catch(() => false) - - if (closed) return - - await page.keyboard.press("Escape") - const closedSecond = await dialog - .waitFor({ state: "detached", timeout: 1500 }) - .then(() => true) - .catch(() => false) - - if (closedSecond) return - - await page.locator('[data-component="dialog-overlay"]').click({ position: { x: 5, y: 5 } }) - await expect(dialog).toHaveCount(0) -} - -async function isSidebarClosed(page: Page) { - const button = await waitSidebarButton(page, "isSidebarClosed") - return (await button.getAttribute("aria-expanded")) !== "true" -} - -async function errorBoundaryText(page: Page) { - const title = page.getByRole("heading", { name: /something went wrong/i }).first() - if (!(await title.isVisible().catch(() => false))) return - - const description = await page - .getByText(/an error occurred while loading the application\./i) - .first() - .textContent() - .catch(() => "") - const detail = await page - .getByRole("textbox", { name: /error details/i }) - .first() - .inputValue() - .catch(async () => - ( - (await page - .getByRole("textbox", { name: /error details/i }) - .first() - .textContent() - .catch(() => "")) ?? "" - ).trim(), - ) - - return [title ? "Error boundary" : "", description ?? "", detail ?? ""].filter(Boolean).join("\n") -} - -async function assertHealthy(page: Page, context: string) { - const text = await errorBoundaryText(page) - if (!text) return - console.log(`[e2e:error-boundary][${context}]\n${text}`) - throw new Error(`Error boundary during ${context}\n${text}`) -} - -async function waitSidebarButton(page: Page, context: string) { - const button = page.getByRole("button", { name: /toggle sidebar/i }).first() - const boundary = page.getByRole("heading", { name: /something went wrong/i }).first() - await button.or(boundary).first().waitFor({ state: "visible", timeout: 10_000 }) - await assertHealthy(page, context) - return button -} - -export async function toggleSidebar(page: Page) { - await defocus(page) - await page.keyboard.press(`${modKey}+B`) -} - -export async function openSidebar(page: Page) { - if (!(await isSidebarClosed(page))) return - - const button = await waitSidebarButton(page, "openSidebar") - await button.click() - - const opened = await expect(button) - .toHaveAttribute("aria-expanded", "true", { timeout: 1500 }) - .then(() => true) - .catch(() => false) - - if (opened) return - - await toggleSidebar(page) - await expect(button).toHaveAttribute("aria-expanded", "true") -} - -export async function closeSidebar(page: Page) { - if (await isSidebarClosed(page)) return - - const button = await waitSidebarButton(page, "closeSidebar") - await button.click() - - const closed = await expect(button) - .toHaveAttribute("aria-expanded", "false", { timeout: 1500 }) - .then(() => true) - .catch(() => false) - - if (closed) return - - await toggleSidebar(page) - await expect(button).toHaveAttribute("aria-expanded", "false") -} - -export async function openSettings(page: Page) { - await assertHealthy(page, "openSettings") - await defocus(page) - - const dialog = page.getByRole("dialog") - await page.keyboard.press(`${modKey}+Comma`).catch(() => undefined) - - const opened = await dialog - .waitFor({ state: "visible", timeout: 3000 }) - .then(() => true) - .catch(() => false) - - if (opened) return dialog - - await assertHealthy(page, "openSettings") - - await page.getByRole("button", { name: "Settings" }).first().click() - await expect(dialog).toBeVisible() - return dialog -} - -export async function createTestProject(input?: { serverUrl?: string }) { - const root = await fs.mkdtemp(path.join(os.tmpdir(), "opencode-e2e-project-")) - const id = `e2e-${path.basename(root)}` - - await fs.writeFile(path.join(root, "README.md"), `# e2e\n\n${id}\n`) - - execSync("git init", { cwd: root, stdio: "ignore" }) - await fs.writeFile(path.join(root, ".git", "opencode"), id) - execSync("git config core.fsmonitor false", { cwd: root, stdio: "ignore" }) - execSync("git config commit.gpgsign false", { cwd: root, stdio: "ignore" }) - execSync("git add -A", { cwd: root, stdio: "ignore" }) - execSync('git -c user.name="e2e" -c user.email="[email protected]" commit -m "init" --allow-empty', { - cwd: root, - stdio: "ignore", - }) - - return resolveDirectory(root, input?.serverUrl) -} - -export async function cleanupTestProject(directory: string) { - try { - execSync("git fsmonitor--daemon stop", { cwd: directory, stdio: "ignore" }) - } catch {} - await fs.rm(directory, { recursive: true, force: true, maxRetries: 5, retryDelay: 100 }).catch(() => undefined) -} - -export function slugFromUrl(url: string) { - return /\/([^/]+)\/session(?:[/?#]|$)/.exec(url)?.[1] ?? "" -} - -async function probeSession(page: Page) { - return page - .evaluate(() => { - const win = window as E2EWindow - const current = win.__opencode_e2e?.model?.current - if (!current) return null - return { dir: current.dir, sessionID: current.sessionID } - }) - .catch(() => null as { dir?: string; sessionID?: string } | null) -} - -export async function waitSlug(page: Page, skip: string[] = []) { - let prev = "" - let next = "" - await expect - .poll( - async () => { - await assertHealthy(page, "waitSlug") - const slug = slugFromUrl(page.url()) - if (!slug) return "" - if (skip.includes(slug)) return "" - if (slug !== prev) { - prev = slug - next = "" - return "" - } - next = slug - return slug - }, - { timeout: 45_000 }, - ) - .not.toBe("") - return next -} - -export async function resolveSlug(slug: string, input?: { serverUrl?: string }) { - const directory = base64Decode(slug) - if (!directory) throw new Error(`Failed to decode workspace slug: ${slug}`) - const resolved = await resolveDirectory(directory, input?.serverUrl) - return { directory: resolved, slug: base64Encode(resolved), raw: slug } -} - -export async function waitDir(page: Page, directory: string, input?: { serverUrl?: string }) { - const target = await resolveDirectory(directory, input?.serverUrl) - await expect - .poll( - async () => { - await assertHealthy(page, "waitDir") - const slug = slugFromUrl(page.url()) - if (!slug) return "" - return resolveSlug(slug, input) - .then((item) => item.directory) - .catch(() => "") - }, - { timeout: 45_000 }, - ) - .toBe(target) - return { directory: target, slug: base64Encode(target) } -} - -export async function waitSession( - page: Page, - input: { - directory: string - sessionID?: string - serverUrl?: string - allowAnySession?: boolean - }, -) { - const target = await resolveDirectory(input.directory, input.serverUrl) - await expect - .poll( - async () => { - await assertHealthy(page, "waitSession") - const slug = slugFromUrl(page.url()) - if (!slug) return false - const resolved = await resolveSlug(slug, { serverUrl: input.serverUrl }).catch(() => undefined) - if (!resolved || resolved.directory !== target) return false - const current = sessionIDFromUrl(page.url()) - if (input.sessionID && current !== input.sessionID) return false - if (!input.sessionID && !input.allowAnySession && current) return false - - const state = await probeSession(page) - if (input.sessionID && (!state || state.sessionID !== input.sessionID)) return false - if (!input.sessionID && !input.allowAnySession && state?.sessionID) return false - if (state?.dir) { - const dir = await resolveDirectory(state.dir, input.serverUrl).catch(() => state.dir ?? "") - if (dir !== target) return false - } - - return page - .locator(promptSelector) - .first() - .isVisible() - .catch(() => false) - }, - { timeout: 45_000 }, - ) - .toBe(true) - return { directory: target, slug: base64Encode(target) } -} - -export async function waitSessionSaved(directory: string, sessionID: string, timeout = 30_000, serverUrl?: string) { - const sdk = createSdk(directory, serverUrl) - const target = await resolveDirectory(directory, serverUrl) - - await expect - .poll( - async () => { - const data = await sdk.session - .get({ sessionID }) - .then((x) => x.data) - .catch(() => undefined) - if (!data?.directory) return "" - return resolveDirectory(data.directory, serverUrl).catch(() => data.directory) - }, - { timeout }, - ) - .toBe(target) - - await expect - .poll( - async () => { - const items = await sdk.session - .messages({ sessionID, limit: 20 }) - .then((x) => x.data ?? []) - .catch(() => []) - return items.some((item) => item.info.role === "user") - }, - { timeout }, - ) - .toBe(true) -} - -export function sessionIDFromUrl(url: string) { - const match = /\/session\/([^/?#]+)/.exec(url) - return match?.[1] -} - -export async function hoverSessionItem(page: Page, sessionID: string) { - const sessionEl = page.locator(`[data-session-id="${sessionID}"]`).last() - await expect(sessionEl).toBeVisible() - await sessionEl.hover() - return sessionEl -} - -export async function openSessionMoreMenu(page: Page, sessionID: string) { - await expect(page).toHaveURL(new RegExp(`/session/${sessionID}(?:[/?#]|$)`)) - - const scroller = page.locator(".scroll-view__viewport").first() - await expect(scroller).toBeVisible() - await expect(scroller.getByRole("heading", { level: 1 }).first()).toBeVisible({ timeout: 30_000 }) - - const menu = page - .locator(dropdownMenuContentSelector) - .filter({ has: page.getByRole("menuitem", { name: /rename/i }) }) - .filter({ has: page.getByRole("menuitem", { name: /archive/i }) }) - .filter({ has: page.getByRole("menuitem", { name: /delete/i }) }) - .first() - - const opened = await menu - .isVisible() - .then((x) => x) - .catch(() => false) - - if (opened) return menu - - const menuTrigger = scroller.getByRole("button", { name: /more options/i }).first() - await expect(menuTrigger).toBeVisible() - await menuTrigger.click() - - await expect(menu).toBeVisible() - return menu -} - -export async function clickMenuItem(menu: Locator, itemName: string | RegExp, options?: { force?: boolean }) { - const item = menu.getByRole("menuitem").filter({ hasText: itemName }).first() - await expect(item).toBeVisible() - await item.click({ force: options?.force }) -} - -export async function confirmDialog(page: Page, buttonName: string | RegExp) { - const dialog = page.getByRole("dialog").first() - await expect(dialog).toBeVisible() - - const button = dialog.getByRole("button").filter({ hasText: buttonName }).first() - await expect(button).toBeVisible() - await button.click() -} - -export async function openSharePopover(page: Page) { - const scroller = page.locator(".scroll-view__viewport").first() - await expect(scroller).toBeVisible() - await expect(scroller.getByRole("heading", { level: 1 }).first()).toBeVisible({ timeout: 30_000 }) - - const menuTrigger = scroller.getByRole("button", { name: /more options/i }).first() - await expect(menuTrigger).toBeVisible({ timeout: 30_000 }) - - const popoverBody = page - .locator('[data-component="popover-content"]') - .filter({ has: page.getByRole("button", { name: /^(Publish|Unpublish)$/ }) }) - .first() - - const opened = await popoverBody - .isVisible() - .then((x) => x) - .catch(() => false) - - if (!opened) { - const menu = page.locator(dropdownMenuContentSelector).first() - await menuTrigger.click() - await clickMenuItem(menu, /share/i) - await expect(menu).toHaveCount(0) - await expect(popoverBody).toBeVisible({ timeout: 30_000 }) - } - return { rightSection: scroller, popoverBody } -} - -export async function clickListItem( - container: Locator | Page, - filter: string | RegExp | { key?: string; text?: string | RegExp; keyStartsWith?: string }, -): Promise<Locator> { - let item: Locator - - if (typeof filter === "string" || filter instanceof RegExp) { - item = container.locator(listItemSelector).filter({ hasText: filter }).first() - } else if (filter.keyStartsWith) { - item = container.locator(listItemKeyStartsWithSelector(filter.keyStartsWith)).first() - } else if (filter.key) { - item = container.locator(listItemKeySelector(filter.key)).first() - } else if (filter.text) { - item = container.locator(listItemSelector).filter({ hasText: filter.text }).first() - } else { - throw new Error("Invalid filter provided to clickListItem") - } - - await expect(item).toBeVisible() - await item.click() - return item -} - -async function status(sdk: ReturnType<typeof createSdk>, sessionID: string) { - const data = await sdk.session - .status() - .then((x) => x.data ?? {}) - .catch(() => undefined) - return data?.[sessionID] -} - -async function stable(sdk: ReturnType<typeof createSdk>, sessionID: string, timeout = 10_000) { - let prev = "" - await expect - .poll( - async () => { - const info = await sdk.session - .get({ sessionID }) - .then((x) => x.data) - .catch(() => undefined) - if (!info) return true - const next = `${info.title}:${info.time.updated ?? info.time.created}` - if (next !== prev) { - prev = next - return false - } - return true - }, - { timeout }, - ) - .toBe(true) -} - -export async function waitSessionIdle(sdk: ReturnType<typeof createSdk>, sessionID: string, timeout = 30_000) { - await expect.poll(() => status(sdk, sessionID).then((x) => !x || x.type === "idle"), { timeout }).toBe(true) -} - -export async function cleanupSession(input: { - sessionID: string - directory?: string - sdk?: ReturnType<typeof createSdk> - serverUrl?: string -}) { - const sdk = input.sdk ?? (input.directory ? createSdk(input.directory, input.serverUrl) : undefined) - if (!sdk) throw new Error("cleanupSession requires sdk or directory") - await waitSessionIdle(sdk, input.sessionID, 5_000).catch(() => undefined) - const current = await status(sdk, input.sessionID).catch(() => undefined) - if (current && current.type !== "idle") { - await sdk.session.abort({ sessionID: input.sessionID }).catch(() => undefined) - await waitSessionIdle(sdk, input.sessionID).catch(() => undefined) - } - await stable(sdk, input.sessionID).catch(() => undefined) - await sdk.session.delete({ sessionID: input.sessionID }).catch(() => undefined) -} - -export async function withSession<T>( - sdk: ReturnType<typeof createSdk>, - title: string, - callback: (session: { id: string; title: string }) => Promise<T>, -): Promise<T> { - const session = await sdk.session.create({ title }).then((r) => r.data) - if (!session?.id) throw new Error("Session create did not return an id") - - try { - return await callback(session) - } finally { - await cleanupSession({ sdk, sessionID: session.id }) - } -} - -const seedSystem = [ - "You are seeding deterministic e2e UI state.", - "Follow the user's instruction exactly.", - "When asked to call a tool, call exactly that tool exactly once with the exact JSON input.", - "Do not call any extra tools.", -].join(" ") - -const wait = async <T>(input: { probe: () => Promise<T | undefined>; timeout?: number }) => { - const timeout = input.timeout ?? 30_000 - const end = Date.now() + timeout - while (Date.now() < end) { - const value = await input.probe() - if (value !== undefined) return value - await new Promise((resolve) => setTimeout(resolve, 250)) - } -} - -const seed = async <T>(input: { - sessionID: string - prompt: string - sdk: ReturnType<typeof createSdk> - probe: () => Promise<T | undefined> - timeout?: number - attempts?: number -}) => { - for (let i = 0; i < (input.attempts ?? 2); i++) { - await input.sdk.session.promptAsync({ - sessionID: input.sessionID, - agent: "build", - system: seedSystem, - parts: [{ type: "text", text: input.prompt }], - }) - const value = await wait({ probe: input.probe, timeout: input.timeout }) - if (value !== undefined) return value - } -} - -export async function seedSessionQuestion( - sdk: ReturnType<typeof createSdk>, - input: { - sessionID: string - questions: Array<{ - header: string - question: string - options: Array<{ label: string; description: string }> - multiple?: boolean - custom?: boolean - }> - }, -) { - const first = input.questions[0] - if (!first) throw new Error("Question seed requires at least one question") - - const text = [ - "Your only valid response is one question tool call.", - `Use this JSON input: ${JSON.stringify({ questions: input.questions })}`, - "Do not output plain text.", - "After calling the tool, wait for the user response.", - ].join("\n") - - const result = await seed({ - sdk, - sessionID: input.sessionID, - prompt: text, - timeout: 30_000, - probe: async () => { - const list = await sdk.question.list().then((x) => x.data ?? []) - return list.find((item) => item.sessionID === input.sessionID && item.questions[0]?.header === first.header) - }, - }) - - if (!result) throw new Error("Timed out seeding question request") - return { id: result.id } -} - -export async function seedSessionTask( - sdk: ReturnType<typeof createSdk>, - input: { - sessionID: string - description: string - prompt: string - subagentType?: string - }, -) { - const text = [ - "Your only valid response is one task tool call.", - `Use this JSON input: ${JSON.stringify({ - description: input.description, - prompt: input.prompt, - subagent_type: input.subagentType ?? "general", - })}`, - "Do not output plain text.", - "Wait for the task to start and return the child session id.", - ].join("\n") - - const result = await seed({ - sdk, - sessionID: input.sessionID, - prompt: text, - timeout: 90_000, - probe: async () => { - const messages = await sdk.session.messages({ sessionID: input.sessionID, limit: 50 }).then((x) => x.data ?? []) - const part = messages - .flatMap((message) => message.parts) - .find((part) => { - if (part.type !== "tool" || part.tool !== "task") return false - if (!("state" in part) || !part.state || typeof part.state !== "object") return false - if (!("input" in part.state) || !part.state.input || typeof part.state.input !== "object") return false - if (!("description" in part.state.input) || part.state.input.description !== input.description) return false - if (!("metadata" in part.state) || !part.state.metadata || typeof part.state.metadata !== "object") - return false - if (!("sessionId" in part.state.metadata)) return false - return typeof part.state.metadata.sessionId === "string" && part.state.metadata.sessionId.length > 0 - }) - - if (!part || !("state" in part) || !part.state || typeof part.state !== "object") return - if (!("metadata" in part.state) || !part.state.metadata || typeof part.state.metadata !== "object") return - if (!("sessionId" in part.state.metadata)) return - const id = part.state.metadata.sessionId - if (typeof id !== "string" || !id) return - const child = await sdk.session - .get({ sessionID: id }) - .then((x) => x.data) - .catch(() => undefined) - if (!child?.id) return - return { sessionID: id } - }, - }) - - if (!result) throw new Error("Timed out seeding task tool") - return result -} - -export async function clearSessionDockSeed(sdk: ReturnType<typeof createSdk>, sessionID: string) { - const [questions, permissions] = await Promise.all([ - sdk.question.list().then((x) => x.data ?? []), - sdk.permission.list().then((x) => x.data ?? []), - ]) - - await Promise.all([ - ...questions - .filter((item) => item.sessionID === sessionID) - .map((item) => sdk.question.reject({ requestID: item.id }).catch(() => undefined)), - ...permissions - .filter((item) => item.sessionID === sessionID) - .map((item) => sdk.permission.reply({ requestID: item.id, reply: "reject" }).catch(() => undefined)), - ]) - - return true -} - -export async function openStatusPopover(page: Page) { - await defocus(page) - - const rightSection = page.locator(titlebarRightSelector) - const trigger = rightSection.getByRole("button", { name: /status/i }).first() - - const popoverBody = page.locator(popoverBodySelector).filter({ has: page.locator('[data-component="tabs"]') }) - - const opened = await popoverBody - .isVisible() - .then((x) => x) - .catch(() => false) - - if (!opened) { - await expect(trigger).toBeVisible() - await trigger.click() - await expect(popoverBody).toBeVisible() - } - - return { rightSection, popoverBody } -} - -export async function openProjectMenu(page: Page, projectSlug: string) { - await openSidebar(page) - const item = page.locator(projectSwitchSelector(projectSlug)).first() - await expect(item).toBeVisible() - await item.hover() - - const trigger = page.locator(projectMenuTriggerSelector(projectSlug)).first() - await expect(trigger).toHaveCount(1) - await expect(trigger).toBeVisible() - - const menu = page - .locator(dropdownMenuContentSelector) - .filter({ has: page.locator(projectCloseMenuSelector(projectSlug)) }) - .first() - const close = menu.locator(projectCloseMenuSelector(projectSlug)).first() - - const clicked = await trigger - .click({ force: true, timeout: 1500 }) - .then(() => true) - .catch(() => false) - - if (clicked) { - const opened = await menu - .waitFor({ state: "visible", timeout: 1500 }) - .then(() => true) - .catch(() => false) - if (opened) { - await expect(close).toBeVisible() - return menu - } - } - - await trigger.focus() - await page.keyboard.press("Enter") - - const opened = await menu - .waitFor({ state: "visible", timeout: 1500 }) - .then(() => true) - .catch(() => false) - - if (opened) { - await expect(close).toBeVisible() - return menu - } - - throw new Error(`Failed to open project menu: ${projectSlug}`) -} - -export async function setWorkspacesEnabled(page: Page, projectSlug: string, enabled: boolean) { - const current = () => - page - .getByRole("button", { name: "New workspace" }) - .first() - .isVisible() - .then((x) => x) - .catch(() => false) - - if ((await current()) === enabled) return - - if (enabled) { - await page.reload() - await openSidebar(page) - if ((await current()) === enabled) return - } - - const flip = async (timeout?: number) => { - const menu = await openProjectMenu(page, projectSlug) - const toggle = menu.locator(projectWorkspacesToggleSelector(projectSlug)).first() - await expect(toggle).toBeVisible() - await expect(toggle).toBeEnabled({ timeout: 30_000 }) - const clicked = await toggle - .click({ force: true, timeout }) - .then(() => true) - .catch(() => false) - if (clicked) return - await toggle.focus() - await page.keyboard.press("Enter") - } - - for (const timeout of [1500, undefined, undefined]) { - if ((await current()) === enabled) break - await flip(timeout) - .then(() => undefined) - .catch(() => undefined) - const matched = await expect - .poll(current, { timeout: 5_000 }) - .toBe(enabled) - .then(() => true) - .catch(() => false) - if (matched) break - } - - if ((await current()) !== enabled) { - await page.reload() - await openSidebar(page) - } - - const expected = enabled ? "New workspace" : "New session" - await expect.poll(current, { timeout: 60_000 }).toBe(enabled) - await expect(page.getByRole("button", { name: expected }).first()).toBeVisible({ timeout: 30_000 }) -} - -export async function openWorkspaceMenu(page: Page, workspaceSlug: string) { - const item = page.locator(workspaceItemSelector(workspaceSlug)).first() - await expect(item).toBeVisible() - await item.hover() - - const trigger = page.locator(workspaceMenuTriggerSelector(workspaceSlug)).first() - await expect(trigger).toBeVisible() - await trigger.click({ force: true }) - - const menu = page.locator(dropdownMenuContentSelector).first() - await expect(menu).toBeVisible() - return menu -} - -export async function assistantText(sdk: ReturnType<typeof createSdk>, sessionID: string) { - const messages = await sdk.session.messages({ sessionID, limit: 50 }).then((r) => r.data ?? []) - return messages - .filter((m) => m.info.role === "assistant") - .flatMap((m) => m.parts) - .filter((p) => p.type === "text") - .map((p) => p.text) - .join("\n") -} diff --git a/packages/app/e2e/app/home.spec.ts b/packages/app/e2e/app/home.spec.ts deleted file mode 100644 index 5deba4300..000000000 --- a/packages/app/e2e/app/home.spec.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { test, expect } from "../fixtures" -import { serverNamePattern } from "../utils" - -test("home renders and shows core entrypoints", async ({ page }) => { - await page.goto("/") - const nav = page.locator('[data-component="sidebar-nav-desktop"]') - - await expect(page.getByRole("button", { name: "Open project" }).first()).toBeVisible() - await expect(nav.getByText("No projects open")).toBeVisible() - await expect(nav.getByText("Open a project to get started")).toBeVisible() - await expect(page.getByRole("button", { name: serverNamePattern })).toBeVisible() -}) - -test("server picker dialog opens from home", async ({ page }) => { - await page.goto("/") - - const trigger = page.getByRole("button", { name: serverNamePattern }) - await expect(trigger).toBeVisible() - await trigger.click() - - const dialog = page.getByRole("dialog") - await expect(dialog).toBeVisible() - await expect(dialog.getByRole("textbox").first()).toBeVisible() -}) diff --git a/packages/app/e2e/app/navigation.spec.ts b/packages/app/e2e/app/navigation.spec.ts deleted file mode 100644 index 328c950df..000000000 --- a/packages/app/e2e/app/navigation.spec.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" -import { dirPath } from "../utils" - -test("project route redirects to /session", async ({ page, directory, slug }) => { - await page.goto(dirPath(directory)) - - await expect(page).toHaveURL(new RegExp(`/${slug}/session`)) - await expect(page.locator(promptSelector)).toBeVisible() -}) diff --git a/packages/app/e2e/app/palette.spec.ts b/packages/app/e2e/app/palette.spec.ts deleted file mode 100644 index 4c701fab2..000000000 --- a/packages/app/e2e/app/palette.spec.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { test, expect } from "../fixtures" -import { closeDialog, openPalette } from "../actions" - -test("search palette opens and closes", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openPalette(page) - - await page.keyboard.press("Escape") - await expect(dialog).toHaveCount(0) -}) - -test("search palette also opens with cmd+p", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openPalette(page, "P") - - await closeDialog(page, dialog) - await expect(dialog).toHaveCount(0) -}) diff --git a/packages/app/e2e/app/server-default.spec.ts b/packages/app/e2e/app/server-default.spec.ts deleted file mode 100644 index 2c63130f6..000000000 --- a/packages/app/e2e/app/server-default.spec.ts +++ /dev/null @@ -1,58 +0,0 @@ -import { test, expect } from "../fixtures" -import { serverNamePattern, serverUrls } from "../utils" -import { closeDialog, clickMenuItem } from "../actions" - -const DEFAULT_SERVER_URL_KEY = "opencode.settings.dat:defaultServerUrl" - -test("can set a default server on web", async ({ page, gotoSession }) => { - await page.addInitScript((key: string) => { - try { - localStorage.removeItem(key) - } catch { - return - } - }, DEFAULT_SERVER_URL_KEY) - - await gotoSession() - - const status = page.getByRole("button", { name: "Status" }) - await expect(status).toBeVisible() - const popover = page.locator('[data-component="popover-content"]').filter({ hasText: "Manage servers" }) - - const ensurePopoverOpen = async () => { - if (await popover.isVisible()) return - await status.click() - await expect(popover).toBeVisible() - } - - await ensurePopoverOpen() - await popover.getByRole("button", { name: "Manage servers" }).click() - - const dialog = page.getByRole("dialog") - await expect(dialog).toBeVisible() - - await expect(dialog.getByText(serverNamePattern).first()).toBeVisible() - - const menuTrigger = dialog.locator('[data-slot="dropdown-menu-trigger"]').first() - await expect(menuTrigger).toBeVisible() - await menuTrigger.click({ force: true }) - - const menu = page.locator('[data-component="dropdown-menu-content"]').first() - await expect(menu).toBeVisible() - await clickMenuItem(menu, /set as default/i) - - await expect - .poll(async () => - serverUrls.includes((await page.evaluate((key) => localStorage.getItem(key), DEFAULT_SERVER_URL_KEY)) ?? ""), - ) - .toBe(true) - await expect(dialog.getByText("Default", { exact: true })).toBeVisible() - - await closeDialog(page, dialog) - - await ensurePopoverOpen() - - const serverRow = popover.locator("button").filter({ hasText: serverNamePattern }).first() - await expect(serverRow).toBeVisible() - await expect(serverRow.getByText("Default", { exact: true })).toBeVisible() -}) diff --git a/packages/app/e2e/app/session.spec.ts b/packages/app/e2e/app/session.spec.ts deleted file mode 100644 index c7fdfdc54..000000000 --- a/packages/app/e2e/app/session.spec.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" -import { withSession } from "../actions" - -test("can open an existing session and type into the prompt", async ({ page, sdk, gotoSession }) => { - const title = `e2e smoke ${Date.now()}` - - await withSession(sdk, title, async (session) => { - await gotoSession(session.id) - - const prompt = page.locator(promptSelector) - await prompt.click() - await page.keyboard.type("hello from e2e") - await expect(prompt).toContainText("hello from e2e") - }) -}) diff --git a/packages/app/e2e/app/titlebar-history.spec.ts b/packages/app/e2e/app/titlebar-history.spec.ts deleted file mode 100644 index a4592ff1d..000000000 --- a/packages/app/e2e/app/titlebar-history.spec.ts +++ /dev/null @@ -1,120 +0,0 @@ -import { test, expect } from "../fixtures" -import { defocus, openSidebar, withSession } from "../actions" -import { promptSelector } from "../selectors" -import { modKey } from "../utils" - -test("titlebar back/forward navigates between sessions", async ({ page, slug, sdk, gotoSession }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - - const stamp = Date.now() - - await withSession(sdk, `e2e titlebar history 1 ${stamp}`, async (one) => { - await withSession(sdk, `e2e titlebar history 2 ${stamp}`, async (two) => { - await gotoSession(one.id) - - await openSidebar(page) - - const link = page.locator(`[data-session-id="${two.id}"] a`).first() - await expect(link).toBeVisible() - await link.click() - - await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`)) - await expect(page.locator(promptSelector)).toBeVisible() - - const back = page.getByRole("button", { name: "Back" }) - const forward = page.getByRole("button", { name: "Forward" }) - - await expect(back).toBeVisible() - await expect(back).toBeEnabled() - await back.click() - - await expect(page).toHaveURL(new RegExp(`/${slug}/session/${one.id}(?:\\?|#|$)`)) - await expect(page.locator(promptSelector)).toBeVisible() - - await expect(forward).toBeVisible() - await expect(forward).toBeEnabled() - await forward.click() - - await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`)) - await expect(page.locator(promptSelector)).toBeVisible() - }) - }) -}) - -test("titlebar forward is cleared after branching history from sidebar", async ({ page, slug, sdk, gotoSession }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - - const stamp = Date.now() - - await withSession(sdk, `e2e titlebar history a ${stamp}`, async (a) => { - await withSession(sdk, `e2e titlebar history b ${stamp}`, async (b) => { - await withSession(sdk, `e2e titlebar history c ${stamp}`, async (c) => { - await gotoSession(a.id) - - await openSidebar(page) - - const second = page.locator(`[data-session-id="${b.id}"] a`).first() - await expect(second).toBeVisible() - await second.click() - - await expect(page).toHaveURL(new RegExp(`/${slug}/session/${b.id}(?:\\?|#|$)`)) - await expect(page.locator(promptSelector)).toBeVisible() - - const back = page.getByRole("button", { name: "Back" }) - const forward = page.getByRole("button", { name: "Forward" }) - - await expect(back).toBeVisible() - await expect(back).toBeEnabled() - await back.click() - - await expect(page).toHaveURL(new RegExp(`/${slug}/session/${a.id}(?:\\?|#|$)`)) - await expect(page.locator(promptSelector)).toBeVisible() - - await openSidebar(page) - - const third = page.locator(`[data-session-id="${c.id}"] a`).first() - await expect(third).toBeVisible() - await third.click() - - await expect(page).toHaveURL(new RegExp(`/${slug}/session/${c.id}(?:\\?|#|$)`)) - await expect(page.locator(promptSelector)).toBeVisible() - - await expect(forward).toBeVisible() - await expect(forward).toBeDisabled() - }) - }) - }) -}) - -test("keyboard shortcuts navigate titlebar history", async ({ page, slug, sdk, gotoSession }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - - const stamp = Date.now() - - await withSession(sdk, `e2e titlebar shortcuts 1 ${stamp}`, async (one) => { - await withSession(sdk, `e2e titlebar shortcuts 2 ${stamp}`, async (two) => { - await gotoSession(one.id) - - await openSidebar(page) - - const link = page.locator(`[data-session-id="${two.id}"] a`).first() - await expect(link).toBeVisible() - await link.click() - - await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`)) - await expect(page.locator(promptSelector)).toBeVisible() - - await defocus(page) - await page.keyboard.press(`${modKey}+[`) - - await expect(page).toHaveURL(new RegExp(`/${slug}/session/${one.id}(?:\\?|#|$)`)) - await expect(page.locator(promptSelector)).toBeVisible() - - await defocus(page) - await page.keyboard.press(`${modKey}+]`) - - await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`)) - await expect(page.locator(promptSelector)).toBeVisible() - }) - }) -}) diff --git a/packages/app/e2e/backend.ts b/packages/app/e2e/backend.ts deleted file mode 100644 index a03d1d437..000000000 --- a/packages/app/e2e/backend.ts +++ /dev/null @@ -1,141 +0,0 @@ -import { spawn } from "node:child_process" -import fs from "node:fs/promises" -import net from "node:net" -import os from "node:os" -import path from "node:path" -import { fileURLToPath } from "node:url" - -type Handle = { - url: string - stop: () => Promise<void> -} - -function freePort() { - return new Promise<number>((resolve, reject) => { - const server = net.createServer() - server.once("error", reject) - server.listen(0, () => { - const address = server.address() - if (!address || typeof address === "string") { - server.close(() => reject(new Error("Failed to acquire a free port"))) - return - } - server.close((err) => { - if (err) reject(err) - else resolve(address.port) - }) - }) - }) -} - -async function waitForHealth(url: string, probe = "/global/health") { - const end = Date.now() + 120_000 - let last = "" - while (Date.now() < end) { - try { - const res = await fetch(`${url}${probe}`) - if (res.ok) return - last = `status ${res.status}` - } catch (err) { - last = err instanceof Error ? err.message : String(err) - } - await new Promise((resolve) => setTimeout(resolve, 250)) - } - throw new Error(`Timed out waiting for backend health at ${url}${probe}${last ? ` (${last})` : ""}`) -} - -function done(proc: ReturnType<typeof spawn>) { - return proc.exitCode !== null || proc.signalCode !== null -} - -async function waitExit(proc: ReturnType<typeof spawn>, timeout = 10_000) { - if (done(proc)) return - await Promise.race([ - new Promise<void>((resolve) => proc.once("exit", () => resolve())), - new Promise<void>((resolve) => setTimeout(resolve, timeout)), - ]) -} - -const LOG_CAP = 100 - -function cap(input: string[]) { - if (input.length > LOG_CAP) input.splice(0, input.length - LOG_CAP) -} - -function tail(input: string[]) { - return input.slice(-40).join("") -} - -export async function startBackend(label: string, input?: { llmUrl?: string }): Promise<Handle> { - const port = await freePort() - const sandbox = await fs.mkdtemp(path.join(os.tmpdir(), `opencode-e2e-${label}-`)) - const appDir = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "..") - const repoDir = path.resolve(appDir, "../..") - const opencodeDir = path.join(repoDir, "packages", "opencode") - const env = { - ...process.env, - OPENCODE_DISABLE_LSP_DOWNLOAD: "true", - OPENCODE_DISABLE_DEFAULT_PLUGINS: "true", - OPENCODE_EXPERIMENTAL_DISABLE_FILEWATCHER: "true", - OPENCODE_TEST_HOME: path.join(sandbox, "home"), - XDG_DATA_HOME: path.join(sandbox, "share"), - XDG_CACHE_HOME: path.join(sandbox, "cache"), - XDG_CONFIG_HOME: path.join(sandbox, "config"), - XDG_STATE_HOME: path.join(sandbox, "state"), - OPENCODE_CLIENT: "app", - OPENCODE_STRICT_CONFIG_DEPS: "true", - OPENCODE_E2E_LLM_URL: input?.llmUrl, - } satisfies Record<string, string | undefined> - const out: string[] = [] - const err: string[] = [] - const proc = spawn( - "bun", - ["run", "--conditions=browser", "./src/index.ts", "serve", "--port", String(port), "--hostname", "127.0.0.1"], - { - cwd: opencodeDir, - env, - stdio: ["ignore", "pipe", "pipe"], - }, - ) - proc.stdout?.on("data", (chunk) => { - out.push(String(chunk)) - cap(out) - }) - proc.stderr?.on("data", (chunk) => { - err.push(String(chunk)) - cap(err) - }) - - const url = `http://127.0.0.1:${port}` - try { - await waitForHealth(url) - } catch (error) { - proc.kill("SIGTERM") - await fs.rm(sandbox, { recursive: true, force: true }).catch(() => undefined) - throw new Error( - [ - `Failed to start isolated e2e backend for ${label}`, - error instanceof Error ? error.message : String(error), - tail(out), - tail(err), - ] - .filter(Boolean) - .join("\n"), - ) - } - - return { - url, - async stop() { - if (!done(proc)) { - proc.kill("SIGTERM") - await waitExit(proc) - } - if (!done(proc)) { - proc.kill("SIGKILL") - await waitExit(proc) - } - await fs.rm(sandbox, { recursive: true, force: true }).catch(() => undefined) - }, - } -} diff --git a/packages/app/e2e/commands/input-focus.spec.ts b/packages/app/e2e/commands/input-focus.spec.ts deleted file mode 100644 index 4ba1aa3e6..000000000 --- a/packages/app/e2e/commands/input-focus.spec.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" - -test("ctrl+l focuses the prompt", async ({ page, gotoSession }) => { - await gotoSession() - - const prompt = page.locator(promptSelector) - await expect(prompt).toBeVisible() - - await page.locator("main").click({ position: { x: 5, y: 5 } }) - await expect(prompt).not.toBeFocused() - - await page.keyboard.press("Control+L") - await expect(prompt).toBeFocused() -}) diff --git a/packages/app/e2e/commands/panels.spec.ts b/packages/app/e2e/commands/panels.spec.ts deleted file mode 100644 index 7e5d7bd6e..000000000 --- a/packages/app/e2e/commands/panels.spec.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { test, expect } from "../fixtures" -import { modKey } from "../utils" - -const expanded = async (el: { getAttribute: (name: string) => Promise<string | null> }) => { - const value = await el.getAttribute("aria-expanded") - if (value !== "true" && value !== "false") throw new Error(`Expected aria-expanded to be true|false, got: ${value}`) - return value === "true" -} - -test("review panel can be toggled via keybind", async ({ page, gotoSession }) => { - await gotoSession() - - const reviewPanel = page.locator("#review-panel") - - const treeToggle = page.getByRole("button", { name: "Toggle file tree" }).first() - await expect(treeToggle).toBeVisible() - if (await expanded(treeToggle)) await treeToggle.click() - await expect(treeToggle).toHaveAttribute("aria-expanded", "false") - - const reviewToggle = page.getByRole("button", { name: "Toggle review" }).first() - await expect(reviewToggle).toBeVisible() - if (await expanded(reviewToggle)) await reviewToggle.click() - await expect(reviewToggle).toHaveAttribute("aria-expanded", "false") - await expect(reviewPanel).toHaveAttribute("aria-hidden", "true") - - await page.keyboard.press(`${modKey}+Shift+R`) - await expect(reviewToggle).toHaveAttribute("aria-expanded", "true") - await expect(reviewPanel).toHaveAttribute("aria-hidden", "false") - - await page.keyboard.press(`${modKey}+Shift+R`) - await expect(reviewToggle).toHaveAttribute("aria-expanded", "false") - await expect(reviewPanel).toHaveAttribute("aria-hidden", "true") -}) diff --git a/packages/app/e2e/commands/tab-close.spec.ts b/packages/app/e2e/commands/tab-close.spec.ts deleted file mode 100644 index 981ee561e..000000000 --- a/packages/app/e2e/commands/tab-close.spec.ts +++ /dev/null @@ -1,32 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" -import { modKey } from "../utils" - -test("mod+w closes the active file tab", async ({ page, gotoSession }) => { - await gotoSession() - - await page.locator(promptSelector).click() - await page.keyboard.type("/open") - await expect(page.locator('[data-slash-id="file.open"]').first()).toBeVisible() - await page.keyboard.press("Enter") - - const dialog = page - .getByRole("dialog") - .filter({ has: page.getByPlaceholder(/search files/i) }) - .first() - await expect(dialog).toBeVisible() - - await dialog.getByRole("textbox").first().fill("package.json") - const item = dialog.locator('[data-slot="list-item"][data-key^="file:"]').first() - await expect(item).toBeVisible({ timeout: 30_000 }) - await item.click() - await expect(dialog).toHaveCount(0) - - const tab = page.getByRole("tab", { name: "package.json" }).first() - await expect(tab).toBeVisible() - await tab.click() - await expect(tab).toHaveAttribute("aria-selected", "true") - - await page.keyboard.press(`${modKey}+W`) - await expect(page.getByRole("tab", { name: "package.json" })).toHaveCount(0) -}) diff --git a/packages/app/e2e/files/file-open.spec.ts b/packages/app/e2e/files/file-open.spec.ts deleted file mode 100644 index abb28242d..000000000 --- a/packages/app/e2e/files/file-open.spec.ts +++ /dev/null @@ -1,31 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" - -test("can open a file tab from the search palette", async ({ page, gotoSession }) => { - await gotoSession() - - await page.locator(promptSelector).click() - await page.keyboard.type("/open") - - const command = page.locator('[data-slash-id="file.open"]').first() - await expect(command).toBeVisible() - await page.keyboard.press("Enter") - - const dialog = page - .getByRole("dialog") - .filter({ has: page.getByPlaceholder(/search files/i) }) - .first() - await expect(dialog).toBeVisible() - - const input = dialog.getByRole("textbox").first() - await input.fill("package.json") - - const item = dialog.locator('[data-slot="list-item"][data-key^="file:"]').first() - await expect(item).toBeVisible({ timeout: 30_000 }) - await item.click() - - await expect(dialog).toHaveCount(0) - - const tabs = page.locator('[data-component="tabs"][data-variant="normal"]') - await expect(tabs.locator('[data-slot="tabs-trigger"]').first()).toBeVisible() -}) diff --git a/packages/app/e2e/files/file-tree.spec.ts b/packages/app/e2e/files/file-tree.spec.ts deleted file mode 100644 index a5872bdf8..000000000 --- a/packages/app/e2e/files/file-tree.spec.ts +++ /dev/null @@ -1,56 +0,0 @@ -import { test, expect } from "../fixtures" - -test("file tree can expand folders and open a file", async ({ page, gotoSession }) => { - await gotoSession() - - const toggle = page.getByRole("button", { name: "Toggle file tree" }) - const panel = page.locator("#file-tree-panel") - const treeTabs = panel.locator('[data-component="tabs"][data-variant="pill"][data-scope="filetree"]') - - await expect(toggle).toBeVisible() - if ((await toggle.getAttribute("aria-expanded")) !== "true") await toggle.click() - await expect(toggle).toHaveAttribute("aria-expanded", "true") - await expect(panel).toBeVisible() - await expect(treeTabs).toBeVisible() - - const allTab = treeTabs.getByRole("tab", { name: /^all files$/i }) - await expect(allTab).toBeVisible() - await allTab.click() - await expect(allTab).toHaveAttribute("aria-selected", "true") - - const tree = treeTabs.locator('[data-slot="tabs-content"]:not([hidden])') - await expect(tree).toBeVisible() - - const expand = async (name: string) => { - const folder = tree.getByRole("button", { name, exact: true }).first() - await expect(folder).toBeVisible() - await expect(folder).toHaveAttribute("aria-expanded", /true|false/) - if ((await folder.getAttribute("aria-expanded")) === "false") await folder.click() - await expect(folder).toHaveAttribute("aria-expanded", "true") - } - - await expand("packages") - await expand("app") - await expand("src") - await expand("components") - - const file = tree.getByRole("button", { name: "file-tree.tsx", exact: true }).first() - await expect(file).toBeVisible() - await file.click() - - const tab = page.getByRole("tab", { name: "file-tree.tsx" }) - await expect(tab).toBeVisible() - await tab.click() - await expect(tab).toHaveAttribute("aria-selected", "true") - - await toggle.click() - await expect(toggle).toHaveAttribute("aria-expanded", "false") - - await toggle.click() - await expect(toggle).toHaveAttribute("aria-expanded", "true") - await expect(allTab).toHaveAttribute("aria-selected", "true") - - const viewer = page.locator('[data-component="file"][data-mode="text"]').first() - await expect(viewer).toBeVisible() - await expect(viewer).toContainText("export default function FileTree") -}) diff --git a/packages/app/e2e/files/file-viewer.spec.ts b/packages/app/e2e/files/file-viewer.spec.ts deleted file mode 100644 index 49fe1baa1..000000000 --- a/packages/app/e2e/files/file-viewer.spec.ts +++ /dev/null @@ -1,156 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" -import { modKey } from "../utils" - -test("smoke file viewer renders real file content", async ({ page, gotoSession }) => { - await gotoSession() - - await page.locator(promptSelector).click() - await page.keyboard.type("/open") - - const command = page.locator('[data-slash-id="file.open"]').first() - await expect(command).toBeVisible() - await page.keyboard.press("Enter") - - const dialog = page - .getByRole("dialog") - .filter({ has: page.getByPlaceholder(/search files/i) }) - .first() - await expect(dialog).toBeVisible() - - const input = dialog.getByRole("textbox").first() - await input.fill("package.json") - - const items = dialog.locator('[data-slot="list-item"][data-key^="file:"]') - let index = -1 - await expect - .poll( - async () => { - const keys = await items.evaluateAll((nodes) => nodes.map((node) => node.getAttribute("data-key") ?? "")) - index = keys.findIndex((key) => /packages[\\/]+app[\\/]+package\.json$/i.test(key.replace(/^file:/, ""))) - return index >= 0 - }, - { timeout: 30_000 }, - ) - .toBe(true) - - const item = items.nth(index) - await expect(item).toBeVisible() - await item.click() - - await expect(dialog).toHaveCount(0) - - const tab = page.getByRole("tab", { name: "package.json" }) - await expect(tab).toBeVisible() - await tab.click() - - const viewer = page.locator('[data-component="file"][data-mode="text"]').first() - await expect(viewer).toBeVisible() - await expect(viewer.getByText(/"name"\s*:\s*"@opencode-ai\/app"/)).toBeVisible() -}) - -test("cmd+f opens text viewer search while prompt is focused", async ({ page, gotoSession }) => { - await gotoSession() - - await page.locator(promptSelector).click() - await page.keyboard.type("/open") - - const command = page.locator('[data-slash-id="file.open"]').first() - await expect(command).toBeVisible() - await page.keyboard.press("Enter") - - const dialog = page - .getByRole("dialog") - .filter({ has: page.getByPlaceholder(/search files/i) }) - .first() - await expect(dialog).toBeVisible() - - const input = dialog.getByRole("textbox").first() - await input.fill("package.json") - - const items = dialog.locator('[data-slot="list-item"][data-key^="file:"]') - let index = -1 - await expect - .poll( - async () => { - const keys = await items.evaluateAll((nodes) => nodes.map((node) => node.getAttribute("data-key") ?? "")) - index = keys.findIndex((key) => /packages[\\/]+app[\\/]+package\.json$/i.test(key.replace(/^file:/, ""))) - return index >= 0 - }, - { timeout: 30_000 }, - ) - .toBe(true) - - const item = items.nth(index) - await expect(item).toBeVisible() - await item.click() - - await expect(dialog).toHaveCount(0) - - const tab = page.getByRole("tab", { name: "package.json" }) - await expect(tab).toBeVisible() - await tab.click() - - const viewer = page.locator('[data-component="file"][data-mode="text"]').first() - await expect(viewer).toBeVisible() - - await page.locator(promptSelector).click() - await page.keyboard.press(`${modKey}+f`) - - const findInput = page.getByPlaceholder("Find") - await expect(findInput).toBeVisible() - await expect(findInput).toBeFocused() -}) - -test("cmd+f opens text viewer search while prompt is not focused", async ({ page, gotoSession }) => { - await gotoSession() - - await page.locator(promptSelector).click() - await page.keyboard.type("/open") - - const command = page.locator('[data-slash-id="file.open"]').first() - await expect(command).toBeVisible() - await page.keyboard.press("Enter") - - const dialog = page - .getByRole("dialog") - .filter({ has: page.getByPlaceholder(/search files/i) }) - .first() - await expect(dialog).toBeVisible() - - const input = dialog.getByRole("textbox").first() - await input.fill("package.json") - - const items = dialog.locator('[data-slot="list-item"][data-key^="file:"]') - let index = -1 - await expect - .poll( - async () => { - const keys = await items.evaluateAll((nodes) => nodes.map((node) => node.getAttribute("data-key") ?? "")) - index = keys.findIndex((key) => /packages[\\/]+app[\\/]+package\.json$/i.test(key.replace(/^file:/, ""))) - return index >= 0 - }, - { timeout: 30_000 }, - ) - .toBe(true) - - const item = items.nth(index) - await expect(item).toBeVisible() - await item.click() - - await expect(dialog).toHaveCount(0) - - const tab = page.getByRole("tab", { name: "package.json" }) - await expect(tab).toBeVisible() - await tab.click() - - const viewer = page.locator('[data-component="file"][data-mode="text"]').first() - await expect(viewer).toBeVisible() - - await viewer.click() - await page.keyboard.press(`${modKey}+f`) - - const findInput = page.getByPlaceholder("Find") - await expect(findInput).toBeVisible() - await expect(findInput).toBeFocused() -}) diff --git a/packages/app/e2e/fixtures.ts b/packages/app/e2e/fixtures.ts deleted file mode 100644 index fe2eb9c1a..000000000 --- a/packages/app/e2e/fixtures.ts +++ /dev/null @@ -1,604 +0,0 @@ -import { test as base, expect, type Page } from "@playwright/test" -import { ManagedRuntime } from "effect" -import type { E2EWindow } from "../src/testing/terminal" -import type { Item, Reply, Usage } from "../../opencode/test/lib/llm-server" -import { TestLLMServer } from "../../opencode/test/lib/llm-server" -import { startBackend } from "./backend" -import { - healthPhase, - cleanupSession, - cleanupTestProject, - createTestProject, - setHealthPhase, - sessionIDFromUrl, - waitSession, - waitSessionIdle, - waitSessionSaved, - waitSlug, -} from "./actions" -import { promptSelector } from "./selectors" -import { createSdk, dirSlug, getWorktree, serverUrl, sessionPath } from "./utils" - -type LLMFixture = { - url: string - push: (...input: (Item | Reply)[]) => Promise<void> - pushMatch: ( - match: (hit: { url: URL; body: Record<string, unknown> }) => boolean, - ...input: (Item | Reply)[] - ) => Promise<void> - textMatch: ( - match: (hit: { url: URL; body: Record<string, unknown> }) => boolean, - value: string, - opts?: { usage?: Usage }, - ) => Promise<void> - toolMatch: ( - match: (hit: { url: URL; body: Record<string, unknown> }) => boolean, - name: string, - input: unknown, - ) => Promise<void> - text: (value: string, opts?: { usage?: Usage }) => Promise<void> - tool: (name: string, input: unknown) => Promise<void> - toolHang: (name: string, input: unknown) => Promise<void> - reason: (value: string, opts?: { text?: string; usage?: Usage }) => Promise<void> - fail: (message?: unknown) => Promise<void> - error: (status: number, body: unknown) => Promise<void> - hang: () => Promise<void> - hold: (value: string, wait: PromiseLike<unknown>) => Promise<void> - hits: () => Promise<Array<{ url: URL; body: Record<string, unknown> }>> - calls: () => Promise<number> - wait: (count: number) => Promise<void> - inputs: () => Promise<Record<string, unknown>[]> - pending: () => Promise<number> - misses: () => Promise<Array<{ url: URL; body: Record<string, unknown> }>> -} - -type LLMWorker = LLMFixture & { - reset: () => Promise<void> -} - -type AssistantFixture = { - reply: LLMFixture["text"] - tool: LLMFixture["tool"] - toolHang: LLMFixture["toolHang"] - reason: LLMFixture["reason"] - fail: LLMFixture["fail"] - error: LLMFixture["error"] - hang: LLMFixture["hang"] - hold: LLMFixture["hold"] - calls: LLMFixture["calls"] - pending: LLMFixture["pending"] -} - -export const settingsKey = "settings.v3" - -const seedModel = (() => { - const [providerID = "opencode", modelID = "big-pickle"] = ( - process.env.OPENCODE_E2E_MODEL ?? "opencode/big-pickle" - ).split("/") - return { - providerID: providerID || "opencode", - modelID: modelID || "big-pickle", - } -})() - -function clean(value: string | null) { - return (value ?? "").replace(/\u200B/g, "").trim() -} - -async function visit(page: Page, url: string) { - let err: unknown - for (const _ of [0, 1, 2]) { - try { - await page.goto(url) - return - } catch (cause) { - err = cause - if (!String(cause).includes("ERR_CONNECTION_REFUSED")) throw cause - await new Promise((resolve) => setTimeout(resolve, 300)) - } - } - throw err -} - -async function promptSend(page: Page) { - return page - .evaluate(() => { - const win = window as E2EWindow - const sent = win.__opencode_e2e?.prompt?.sent - return { - started: sent?.started ?? 0, - count: sent?.count ?? 0, - sessionID: sent?.sessionID, - directory: sent?.directory, - } - }) - .catch(() => ({ started: 0, count: 0, sessionID: undefined, directory: undefined })) -} - -type ProjectHandle = { - directory: string - slug: string - gotoSession: (sessionID?: string) => Promise<void> - trackSession: (sessionID: string, directory?: string) => void - trackDirectory: (directory: string) => void - sdk: ReturnType<typeof createSdk> -} - -type ProjectOptions = { - extra?: string[] - model?: { providerID: string; modelID: string } - setup?: (directory: string) => Promise<void> - beforeGoto?: (project: { directory: string; sdk: ReturnType<typeof createSdk> }) => Promise<void> -} - -type ProjectFixture = ProjectHandle & { - open: (options?: ProjectOptions) => Promise<void> - prompt: (text: string) => Promise<string> - user: (text: string) => Promise<string> - shell: (cmd: string) => Promise<string> -} - -type TestFixtures = { - llm: LLMFixture - assistant: AssistantFixture - project: ProjectFixture - sdk: ReturnType<typeof createSdk> - gotoSession: (sessionID?: string) => Promise<void> -} - -type WorkerFixtures = { - _llm: LLMWorker - backend: { - url: string - sdk: (directory?: string) => ReturnType<typeof createSdk> - } - directory: string - slug: string -} - -export const test = base.extend<TestFixtures, WorkerFixtures>({ - _llm: [ - async ({}, use) => { - const rt = ManagedRuntime.make(TestLLMServer.layer) - try { - const svc = await rt.runPromise(TestLLMServer.asEffect()) - await use({ - url: svc.url, - push: (...input) => rt.runPromise(svc.push(...input)), - pushMatch: (match, ...input) => rt.runPromise(svc.pushMatch(match, ...input)), - textMatch: (match, value, opts) => rt.runPromise(svc.textMatch(match, value, opts)), - toolMatch: (match, name, input) => rt.runPromise(svc.toolMatch(match, name, input)), - text: (value, opts) => rt.runPromise(svc.text(value, opts)), - tool: (name, input) => rt.runPromise(svc.tool(name, input)), - toolHang: (name, input) => rt.runPromise(svc.toolHang(name, input)), - reason: (value, opts) => rt.runPromise(svc.reason(value, opts)), - fail: (message) => rt.runPromise(svc.fail(message)), - error: (status, body) => rt.runPromise(svc.error(status, body)), - hang: () => rt.runPromise(svc.hang), - hold: (value, wait) => rt.runPromise(svc.hold(value, wait)), - reset: () => rt.runPromise(svc.reset), - hits: () => rt.runPromise(svc.hits), - calls: () => rt.runPromise(svc.calls), - wait: (count) => rt.runPromise(svc.wait(count)), - inputs: () => rt.runPromise(svc.inputs), - pending: () => rt.runPromise(svc.pending), - misses: () => rt.runPromise(svc.misses), - }) - } finally { - await rt.dispose() - } - }, - { scope: "worker" }, - ], - backend: [ - async ({ _llm }, use, workerInfo) => { - const handle = await startBackend(`w${workerInfo.workerIndex}`, { llmUrl: _llm.url }) - try { - await use({ - url: handle.url, - sdk: (directory?: string) => createSdk(directory, handle.url), - }) - } finally { - await handle.stop() - } - }, - { scope: "worker" }, - ], - llm: async ({ _llm }, use) => { - await _llm.reset() - await use({ - url: _llm.url, - push: _llm.push, - pushMatch: _llm.pushMatch, - textMatch: _llm.textMatch, - toolMatch: _llm.toolMatch, - text: _llm.text, - tool: _llm.tool, - toolHang: _llm.toolHang, - reason: _llm.reason, - fail: _llm.fail, - error: _llm.error, - hang: _llm.hang, - hold: _llm.hold, - hits: _llm.hits, - calls: _llm.calls, - wait: _llm.wait, - inputs: _llm.inputs, - pending: _llm.pending, - misses: _llm.misses, - }) - const pending = await _llm.pending() - if (pending > 0) { - throw new Error(`TestLLMServer still has ${pending} queued response(s) after the test finished`) - } - }, - assistant: async ({ llm }, use) => { - await use({ - reply: llm.text, - tool: llm.tool, - toolHang: llm.toolHang, - reason: llm.reason, - fail: llm.fail, - error: llm.error, - hang: llm.hang, - hold: llm.hold, - calls: llm.calls, - pending: llm.pending, - }) - }, - page: async ({ page }, use) => { - let boundary: string | undefined - setHealthPhase(page, "test") - const consoleHandler = (msg: { text(): string }) => { - const text = msg.text() - if (!text.includes("[e2e:error-boundary]")) return - if (healthPhase(page) === "cleanup") { - console.warn(`[e2e:error-boundary][cleanup-warning]\n${text}`) - return - } - boundary ||= text - console.log(text) - } - const pageErrorHandler = (err: Error) => { - console.log(`[e2e:pageerror] ${err.stack || err.message}`) - } - page.on("console", consoleHandler) - page.on("pageerror", pageErrorHandler) - await use(page) - page.off("console", consoleHandler) - page.off("pageerror", pageErrorHandler) - if (boundary) throw new Error(boundary) - }, - directory: [ - async ({ backend }, use) => { - await use(await getWorktree(backend.url)) - }, - { scope: "worker" }, - ], - slug: [ - async ({ directory }, use) => { - await use(dirSlug(directory)) - }, - { scope: "worker" }, - ], - sdk: async ({ directory, backend }, use) => { - await use(backend.sdk(directory)) - }, - gotoSession: async ({ page, directory, backend }, use) => { - await seedStorage(page, { directory, serverUrl: backend.url }) - - const gotoSession = async (sessionID?: string) => { - await visit(page, sessionPath(directory, sessionID)) - await waitSession(page, { - directory, - sessionID, - serverUrl: backend.url, - allowAnySession: !sessionID, - }) - } - await use(gotoSession) - }, - project: async ({ page, llm, backend }, use) => { - const item = makeProject(page, llm, backend) - try { - await use(item.project) - } finally { - await item.cleanup() - } - }, -}) - -function makeProject( - page: Page, - llm: LLMFixture, - backend: { url: string; sdk: (directory?: string) => ReturnType<typeof createSdk> }, -) { - let state: - | { - directory: string - slug: string - sdk: ReturnType<typeof createSdk> - sessions: Map<string, string> - dirs: Set<string> - } - | undefined - - const need = () => { - if (state) return state - throw new Error("project.open() must be called first") - } - - const trackSession = (sessionID: string, directory?: string) => { - const cur = need() - cur.sessions.set(sessionID, directory ?? cur.directory) - } - - const trackDirectory = (directory: string) => { - const cur = need() - if (directory !== cur.directory) cur.dirs.add(directory) - } - - const gotoSession = async (sessionID?: string) => { - const cur = need() - await visit(page, sessionPath(cur.directory, sessionID)) - await waitSession(page, { - directory: cur.directory, - sessionID, - serverUrl: backend.url, - allowAnySession: !sessionID, - }) - const current = sessionIDFromUrl(page.url()) - if (current) trackSession(current) - } - - const open = async (options?: ProjectOptions) => { - if (state) return - const directory = await createTestProject({ serverUrl: backend.url }) - const sdk = backend.sdk(directory) - await options?.setup?.(directory) - await seedStorage(page, { - directory, - extra: options?.extra, - model: options?.model, - serverUrl: backend.url, - }) - state = { - directory, - slug: "", - sdk, - sessions: new Map(), - dirs: new Set(), - } - await options?.beforeGoto?.({ directory, sdk }) - await gotoSession() - need().slug = await waitSlug(page) - } - - const send = async (text: string, input: { noReply: boolean; shell: boolean }) => { - if (input.noReply) { - const cur = need() - const state = await page.evaluate(() => { - const model = (window as E2EWindow).__opencode_e2e?.model?.current - if (!model) return null - return { - dir: model.dir, - sessionID: model.sessionID, - agent: model.agent, - model: model.model ? { providerID: model.model.providerID, modelID: model.model.modelID } : undefined, - variant: model.variant ?? undefined, - } - }) - const dir = state?.dir ?? cur.directory - const sdk = backend.sdk(dir) - const sessionID = state?.sessionID - ? state.sessionID - : await sdk.session.create({ directory: dir, title: "E2E Session" }).then((res) => { - if (!res.data?.id) throw new Error("Failed to create no-reply session") - return res.data.id - }) - await sdk.session.prompt({ - sessionID, - agent: state?.agent, - model: state?.model, - variant: state?.variant, - noReply: true, - parts: [{ type: "text", text }], - }) - await visit(page, sessionPath(dir, sessionID)) - const active = await waitSession(page, { - directory: dir, - sessionID, - serverUrl: backend.url, - }) - trackSession(sessionID, active.directory) - await waitSessionSaved(active.directory, sessionID, 90_000, backend.url) - return sessionID - } - - const prev = await promptSend(page) - if (!input.noReply && !input.shell && (await llm.pending()) === 0) { - await llm.text("ok") - } - - const prompt = page.locator(promptSelector).first() - const submit = async () => { - await expect(prompt).toBeVisible() - await prompt.click() - if (input.shell) { - await page.keyboard.type("!") - await expect(prompt).toHaveAttribute("aria-label", /enter shell command/i) - } - await page.keyboard.type(text) - await expect.poll(async () => clean(await prompt.textContent())).toBe(text) - await page.keyboard.press("Enter") - const started = await expect - .poll(async () => (await promptSend(page)).started, { timeout: 5_000 }) - .toBeGreaterThan(prev.started) - .then(() => true) - .catch(() => false) - if (started) return - const send = page.getByRole("button", { name: "Send" }).first() - const enabled = await send - .isEnabled() - .then((x) => x) - .catch(() => false) - if (enabled) { - await send.click() - } else { - await prompt.click() - await page.keyboard.press("Enter") - } - await expect.poll(async () => (await promptSend(page)).started, { timeout: 5_000 }).toBeGreaterThan(prev.started) - } - - await submit() - - let next: { sessionID: string; directory: string } | undefined - await expect - .poll( - async () => { - const sent = await promptSend(page) - if (sent.count <= prev.count) return "" - if (!sent.sessionID || !sent.directory) return "" - next = { sessionID: sent.sessionID, directory: sent.directory } - return sent.sessionID - }, - { timeout: 90_000 }, - ) - .not.toBe("") - - if (!next) throw new Error("Failed to observe prompt submission in e2e prompt probe") - const active = await waitSession(page, { - directory: next.directory, - sessionID: next.sessionID, - serverUrl: backend.url, - }) - trackSession(next.sessionID, active.directory) - if (!input.shell) { - await waitSessionSaved(active.directory, next.sessionID, 90_000, backend.url) - } - await waitSessionIdle(backend.sdk(active.directory), next.sessionID, 90_000).catch(() => undefined) - return next.sessionID - } - - const prompt = async (text: string) => { - return send(text, { noReply: false, shell: false }) - } - - const user = async (text: string) => { - return send(text, { noReply: true, shell: false }) - } - - const shell = async (cmd: string) => { - return send(cmd, { noReply: false, shell: true }) - } - - const cleanup = async () => { - const cur = state - if (!cur) return - setHealthPhase(page, "cleanup") - await Promise.allSettled( - Array.from(cur.sessions, ([sessionID, directory]) => - cleanupSession({ sessionID, directory, serverUrl: backend.url }), - ), - ) - await Promise.allSettled(Array.from(cur.dirs, (directory) => cleanupTestProject(directory))) - await cleanupTestProject(cur.directory) - state = undefined - setHealthPhase(page, "test") - } - - return { - project: { - open, - prompt, - user, - shell, - gotoSession, - trackSession, - trackDirectory, - get directory() { - return need().directory - }, - get slug() { - return need().slug - }, - get sdk() { - return need().sdk - }, - }, - cleanup, - } -} - -async function seedStorage( - page: Page, - input: { - directory: string - extra?: string[] - model?: { providerID: string; modelID: string } - serverUrl?: string - }, -) { - const origin = input.serverUrl ?? serverUrl - await page.addInitScript( - (args: { - directory: string - serverUrl: string - extra: string[] - model: { providerID: string; modelID: string } - }) => { - const key = "opencode.global.dat:server" - const raw = localStorage.getItem(key) - const parsed = (() => { - if (!raw) return undefined - try { - return JSON.parse(raw) as unknown - } catch { - return undefined - } - })() - - const store = parsed && typeof parsed === "object" ? (parsed as Record<string, unknown>) : {} - const list = Array.isArray(store.list) ? store.list : [] - const lastProject = store.lastProject && typeof store.lastProject === "object" ? store.lastProject : {} - const projects = store.projects && typeof store.projects === "object" ? store.projects : {} - const next = { ...(projects as Record<string, unknown>) } - const nextList = list.includes(args.serverUrl) ? list : [args.serverUrl, ...list] - - const add = (origin: string, directory: string) => { - const current = next[origin] - const items = Array.isArray(current) ? current : [] - const existing = items.filter( - (p): p is { worktree: string; expanded?: boolean } => - !!p && - typeof p === "object" && - "worktree" in p && - typeof (p as { worktree?: unknown }).worktree === "string", - ) - if (existing.some((p) => p.worktree === directory)) return - next[origin] = [{ worktree: directory, expanded: true }, ...existing] - } - - for (const directory of [args.directory, ...args.extra]) { - add("local", directory) - add(args.serverUrl, directory) - } - - localStorage.setItem(key, JSON.stringify({ list: nextList, projects: next, lastProject })) - localStorage.setItem("opencode.settings.dat:defaultServerUrl", args.serverUrl) - - const win = window as E2EWindow - win.__opencode_e2e = { - ...win.__opencode_e2e, - model: { enabled: true }, - prompt: { enabled: true }, - terminal: { enabled: true, terminals: {} }, - } - localStorage.setItem("opencode.global.dat:model", JSON.stringify({ recent: [args.model], user: [], variant: {} })) - }, - { directory: input.directory, serverUrl: origin, extra: input.extra ?? [], model: input.model ?? seedModel }, - ) -} - -export { expect } diff --git a/packages/app/e2e/models/model-picker.spec.ts b/packages/app/e2e/models/model-picker.spec.ts deleted file mode 100644 index d94c02652..000000000 --- a/packages/app/e2e/models/model-picker.spec.ts +++ /dev/null @@ -1,48 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" -import { clickListItem } from "../actions" - -test.fixme("smoke model selection updates prompt footer", async ({ page, gotoSession }) => { - await gotoSession() - - await page.locator(promptSelector).click() - await page.keyboard.type("/model") - - const command = page.locator('[data-slash-id="model.choose"]') - await expect(command).toBeVisible() - await command.hover() - - await page.keyboard.press("Enter") - - const dialog = page.getByRole("dialog") - await expect(dialog).toBeVisible() - - const input = dialog.getByRole("textbox").first() - - const selected = dialog.locator('[data-slot="list-item"][data-selected="true"]').first() - await expect(selected).toBeVisible() - - const other = dialog.locator('[data-slot="list-item"]:not([data-selected="true"])').first() - const target = (await other.count()) > 0 ? other : selected - - const key = await target.getAttribute("data-key") - if (!key) throw new Error("Failed to resolve model key from list item") - - const model = key.split(":").slice(1).join(":") - - await input.fill(model) - - await clickListItem(dialog, { key }) - - await expect(dialog).toHaveCount(0) - - await page.locator(promptSelector).click() - await page.keyboard.type("/model") - await expect(command).toBeVisible() - await command.hover() - await page.keyboard.press("Enter") - - const dialogAgain = page.getByRole("dialog") - await expect(dialogAgain).toBeVisible() - await expect(dialogAgain.locator(`[data-slot="list-item"][data-key="${key}"][data-selected="true"]`)).toBeVisible() -}) diff --git a/packages/app/e2e/models/models-visibility.spec.ts b/packages/app/e2e/models/models-visibility.spec.ts deleted file mode 100644 index c69911179..000000000 --- a/packages/app/e2e/models/models-visibility.spec.ts +++ /dev/null @@ -1,61 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" -import { closeDialog, openSettings, clickListItem } from "../actions" - -test("hiding a model removes it from the model picker", async ({ page, gotoSession }) => { - await gotoSession() - - await page.locator(promptSelector).click() - await page.keyboard.type("/model") - - const command = page.locator('[data-slash-id="model.choose"]') - await expect(command).toBeVisible() - await command.hover() - await page.keyboard.press("Enter") - - const picker = page.getByRole("dialog") - await expect(picker).toBeVisible() - - const target = picker.locator('[data-slot="list-item"]').first() - await expect(target).toBeVisible() - - const key = await target.getAttribute("data-key") - if (!key) throw new Error("Failed to resolve model key from list item") - - const name = (await target.locator("span").first().innerText()).trim() - if (!name) throw new Error("Failed to resolve model name from list item") - - await page.keyboard.press("Escape") - await expect(picker).toHaveCount(0) - - const settings = await openSettings(page) - - await settings.getByRole("tab", { name: "Models" }).click() - const search = settings.getByPlaceholder("Search models") - await expect(search).toBeVisible() - await search.fill(name) - - const toggle = settings.locator('[data-component="switch"]').filter({ hasText: name }).first() - const input = toggle.locator('[data-slot="switch-input"]') - await expect(toggle).toBeVisible() - await expect(input).toHaveAttribute("aria-checked", "true") - await toggle.locator('[data-slot="switch-control"]').click() - await expect(input).toHaveAttribute("aria-checked", "false") - - await closeDialog(page, settings) - - await page.locator(promptSelector).click() - await page.keyboard.type("/model") - await expect(command).toBeVisible() - await command.hover() - await page.keyboard.press("Enter") - - const pickerAgain = page.getByRole("dialog") - await expect(pickerAgain).toBeVisible() - await expect(pickerAgain.locator('[data-slot="list-item"]').first()).toBeVisible() - - await expect(pickerAgain.locator(`[data-slot="list-item"][data-key="${key}"]`)).toHaveCount(0) - - await page.keyboard.press("Escape") - await expect(pickerAgain).toHaveCount(0) -}) diff --git a/packages/app/e2e/projects/project-edit.spec.ts b/packages/app/e2e/projects/project-edit.spec.ts deleted file mode 100644 index 1ffe4219d..000000000 --- a/packages/app/e2e/projects/project-edit.spec.ts +++ /dev/null @@ -1,49 +0,0 @@ -import { test, expect } from "../fixtures" -import { clickMenuItem, openProjectMenu, openSidebar } from "../actions" - -test("dialog edit project updates name and startup script", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - - await project.open() - await openSidebar(page) - - const open = async () => { - const menu = await openProjectMenu(page, project.slug) - await clickMenuItem(menu, /^Edit$/i, { force: true }) - - const dialog = page.getByRole("dialog") - await expect(dialog).toBeVisible() - await expect(dialog.getByRole("heading", { level: 2 })).toHaveText("Edit project") - return dialog - } - - const name = `e2e project ${Date.now()}` - const startup = `echo e2e_${Date.now()}` - - const dialog = await open() - - const nameInput = dialog.getByLabel("Name") - await nameInput.fill(name) - - const startupInput = dialog.getByLabel("Workspace startup script") - await startupInput.fill(startup) - - await dialog.getByRole("button", { name: "Save" }).click() - await expect(dialog).toHaveCount(0) - - await expect - .poll( - async () => { - await page.reload() - await openSidebar(page) - const reopened = await open() - const value = await reopened.getByLabel("Name").inputValue() - const next = await reopened.getByLabel("Workspace startup script").inputValue() - await reopened.getByRole("button", { name: "Cancel" }).click() - await expect(reopened).toHaveCount(0) - return `${value}\n${next}` - }, - { timeout: 30_000 }, - ) - .toBe(`${name}\n${startup}`) -}) diff --git a/packages/app/e2e/projects/projects-close.spec.ts b/packages/app/e2e/projects/projects-close.spec.ts deleted file mode 100644 index 75e6f2ce6..000000000 --- a/packages/app/e2e/projects/projects-close.spec.ts +++ /dev/null @@ -1,49 +0,0 @@ -import { test, expect } from "../fixtures" -import { createTestProject, cleanupTestProject, openSidebar, clickMenuItem, openProjectMenu } from "../actions" -import { projectSwitchSelector } from "../selectors" -import { dirSlug } from "../utils" - -test("closing active project navigates to another open project", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - - const other = await createTestProject() - const otherSlug = dirSlug(other) - - try { - await project.open({ extra: [other] }) - await openSidebar(page) - - const otherButton = page.locator(projectSwitchSelector(otherSlug)).first() - await expect(otherButton).toBeVisible() - await otherButton.click() - - await expect(page).toHaveURL(new RegExp(`/${otherSlug}/session`)) - - const menu = await openProjectMenu(page, otherSlug) - await clickMenuItem(menu, /^Close$/i, { force: true }) - - await expect - .poll( - () => { - const pathname = new URL(page.url()).pathname - if (new RegExp(`^/${project.slug}/session(?:/[^/]+)?/?$`).test(pathname)) return "project" - if (pathname === "/") return "home" - return "" - }, - { timeout: 15_000 }, - ) - .toMatch(/^(project|home)$/) - - await expect(page).not.toHaveURL(new RegExp(`/${otherSlug}/session(?:[/?#]|$)`)) - await expect - .poll( - async () => { - return await page.locator(projectSwitchSelector(otherSlug)).count() - }, - { timeout: 15_000 }, - ) - .toBe(0) - } finally { - await cleanupTestProject(other) - } -}) diff --git a/packages/app/e2e/projects/projects-switch.spec.ts b/packages/app/e2e/projects/projects-switch.spec.ts deleted file mode 100644 index 67d09afd1..000000000 --- a/packages/app/e2e/projects/projects-switch.spec.ts +++ /dev/null @@ -1,94 +0,0 @@ -import { base64Decode } from "@opencode-ai/util/encode" -import { test, expect } from "../fixtures" -import { - defocus, - createTestProject, - cleanupTestProject, - openSidebar, - setWorkspacesEnabled, - waitSession, - waitSlug, -} from "../actions" -import { projectSwitchSelector, workspaceItemSelector, workspaceNewSessionSelector } from "../selectors" -import { dirSlug, resolveDirectory } from "../utils" - -test("can switch between projects from sidebar", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - - const other = await createTestProject() - const otherSlug = dirSlug(other) - - try { - await project.open({ extra: [other] }) - await defocus(page) - - const currentSlug = dirSlug(project.directory) - const otherButton = page.locator(projectSwitchSelector(otherSlug)).first() - await expect(otherButton).toBeVisible() - await otherButton.click() - - await expect(page).toHaveURL(new RegExp(`/${otherSlug}/session`)) - - const currentButton = page.locator(projectSwitchSelector(currentSlug)).first() - await expect(currentButton).toBeVisible() - await currentButton.click() - - await expect(page).toHaveURL(new RegExp(`/${currentSlug}/session`)) - } finally { - await cleanupTestProject(other) - } -}) - -test("switching back to a project opens the latest workspace session", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - - const other = await createTestProject() - const otherSlug = dirSlug(other) - try { - await project.open({ extra: [other] }) - await defocus(page) - await setWorkspacesEnabled(page, project.slug, true) - await openSidebar(page) - await expect(page.getByRole("button", { name: "New workspace" }).first()).toBeVisible() - - await page.getByRole("button", { name: "New workspace" }).first().click() - - const raw = await waitSlug(page, [project.slug]) - const dir = base64Decode(raw) - if (!dir) throw new Error(`Failed to decode workspace slug: ${raw}`) - const space = await resolveDirectory(dir) - const next = dirSlug(space) - project.trackDirectory(space) - await openSidebar(page) - - const item = page.locator(`${workspaceItemSelector(next)}, ${workspaceItemSelector(raw)}`).first() - await expect(item).toBeVisible() - await item.hover() - - const btn = page.locator(`${workspaceNewSessionSelector(next)}, ${workspaceNewSessionSelector(raw)}`).first() - await expect(btn).toBeVisible() - await btn.click({ force: true }) - - await waitSession(page, { directory: space }) - - const created = await project.user("test") - - await expect(page).toHaveURL(new RegExp(`/${next}/session/${created}(?:[/?#]|$)`)) - - await openSidebar(page) - - const otherButton = page.locator(projectSwitchSelector(otherSlug)).first() - await expect(otherButton).toBeVisible() - await otherButton.click({ force: true }) - await waitSession(page, { directory: other }) - - const rootButton = page.locator(projectSwitchSelector(project.slug)).first() - await expect(rootButton).toBeVisible() - await rootButton.click({ force: true }) - - await waitSession(page, { directory: space, sessionID: created }) - await expect(page).toHaveURL(new RegExp(`/session/${created}(?:[/?#]|$)`)) - } finally { - await cleanupTestProject(other) - } -}) diff --git a/packages/app/e2e/projects/workspace-new-session.spec.ts b/packages/app/e2e/projects/workspace-new-session.spec.ts deleted file mode 100644 index d9d010b4d..000000000 --- a/packages/app/e2e/projects/workspace-new-session.spec.ts +++ /dev/null @@ -1,78 +0,0 @@ -import type { Page } from "@playwright/test" -import { test, expect } from "../fixtures" -import { - openSidebar, - resolveSlug, - sessionIDFromUrl, - setWorkspacesEnabled, - waitDir, - waitSession, - waitSlug, -} from "../actions" -import { workspaceItemSelector, workspaceNewSessionSelector } from "../selectors" - -function item(space: { slug: string; raw: string }) { - return `${workspaceItemSelector(space.slug)}, ${workspaceItemSelector(space.raw)}` -} - -function button(space: { slug: string; raw: string }) { - return `${workspaceNewSessionSelector(space.slug)}, ${workspaceNewSessionSelector(space.raw)}` -} - -async function waitWorkspaceReady(page: Page, space: { slug: string; raw: string }) { - await openSidebar(page) - await expect(page.locator(item(space)).first()).toBeVisible({ timeout: 60_000 }) -} - -async function createWorkspace(page: Page, root: string, seen: string[]) { - await openSidebar(page) - await page.getByRole("button", { name: "New workspace" }).first().click() - - const next = await resolveSlug(await waitSlug(page, [root, ...seen])) - await waitDir(page, next.directory) - return next -} - -async function openWorkspaceNewSession(page: Page, space: { slug: string; raw: string; directory: string }) { - await waitWorkspaceReady(page, space) - - const row = page.locator(item(space)).first() - await row.hover() - - const next = page.locator(button(space)).first() - await expect(next).toBeVisible() - await next.click({ force: true }) - - await waitSession(page, { directory: space.directory }) - await expect.poll(() => sessionIDFromUrl(page.url()) ?? "").toBe("") -} - -async function createSessionFromWorkspace( - project: Parameters<typeof test>[0]["project"], - page: Page, - space: { slug: string; raw: string; directory: string }, - text: string, -) { - await openWorkspaceNewSession(page, space) - return project.user(text) -} - -test("new sessions from sidebar workspace actions stay in selected workspace", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - - await project.open() - await openSidebar(page) - await setWorkspacesEnabled(page, project.slug, true) - - const first = await createWorkspace(page, project.slug, []) - project.trackDirectory(first.directory) - await waitWorkspaceReady(page, first) - - const second = await createWorkspace(page, project.slug, [first.slug]) - project.trackDirectory(second.directory) - await waitWorkspaceReady(page, second) - - await createSessionFromWorkspace(project, page, first, `workspace one ${Date.now()}`) - await createSessionFromWorkspace(project, page, second, `workspace two ${Date.now()}`) - await createSessionFromWorkspace(project, page, first, `workspace one again ${Date.now()}`) -}) diff --git a/packages/app/e2e/projects/workspaces.spec.ts b/packages/app/e2e/projects/workspaces.spec.ts deleted file mode 100644 index 206baa47c..000000000 --- a/packages/app/e2e/projects/workspaces.spec.ts +++ /dev/null @@ -1,368 +0,0 @@ -import fs from "node:fs/promises" -import os from "node:os" -import path from "node:path" -import { base64Decode } from "@opencode-ai/util/encode" -import type { Page } from "@playwright/test" - -import { test, expect } from "../fixtures" - -test.describe.configure({ mode: "serial" }) -import { - cleanupTestProject, - clickMenuItem, - confirmDialog, - openSidebar, - openWorkspaceMenu, - resolveSlug, - setWorkspacesEnabled, - slugFromUrl, - waitDir, - waitSlug, -} from "../actions" -import { inlineInputSelector, workspaceItemSelector } from "../selectors" -import { dirSlug } from "../utils" - -async function setupWorkspaceTest(page: Page, project: { slug: string; trackDirectory: (directory: string) => void }) { - const rootSlug = project.slug - await openSidebar(page) - - await setWorkspacesEnabled(page, rootSlug, true) - - await page.getByRole("button", { name: "New workspace" }).first().click() - const next = await resolveSlug(await waitSlug(page, [rootSlug])) - await waitDir(page, next.directory) - project.trackDirectory(next.directory) - - await openSidebar(page) - - await expect - .poll( - async () => { - const item = page.locator(workspaceItemSelector(next.slug)).first() - try { - await item.hover({ timeout: 500 }) - return true - } catch { - return false - } - }, - { timeout: 60_000 }, - ) - .toBe(true) - - return { rootSlug, slug: next.slug, directory: next.directory } -} - -test("can enable and disable workspaces from project menu", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - await project.open() - - await openSidebar(page) - - await expect(page.getByRole("button", { name: "New session" }).first()).toBeVisible() - await expect(page.getByRole("button", { name: "New workspace" })).toHaveCount(0) - - await setWorkspacesEnabled(page, project.slug, true) - await expect(page.getByRole("button", { name: "New workspace" }).first()).toBeVisible() - await expect(page.locator(workspaceItemSelector(project.slug)).first()).toBeVisible() - - await setWorkspacesEnabled(page, project.slug, false) - await expect(page.getByRole("button", { name: "New session" }).first()).toBeVisible() - await expect(page.locator(workspaceItemSelector(project.slug))).toHaveCount(0) -}) - -test("can create a workspace", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - await project.open() - - await openSidebar(page) - await setWorkspacesEnabled(page, project.slug, true) - - await expect(page.getByRole("button", { name: "New workspace" }).first()).toBeVisible() - - await page.getByRole("button", { name: "New workspace" }).first().click() - const next = await resolveSlug(await waitSlug(page, [project.slug])) - await waitDir(page, next.directory) - project.trackDirectory(next.directory) - - await openSidebar(page) - - await expect - .poll( - async () => { - const item = page.locator(workspaceItemSelector(next.slug)).first() - try { - await item.hover({ timeout: 500 }) - return true - } catch { - return false - } - }, - { timeout: 60_000 }, - ) - .toBe(true) - - await expect(page.locator(workspaceItemSelector(next.slug)).first()).toBeVisible() -}) - -test("non-git projects keep workspace mode disabled", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - - const nonGit = await fs.mkdtemp(path.join(os.tmpdir(), "opencode-e2e-project-nongit-")) - const nonGitSlug = dirSlug(nonGit) - - await fs.writeFile(path.join(nonGit, "README.md"), "# e2e nongit\n") - - try { - await project.open({ extra: [nonGit] }) - await page.goto(`/${nonGitSlug}/session`) - - await expect.poll(() => slugFromUrl(page.url()), { timeout: 30_000 }).not.toBe("") - - const activeDir = await resolveSlug(slugFromUrl(page.url())).then((item) => item.directory) - expect(path.basename(activeDir)).toContain("opencode-e2e-project-nongit-") - - await openSidebar(page) - await expect(page.getByRole("button", { name: "New workspace" })).toHaveCount(0) - await expect(page.getByRole("button", { name: "Create Git repository" })).toBeVisible() - } finally { - await cleanupTestProject(nonGit) - } -}) - -test("can rename a workspace", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - await project.open() - - const { slug } = await setupWorkspaceTest(page, project) - - const rename = `e2e workspace ${Date.now()}` - const menu = await openWorkspaceMenu(page, slug) - await clickMenuItem(menu, /^Rename$/i, { force: true }) - - await expect(menu).toHaveCount(0) - - const item = page.locator(workspaceItemSelector(slug)).first() - await expect(item).toBeVisible() - const input = item.locator(inlineInputSelector).first() - const shown = await input - .isVisible() - .then((x) => x) - .catch(() => false) - if (!shown) { - const retry = await openWorkspaceMenu(page, slug) - await clickMenuItem(retry, /^Rename$/i, { force: true }) - await expect(retry).toHaveCount(0) - } - await expect(input).toBeVisible() - await input.fill(rename) - await input.press("Enter") - await expect(item).toContainText(rename) -}) - -test("can reset a workspace", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - await project.open() - - const { slug, directory: createdDir } = await setupWorkspaceTest(page, project) - - const readme = path.join(createdDir, "README.md") - const extra = path.join(createdDir, `e2e_reset_${Date.now()}.txt`) - const original = await fs.readFile(readme, "utf8") - const dirty = `${original.trimEnd()}\n\nchange_${Date.now()}\n` - await fs.writeFile(readme, dirty, "utf8") - await fs.writeFile(extra, `created_${Date.now()}\n`, "utf8") - - await expect - .poll(async () => { - return await fs - .stat(extra) - .then(() => true) - .catch(() => false) - }) - .toBe(true) - - await expect - .poll(async () => { - const files = await project.sdk.file - .status({ directory: createdDir }) - .then((r) => r.data ?? []) - .catch(() => []) - return files.length - }) - .toBeGreaterThan(0) - - const menu = await openWorkspaceMenu(page, slug) - await clickMenuItem(menu, /^Reset$/i, { force: true }) - await confirmDialog(page, /^Reset workspace$/i) - - await expect - .poll( - async () => { - const files = await project.sdk.file - .status({ directory: createdDir }) - .then((r) => r.data ?? []) - .catch(() => []) - return files.length - }, - { timeout: 120_000 }, - ) - .toBe(0) - - await expect.poll(() => fs.readFile(readme, "utf8"), { timeout: 120_000 }).toBe(original) - - await expect - .poll(async () => { - return await fs - .stat(extra) - .then(() => true) - .catch(() => false) - }) - .toBe(false) -}) - -test("can reorder workspaces by drag and drop", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - await project.open() - const rootSlug = project.slug - - const listSlugs = async () => { - const nodes = page.locator('[data-component="sidebar-nav-desktop"] [data-component="workspace-item"]') - const slugs = await nodes.evaluateAll((els) => { - return els.map((el) => el.getAttribute("data-workspace") ?? "").filter((x) => x.length > 0) - }) - return slugs - } - - const waitReady = async (slug: string) => { - await expect - .poll( - async () => { - const item = page.locator(workspaceItemSelector(slug)).first() - try { - await item.hover({ timeout: 500 }) - return true - } catch { - return false - } - }, - { timeout: 60_000 }, - ) - .toBe(true) - } - - const drag = async (from: string, to: string) => { - const src = page.locator(workspaceItemSelector(from)).first() - const dst = page.locator(workspaceItemSelector(to)).first() - - const a = await src.boundingBox() - const b = await dst.boundingBox() - if (!a || !b) throw new Error("Failed to resolve workspace drag bounds") - - await page.mouse.move(a.x + a.width / 2, a.y + a.height / 2) - await page.mouse.down() - await page.mouse.move(b.x + b.width / 2, b.y + b.height / 2, { steps: 12 }) - await page.mouse.up() - } - - await openSidebar(page) - - await setWorkspacesEnabled(page, rootSlug, true) - - const workspaces = [] as { directory: string; slug: string }[] - for (const _ of [0, 1]) { - const prev = slugFromUrl(page.url()) - await page.getByRole("button", { name: "New workspace" }).first().click() - const next = await resolveSlug(await waitSlug(page, [rootSlug, prev])) - await waitDir(page, next.directory) - project.trackDirectory(next.directory) - workspaces.push(next) - - await openSidebar(page) - } - - if (workspaces.length !== 2) throw new Error("Expected two created workspaces") - - const a = workspaces[0].slug - const b = workspaces[1].slug - - await waitReady(a) - await waitReady(b) - - const list = async () => { - const slugs = await listSlugs() - return slugs.filter((s) => s !== rootSlug && (s === a || s === b)).slice(0, 2) - } - - await expect - .poll(async () => { - const slugs = await list() - return slugs.length === 2 - }) - .toBe(true) - - const before = await list() - const from = before[1] - const to = before[0] - if (!from || !to) throw new Error("Failed to resolve initial workspace order") - - await drag(from, to) - - await expect.poll(async () => await list()).toEqual([from, to]) -}) - -test("can delete a workspace", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - await project.open() - - const rootSlug = project.slug - await openSidebar(page) - await setWorkspacesEnabled(page, rootSlug, true) - - const created = await project.sdk.worktree.create({ directory: project.directory }).then((res) => res.data) - if (!created?.directory) throw new Error("Failed to create workspace for delete test") - - const directory = created.directory - const slug = dirSlug(directory) - project.trackDirectory(directory) - - await page.reload() - await openSidebar(page) - await expect(page.locator(workspaceItemSelector(slug)).first()).toBeVisible({ timeout: 60_000 }) - - await expect - .poll( - async () => { - const worktrees = await project.sdk.worktree - .list() - .then((r) => r.data ?? []) - .catch(() => [] as string[]) - return worktrees.includes(directory) - }, - { timeout: 30_000 }, - ) - .toBe(true) - - const menu = await openWorkspaceMenu(page, slug) - await clickMenuItem(menu, /^Delete$/i, { force: true }) - await confirmDialog(page, /^Delete workspace$/i) - - await expect.poll(() => base64Decode(slugFromUrl(page.url()))).toBe(project.directory) - - await expect - .poll( - async () => { - const worktrees = await project.sdk.worktree - .list() - .then((r) => r.data ?? []) - .catch(() => [] as string[]) - return worktrees.includes(directory) - }, - { timeout: 60_000 }, - ) - .toBe(false) - - await openSidebar(page) - await expect(page.locator(workspaceItemSelector(slug))).toHaveCount(0, { timeout: 60_000 }) - await expect(page.locator(workspaceItemSelector(rootSlug)).first()).toBeVisible() -}) diff --git a/packages/app/e2e/prompt/context.spec.ts b/packages/app/e2e/prompt/context.spec.ts deleted file mode 100644 index 366191fd7..000000000 --- a/packages/app/e2e/prompt/context.spec.ts +++ /dev/null @@ -1,95 +0,0 @@ -import { test, expect } from "../fixtures" -import type { Page } from "@playwright/test" -import { promptSelector } from "../selectors" -import { withSession } from "../actions" - -function contextButton(page: Page) { - return page - .locator('[data-component="button"]') - .filter({ has: page.locator('[data-component="progress-circle"]').first() }) - .first() -} - -async function seedContextSession(input: { sessionID: string; sdk: Parameters<typeof withSession>[0] }) { - await input.sdk.session.promptAsync({ - sessionID: input.sessionID, - noReply: true, - parts: [ - { - type: "text", - text: "seed context", - }, - ], - }) - - await expect - .poll(async () => { - const messages = await input.sdk.session - .messages({ sessionID: input.sessionID, limit: 1 }) - .then((r) => r.data ?? []) - return messages.length - }) - .toBeGreaterThan(0) -} - -test("context panel can be opened from the prompt", async ({ page, sdk, gotoSession }) => { - const title = `e2e smoke context ${Date.now()}` - - await withSession(sdk, title, async (session) => { - await seedContextSession({ sessionID: session.id, sdk }) - - await gotoSession(session.id) - - const trigger = contextButton(page) - await expect(trigger).toBeVisible() - await trigger.click() - - const tabs = page.locator('[data-component="tabs"][data-variant="normal"]') - await expect(tabs.getByRole("tab", { name: "Context" })).toBeVisible() - }) -}) - -test("context panel can be closed from the context tab close action", async ({ page, sdk, gotoSession }) => { - await withSession(sdk, `e2e context toggle ${Date.now()}`, async (session) => { - await seedContextSession({ sessionID: session.id, sdk }) - await gotoSession(session.id) - - await page.locator(promptSelector).click() - - const trigger = contextButton(page) - await expect(trigger).toBeVisible() - await trigger.click() - - const tabs = page.locator('[data-component="tabs"][data-variant="normal"]') - const context = tabs.getByRole("tab", { name: "Context" }) - await expect(context).toBeVisible() - - await page.getByRole("button", { name: "Close tab" }).first().click() - await expect(context).toHaveCount(0) - }) -}) - -test("context panel can open file picker from context actions", async ({ page, sdk, gotoSession }) => { - await withSession(sdk, `e2e context tabs ${Date.now()}`, async (session) => { - await seedContextSession({ sessionID: session.id, sdk }) - await gotoSession(session.id) - - await page.locator(promptSelector).click() - - const trigger = contextButton(page) - await expect(trigger).toBeVisible() - await trigger.click() - - await expect(page.getByRole("tab", { name: "Context" })).toBeVisible() - await page.getByRole("button", { name: "Open file" }).first().click() - - const dialog = page - .getByRole("dialog") - .filter({ has: page.getByPlaceholder(/search files/i) }) - .first() - await expect(dialog).toBeVisible() - - await page.keyboard.press("Escape") - await expect(dialog).toHaveCount(0) - }) -}) diff --git a/packages/app/e2e/prompt/mock.ts b/packages/app/e2e/prompt/mock.ts deleted file mode 100644 index c7eb54b52..000000000 --- a/packages/app/e2e/prompt/mock.ts +++ /dev/null @@ -1,15 +0,0 @@ -type Hit = { body: Record<string, unknown> } - -export function bodyText(hit: Hit) { - return JSON.stringify(hit.body) -} - -/** - * Match requests whose body contains the exact serialized tool input. - * The seed prompts embed JSON.stringify(input) in the prompt text, which - * gets escaped again inside the JSON body — so we double-escape to match. - */ -export function inputMatch(input: unknown) { - const escaped = JSON.stringify(JSON.stringify(input)).slice(1, -1) - return (hit: Hit) => bodyText(hit).includes(escaped) -} diff --git a/packages/app/e2e/prompt/prompt-async.spec.ts b/packages/app/e2e/prompt/prompt-async.spec.ts deleted file mode 100644 index 403369947..000000000 --- a/packages/app/e2e/prompt/prompt-async.spec.ts +++ /dev/null @@ -1,54 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" -import { assistantText, withSession } from "../actions" - -const text = (value: string | null) => (value ?? "").replace(/\u200B/g, "").trim() - -// Regression test for Issue #12453: the synchronous POST /message endpoint holds -// the connection open while the agent works, causing "Failed to fetch" over -// VPN/Tailscale. The fix switches to POST /prompt_async which returns immediately. -test("prompt succeeds when sync message endpoint is unreachable", async ({ page, project, assistant }) => { - test.setTimeout(120_000) - - // Simulate Tailscale/VPN killing the long-lived sync connection - await page.route("**/session/*/message", (route) => route.abort("connectionfailed")) - - const token = `E2E_ASYNC_${Date.now()}` - await project.open() - await assistant.reply(token) - const sessionID = await project.prompt(`Reply with exactly: ${token}`) - - await expect.poll(() => assistant.calls()).toBeGreaterThanOrEqual(1) - await expect.poll(() => assistantText(project.sdk, sessionID), { timeout: 90_000 }).toContain(token) -}) - -test("failed prompt send restores the composer input", async ({ page, sdk, gotoSession }) => { - await withSession(sdk, `e2e prompt failure ${Date.now()}`, async (session) => { - const prompt = page.locator(promptSelector) - const value = `restore ${Date.now()}` - - await page.route(`**/session/${session.id}/prompt_async`, (route) => - route.fulfill({ - status: 500, - contentType: "application/json", - body: JSON.stringify({ message: "e2e prompt failure" }), - }), - ) - - await gotoSession(session.id) - await prompt.click() - await page.keyboard.type(value) - await page.keyboard.press("Enter") - - await expect.poll(async () => text(await prompt.textContent())).toBe(value) - await expect - .poll( - async () => { - const messages = await sdk.session.messages({ sessionID: session.id, limit: 50 }).then((r) => r.data ?? []) - return messages.length - }, - { timeout: 15_000 }, - ) - .toBe(0) - }) -}) diff --git a/packages/app/e2e/prompt/prompt-drop-file-uri.spec.ts b/packages/app/e2e/prompt/prompt-drop-file-uri.spec.ts deleted file mode 100644 index add2d8d8b..000000000 --- a/packages/app/e2e/prompt/prompt-drop-file-uri.spec.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" - -test("dropping text/plain file: uri inserts a file pill", async ({ page, gotoSession }) => { - await gotoSession() - - const prompt = page.locator(promptSelector) - await prompt.click() - - const path = process.platform === "win32" ? "C:\\opencode-e2e-drop.txt" : "/tmp/opencode-e2e-drop.txt" - const dt = await page.evaluateHandle((text) => { - const dt = new DataTransfer() - dt.setData("text/plain", text) - return dt - }, `file:${path}`) - - await page.dispatchEvent("body", "drop", { dataTransfer: dt }) - - const pill = page.locator(`${promptSelector} [data-type="file"]`).first() - await expect(pill).toBeVisible() - await expect(pill).toHaveAttribute("data-path", path) -}) diff --git a/packages/app/e2e/prompt/prompt-drop-file.spec.ts b/packages/app/e2e/prompt/prompt-drop-file.spec.ts deleted file mode 100644 index 0a138de99..000000000 --- a/packages/app/e2e/prompt/prompt-drop-file.spec.ts +++ /dev/null @@ -1,30 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" - -test("dropping an image file adds an attachment", async ({ page, gotoSession }) => { - await gotoSession() - - const prompt = page.locator(promptSelector) - await prompt.click() - - const png = "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAwMCAO3+4uQAAAAASUVORK5CYII=" - const dt = await page.evaluateHandle((b64) => { - const dt = new DataTransfer() - const bytes = Uint8Array.from(atob(b64), (c) => c.charCodeAt(0)) - const file = new File([bytes], "drop.png", { type: "image/png" }) - dt.items.add(file) - return dt - }, png) - - await page.dispatchEvent("body", "drop", { dataTransfer: dt }) - - const img = page.locator('img[alt="drop.png"]').first() - await expect(img).toBeVisible() - - const remove = page.getByRole("button", { name: "Remove attachment" }).first() - await expect(remove).toBeVisible() - - await img.hover() - await remove.click() - await expect(page.locator('img[alt="drop.png"]')).toHaveCount(0) -}) diff --git a/packages/app/e2e/prompt/prompt-footer-focus.spec.ts b/packages/app/e2e/prompt/prompt-footer-focus.spec.ts deleted file mode 100644 index 4609f4b3d..000000000 --- a/packages/app/e2e/prompt/prompt-footer-focus.spec.ts +++ /dev/null @@ -1,88 +0,0 @@ -import type { Locator, Page } from "@playwright/test" -import { test, expect } from "../fixtures" -import { promptAgentSelector, promptModelSelector, promptSelector } from "../selectors" - -type Probe = { - agent?: string - model?: { providerID: string; modelID: string; name?: string } - models?: Array<{ providerID: string; modelID: string; name: string }> - agents?: Array<{ name: string }> -} - -async function probe(page: Page): Promise<Probe | null> { - return page.evaluate(() => { - const win = window as Window & { - __opencode_e2e?: { - model?: { - current?: Probe - } - } - } - return win.__opencode_e2e?.model?.current ?? null - }) -} - -async function state(page: Page) { - const value = await probe(page) - if (!value) throw new Error("Failed to resolve model selection probe") - return value -} - -async function ready(page: Page) { - const prompt = page.locator(promptSelector) - await prompt.click() - await expect(prompt).toBeFocused() - await prompt.pressSequentially("focus") - return prompt -} - -async function body(prompt: Locator) { - return prompt.evaluate((el) => (el as HTMLElement).innerText) -} - -test("agent select returns focus to the prompt", async ({ page, gotoSession }) => { - await gotoSession() - - const prompt = await ready(page) - - const info = await state(page) - const next = info.agents?.map((item) => item.name).find((name) => name !== info.agent) - test.skip(!next, "only one agent available") - if (!next) return - - await page.locator(`${promptAgentSelector} [data-slot="select-select-trigger"]`).first().click() - - const item = page.locator('[data-slot="select-select-item"]').filter({ hasText: next }).first() - await expect(item).toBeVisible() - await item.click({ force: true }) - - await expect(page.locator(`${promptAgentSelector} [data-slot="select-select-trigger-value"]`).first()).toHaveText( - next, - ) - await expect(prompt).toBeFocused() - await prompt.pressSequentially(" agent") - await expect.poll(() => body(prompt)).toContain("focus agent") -}) - -test("model select returns focus to the prompt", async ({ page, gotoSession }) => { - await gotoSession() - - const prompt = await ready(page) - - const info = await state(page) - const key = info.model ? `${info.model.providerID}:${info.model.modelID}` : null - const next = info.models?.find((item) => `${item.providerID}:${item.modelID}` !== key) - test.skip(!next, "only one model available") - if (!next) return - - await page.locator(`${promptModelSelector} [data-action="prompt-model"]`).first().click() - - const item = page.locator(`[data-slot="list-item"][data-key="${next.providerID}:${next.modelID}"]`).first() - await expect(item).toBeVisible() - await item.click({ force: true }) - - await expect(page.locator(`${promptModelSelector} [data-action="prompt-model"] span`).first()).toHaveText(next.name) - await expect(prompt).toBeFocused() - await prompt.pressSequentially(" model") - await expect.poll(() => body(prompt)).toContain("focus model") -}) diff --git a/packages/app/e2e/prompt/prompt-history.spec.ts b/packages/app/e2e/prompt/prompt-history.spec.ts deleted file mode 100644 index 55cb0c9aa..000000000 --- a/packages/app/e2e/prompt/prompt-history.spec.ts +++ /dev/null @@ -1,146 +0,0 @@ -import type { ToolPart } from "@opencode-ai/sdk/v2/client" -import type { Page } from "@playwright/test" -import { test, expect } from "../fixtures" -import { assistantText } from "../actions" -import { promptSelector } from "../selectors" -import { createSdk } from "../utils" - -const text = (value: string | null) => (value ?? "").replace(/\u200B/g, "").trim() -type Sdk = ReturnType<typeof createSdk> - -const isBash = (part: unknown): part is ToolPart => { - if (!part || typeof part !== "object") return false - if (!("type" in part) || part.type !== "tool") return false - if (!("tool" in part) || part.tool !== "bash") return false - return "state" in part -} - -async function wait(page: Page, value: string) { - await expect.poll(async () => text(await page.locator(promptSelector).textContent())).toBe(value) -} - -async function reply(sdk: Sdk, sessionID: string, token: string) { - await expect.poll(() => assistantText(sdk, sessionID), { timeout: 90_000 }).toContain(token) -} - -async function shell(sdk: Sdk, sessionID: string, cmd: string, token: string) { - await expect - .poll( - async () => { - const messages = await sdk.session.messages({ sessionID, limit: 50 }).then((r) => r.data ?? []) - const part = messages - .filter((item) => item.info.role === "assistant") - .flatMap((item) => item.parts) - .filter(isBash) - .find((item) => item.state.input?.command === cmd && item.state.status === "completed") - - if (!part || part.state.status !== "completed") return - return typeof part.state.metadata?.output === "string" ? part.state.metadata.output : part.state.output - }, - { timeout: 90_000 }, - ) - .toContain(token) -} - -test("prompt history restores unsent draft with arrow navigation", async ({ page, project, assistant }) => { - test.setTimeout(120_000) - - const firstToken = `E2E_HISTORY_ONE_${Date.now()}` - const secondToken = `E2E_HISTORY_TWO_${Date.now()}` - const first = `Reply with exactly: ${firstToken}` - const second = `Reply with exactly: ${secondToken}` - const draft = `draft ${Date.now()}` - - await project.open() - await assistant.reply(firstToken) - const sessionID = await project.prompt(first) - await wait(page, "") - await reply(project.sdk, sessionID, firstToken) - - await assistant.reply(secondToken) - await project.prompt(second) - await wait(page, "") - await reply(project.sdk, sessionID, secondToken) - - const prompt = page.locator(promptSelector) - await prompt.click() - await page.keyboard.type(draft) - await wait(page, draft) - - await prompt.fill("") - await wait(page, "") - - await page.keyboard.press("ArrowUp") - await wait(page, second) - - await page.keyboard.press("ArrowUp") - await wait(page, first) - - await page.keyboard.press("ArrowDown") - await wait(page, second) - - await page.keyboard.press("ArrowDown") - await wait(page, "") -}) - -test.fixme("shell history stays separate from normal prompt history", async ({ page, sdk, gotoSession }) => { - test.setTimeout(120_000) - - const firstToken = `E2E_SHELL_ONE_${Date.now()}` - const secondToken = `E2E_SHELL_TWO_${Date.now()}` - const normalToken = `E2E_NORMAL_${Date.now()}` - const first = `echo ${firstToken}` - const second = `echo ${secondToken}` - const normal = `Reply with exactly: ${normalToken}` - - await gotoSession() - - const prompt = page.locator(promptSelector) - - await prompt.click() - await page.keyboard.type("!") - await page.keyboard.type(first) - await page.keyboard.press("Enter") - await wait(page, "") - - await expect(page).toHaveURL(/\/session\/[^/?#]+/, { timeout: 30_000 }) - const sessionID = sessionIDFromUrl(page.url())! - await shell(sdk, sessionID, first, firstToken) - - await prompt.click() - await page.keyboard.type("!") - await page.keyboard.type(second) - await page.keyboard.press("Enter") - await wait(page, "") - await shell(sdk, sessionID, second, secondToken) - - await page.keyboard.press("Escape") - await wait(page, "") - - await prompt.click() - await page.keyboard.type("!") - await page.keyboard.press("ArrowUp") - await wait(page, second) - - await page.keyboard.press("ArrowUp") - await wait(page, first) - - await page.keyboard.press("ArrowDown") - await wait(page, second) - - await page.keyboard.press("ArrowDown") - await wait(page, "") - - await page.keyboard.press("Escape") - await wait(page, "") - - await prompt.click() - await page.keyboard.type(normal) - await page.keyboard.press("Enter") - await wait(page, "") - await reply(sdk, sessionID, normalToken) - - await prompt.click() - await page.keyboard.press("ArrowUp") - await wait(page, normal) -}) diff --git a/packages/app/e2e/prompt/prompt-mention.spec.ts b/packages/app/e2e/prompt/prompt-mention.spec.ts deleted file mode 100644 index 5cc9f6e68..000000000 --- a/packages/app/e2e/prompt/prompt-mention.spec.ts +++ /dev/null @@ -1,26 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" - -test("smoke @mention inserts file pill token", async ({ page, gotoSession }) => { - await gotoSession() - - await page.locator(promptSelector).click() - const sep = process.platform === "win32" ? "\\" : "/" - const file = ["packages", "app", "package.json"].join(sep) - const filePattern = /packages[\\/]+app[\\/]+\s*package\.json/ - - await page.keyboard.type(`@${file}`) - - const suggestion = page.getByRole("button", { name: filePattern }).first() - await expect(suggestion).toBeVisible() - await suggestion.hover() - - await page.keyboard.press("Tab") - - const pill = page.locator(`${promptSelector} [data-type="file"]`).first() - await expect(pill).toBeVisible() - await expect(pill).toHaveAttribute("data-path", filePattern) - - await page.keyboard.type(" ok") - await expect(page.locator(promptSelector)).toContainText("ok") -}) diff --git a/packages/app/e2e/prompt/prompt-multiline.spec.ts b/packages/app/e2e/prompt/prompt-multiline.spec.ts deleted file mode 100644 index 3584773bb..000000000 --- a/packages/app/e2e/prompt/prompt-multiline.spec.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" - -test("shift+enter inserts a newline without submitting", async ({ page, gotoSession }) => { - await gotoSession() - - await expect(page).toHaveURL(/\/session\/?$/) - - const prompt = page.locator(promptSelector) - await prompt.focus() - await expect(prompt).toBeFocused() - - await prompt.pressSequentially("line one") - await expect(prompt).toBeFocused() - - await prompt.press("Shift+Enter") - await expect(page).toHaveURL(/\/session\/?$/) - await expect(prompt).toBeFocused() - - await prompt.pressSequentially("line two") - - await expect(page).toHaveURL(/\/session\/?$/) - await expect.poll(() => prompt.evaluate((el) => el.innerText)).toBe("line one\nline two") -}) diff --git a/packages/app/e2e/prompt/prompt-shell.spec.ts b/packages/app/e2e/prompt/prompt-shell.spec.ts deleted file mode 100644 index 81af4cb1b..000000000 --- a/packages/app/e2e/prompt/prompt-shell.spec.ts +++ /dev/null @@ -1,74 +0,0 @@ -import type { ToolPart } from "@opencode-ai/sdk/v2/client" -import { test, expect } from "../fixtures" -import { closeDialog, openSettings, withSession } from "../actions" -import { promptModelSelector, promptSelector, promptVariantSelector } from "../selectors" - -const isBash = (part: unknown): part is ToolPart => { - if (!part || typeof part !== "object") return false - if (!("type" in part) || part.type !== "tool") return false - if (!("tool" in part) || part.tool !== "bash") return false - return "state" in part -} - -test("shell mode runs a command in the project directory", async ({ page, project }) => { - test.setTimeout(120_000) - - await project.open() - const cmd = process.platform === "win32" ? "dir" : "command ls" - - await withSession(project.sdk, `e2e shell ${Date.now()}`, async (session) => { - project.trackSession(session.id) - await project.gotoSession(session.id) - const dialog = await openSettings(page) - const toggle = dialog.locator('[data-action="settings-auto-accept-permissions"]').first() - const input = toggle.locator('[data-slot="switch-input"]').first() - await expect(toggle).toBeVisible() - if ((await input.getAttribute("aria-checked")) !== "true") { - await toggle.locator('[data-slot="switch-control"]').click() - await expect(input).toHaveAttribute("aria-checked", "true") - } - await closeDialog(page, dialog) - await project.shell(cmd) - - await expect - .poll( - async () => { - const list = await project.sdk.session - .messages({ sessionID: session.id, limit: 50 }) - .then((x) => x.data ?? []) - const msg = list.findLast( - (item) => item.info.role === "assistant" && "path" in item.info && item.info.path.cwd === project.directory, - ) - if (!msg) return - - const part = msg.parts - .filter(isBash) - .find((item) => item.state.input?.command === cmd && item.state.status === "completed") - - if (!part || part.state.status !== "completed") return - const output = - typeof part.state.metadata?.output === "string" ? part.state.metadata.output : part.state.output - if (!output.includes("README.md")) return - - return { cwd: project.directory, output } - }, - { timeout: 90_000 }, - ) - .toEqual(expect.objectContaining({ cwd: project.directory, output: expect.stringContaining("README.md") })) - }) -}) - -test("shell mode unmounts model and variant controls", async ({ page, project }) => { - await project.open() - - const prompt = page.locator(promptSelector).first() - await expect(page.locator(promptModelSelector)).toHaveCount(1) - await expect(page.locator(promptVariantSelector)).toHaveCount(1) - - await prompt.click() - await page.keyboard.type("!") - - await expect(prompt).toHaveAttribute("aria-label", /enter shell command/i) - await expect(page.locator(promptModelSelector)).toHaveCount(0) - await expect(page.locator(promptVariantSelector)).toHaveCount(0) -}) diff --git a/packages/app/e2e/prompt/prompt-slash-open.spec.ts b/packages/app/e2e/prompt/prompt-slash-open.spec.ts deleted file mode 100644 index b4a93099d..000000000 --- a/packages/app/e2e/prompt/prompt-slash-open.spec.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" - -test("smoke /open opens file picker dialog", async ({ page, gotoSession }) => { - await gotoSession() - - await page.locator(promptSelector).click() - await page.keyboard.type("/open") - - const command = page.locator('[data-slash-id="file.open"]') - await expect(command).toBeVisible() - await command.hover() - - await page.keyboard.press("Enter") - - const dialog = page.getByRole("dialog") - await expect(dialog).toBeVisible() - await expect(dialog.getByRole("textbox").first()).toBeVisible() - - await page.keyboard.press("Escape") - await expect(dialog).toHaveCount(0) -}) diff --git a/packages/app/e2e/prompt/prompt-slash-share.spec.ts b/packages/app/e2e/prompt/prompt-slash-share.spec.ts deleted file mode 100644 index f3eeceee5..000000000 --- a/packages/app/e2e/prompt/prompt-slash-share.spec.ts +++ /dev/null @@ -1,66 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" -import { withSession } from "../actions" - -const shareDisabled = process.env.OPENCODE_DISABLE_SHARE === "true" || process.env.OPENCODE_DISABLE_SHARE === "1" - -async function seed(sdk: Parameters<typeof withSession>[0], sessionID: string) { - await sdk.session.promptAsync({ - sessionID, - noReply: true, - parts: [{ type: "text", text: "e2e share seed" }], - }) - - await expect - .poll( - async () => { - const messages = await sdk.session.messages({ sessionID, limit: 1 }).then((r) => r.data ?? []) - return messages.length - }, - { timeout: 30_000 }, - ) - .toBeGreaterThan(0) -} - -test("/share and /unshare update session share state", async ({ page, project }) => { - test.skip(shareDisabled, "Share is disabled in this environment (OPENCODE_DISABLE_SHARE).") - - await project.open() - await withSession(project.sdk, `e2e slash share ${Date.now()}`, async (session) => { - project.trackSession(session.id) - const prompt = page.locator(promptSelector) - - await seed(project.sdk, session.id) - await project.gotoSession(session.id) - - await prompt.click() - await page.keyboard.type("/share") - await expect(page.locator('[data-slash-id="session.share"]').first()).toBeVisible() - await page.keyboard.press("Enter") - - await expect - .poll( - async () => { - const data = await project.sdk.session.get({ sessionID: session.id }).then((r) => r.data) - return data?.share?.url || undefined - }, - { timeout: 30_000 }, - ) - .not.toBeUndefined() - - await prompt.click() - await page.keyboard.type("/unshare") - await expect(page.locator('[data-slash-id="session.unshare"]').first()).toBeVisible() - await page.keyboard.press("Enter") - - await expect - .poll( - async () => { - const data = await project.sdk.session.get({ sessionID: session.id }).then((r) => r.data) - return data?.share?.url || undefined - }, - { timeout: 30_000 }, - ) - .toBeUndefined() - }) -}) diff --git a/packages/app/e2e/prompt/prompt-slash-terminal.spec.ts b/packages/app/e2e/prompt/prompt-slash-terminal.spec.ts deleted file mode 100644 index 466b3ba1b..000000000 --- a/packages/app/e2e/prompt/prompt-slash-terminal.spec.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { test, expect } from "../fixtures" -import { runPromptSlash, waitTerminalFocusIdle } from "../actions" -import { promptSelector, terminalSelector } from "../selectors" - -test("/terminal toggles the terminal panel", async ({ page, gotoSession }) => { - await gotoSession() - - const prompt = page.locator(promptSelector) - const terminal = page.locator(terminalSelector) - - await expect(terminal).not.toBeVisible() - - await runPromptSlash(page, { prompt, text: "/terminal", id: "terminal.toggle" }) - await waitTerminalFocusIdle(page, { term: terminal }) - - await runPromptSlash(page, { prompt, text: "/terminal", id: "terminal.toggle" }) - await expect(terminal).not.toBeVisible() -}) diff --git a/packages/app/e2e/prompt/prompt.spec.ts b/packages/app/e2e/prompt/prompt.spec.ts deleted file mode 100644 index b5dc02bad..000000000 --- a/packages/app/e2e/prompt/prompt.spec.ts +++ /dev/null @@ -1,28 +0,0 @@ -import { test, expect } from "../fixtures" -import { assistantText } from "../actions" - -test("can send a prompt and receive a reply", async ({ page, project, assistant }) => { - test.setTimeout(120_000) - - const pageErrors: string[] = [] - const onPageError = (err: Error) => { - pageErrors.push(err.message) - } - page.on("pageerror", onPageError) - - try { - const token = `E2E_OK_${Date.now()}` - await project.open() - await assistant.reply(token) - const sessionID = await project.prompt(`Reply with exactly: ${token}`) - - await expect.poll(() => assistant.calls()).toBeGreaterThanOrEqual(1) - await expect.poll(() => assistantText(project.sdk, sessionID), { timeout: 30_000 }).toContain(token) - } finally { - page.off("pageerror", onPageError) - } - - if (pageErrors.length > 0) { - throw new Error(`Page error(s):\n${pageErrors.join("\n")}`) - } -}) diff --git a/packages/app/e2e/selectors.ts b/packages/app/e2e/selectors.ts deleted file mode 100644 index 461bb5c1b..000000000 --- a/packages/app/e2e/selectors.ts +++ /dev/null @@ -1,65 +0,0 @@ -export const promptSelector = '[data-component="prompt-input"]' -const terminalPanelSelector = '#terminal-panel[aria-hidden="false"]' -export const terminalSelector = `${terminalPanelSelector} [data-component="terminal"]` -export const sessionComposerDockSelector = '[data-component="session-prompt-dock"]' -export const questionDockSelector = '[data-component="dock-prompt"][data-kind="question"]' -export const permissionDockSelector = '[data-component="dock-prompt"][data-kind="permission"]' -export const sessionTodoToggleButtonSelector = '[data-action="session-todo-toggle-button"]' - -export const modelVariantCycleSelector = '[data-action="model-variant-cycle"]' -export const promptAgentSelector = '[data-component="prompt-agent-control"]' -export const promptModelSelector = '[data-component="prompt-model-control"]' -export const promptVariantSelector = '[data-component="prompt-variant-control"]' -export const settingsLanguageSelectSelector = '[data-action="settings-language"]' -export const settingsColorSchemeSelector = '[data-action="settings-color-scheme"]' -export const settingsThemeSelector = '[data-action="settings-theme"]' -export const settingsCodeFontSelector = '[data-action="settings-code-font"]' -export const settingsUIFontSelector = '[data-action="settings-ui-font"]' -export const settingsNotificationsAgentSelector = '[data-action="settings-notifications-agent"]' -export const settingsNotificationsPermissionsSelector = '[data-action="settings-notifications-permissions"]' -export const settingsNotificationsErrorsSelector = '[data-action="settings-notifications-errors"]' -export const settingsSoundsAgentSelector = '[data-action="settings-sounds-agent"]' -export const settingsSoundsPermissionsSelector = '[data-action="settings-sounds-permissions"]' -export const settingsSoundsErrorsSelector = '[data-action="settings-sounds-errors"]' -export const settingsUpdatesStartupSelector = '[data-action="settings-updates-startup"]' -export const settingsReleaseNotesSelector = '[data-action="settings-release-notes"]' - -const sidebarNavSelector = '[data-component="sidebar-nav-desktop"]' - -export const projectSwitchSelector = (slug: string) => - `${sidebarNavSelector} [data-action="project-switch"][data-project="${slug}"]` - -export const projectMenuTriggerSelector = (slug: string) => - `${sidebarNavSelector} [data-action="project-menu"][data-project="${slug}"]` - -export const projectCloseMenuSelector = (slug: string) => `[data-action="project-close-menu"][data-project="${slug}"]` - -export const projectWorkspacesToggleSelector = (slug: string) => - `[data-action="project-workspaces-toggle"][data-project="${slug}"]` - -export const titlebarRightSelector = "#opencode-titlebar-right" - -export const popoverBodySelector = '[data-slot="popover-body"]' - -export const dropdownMenuContentSelector = '[data-component="dropdown-menu-content"]' - -export const inlineInputSelector = '[data-component="inline-input"]' - -export const sessionItemSelector = (sessionID: string) => `${sidebarNavSelector} [data-session-id="${sessionID}"]` - -export const workspaceItemSelector = (slug: string) => - `${sidebarNavSelector} [data-component="workspace-item"][data-workspace="${slug}"]` - -export const workspaceMenuTriggerSelector = (slug: string) => - `${sidebarNavSelector} [data-action="workspace-menu"][data-workspace="${slug}"]` - -export const workspaceNewSessionSelector = (slug: string) => - `${sidebarNavSelector} [data-action="workspace-new-session"][data-workspace="${slug}"]` - -export const listItemSelector = '[data-slot="list-item"]' - -export const listItemKeyStartsWithSelector = (prefix: string) => `${listItemSelector}[data-key^="${prefix}"]` - -export const listItemKeySelector = (key: string) => `${listItemSelector}[data-key="${key}"]` - -export const keybindButtonSelector = (id: string) => `[data-keybind-id="${id}"]` diff --git a/packages/app/e2e/session/session-child-navigation.spec.ts b/packages/app/e2e/session/session-child-navigation.spec.ts deleted file mode 100644 index c9fad1af8..000000000 --- a/packages/app/e2e/session/session-child-navigation.spec.ts +++ /dev/null @@ -1,64 +0,0 @@ -import { seedSessionTask, withSession } from "../actions" -import { test, expect } from "../fixtures" -import { inputMatch } from "../prompt/mock" - -test("task tool child-session link does not trigger stale show errors", async ({ page, llm, project }) => { - test.setTimeout(120_000) - - const errs: string[] = [] - const onError = (err: Error) => { - errs.push(err.message) - } - page.on("pageerror", onError) - - try { - await project.open() - await withSession(project.sdk, `e2e child nav ${Date.now()}`, async (session) => { - const taskInput = { - description: "Open child session", - prompt: "Search the repository for AssistantParts and then reply with exactly CHILD_OK.", - subagent_type: "general", - } - await llm.toolMatch(inputMatch(taskInput), "task", taskInput) - const child = await seedSessionTask(project.sdk, { - sessionID: session.id, - description: taskInput.description, - prompt: taskInput.prompt, - }) - project.trackSession(child.sessionID) - - await project.gotoSession(session.id) - - const header = page.locator("[data-session-title]") - await expect(header.getByRole("button", { name: "More options" })).toBeVisible({ timeout: 30_000 }) - - const card = page - .locator('[data-component="task-tool-card"]') - .filter({ hasText: /open child session/i }) - .first() - await expect(card).toBeVisible({ timeout: 30_000 }) - await card.click() - - await expect(page).toHaveURL(new RegExp(`/session/${child.sessionID}(?:[/?#]|$)`), { timeout: 30_000 }) - await expect(header.locator('[data-slot="session-title-parent"]')).toHaveText(session.title) - await expect(header.locator('[data-slot="session-title-child"]')).toHaveText(taskInput.description) - await expect(header.locator('[data-slot="session-title-separator"]')).toHaveText("/") - await expect - .poll( - () => - header.locator('[data-slot="session-title-separator"]').evaluate((el) => ({ - left: getComputedStyle(el).paddingLeft, - right: getComputedStyle(el).paddingRight, - })), - { timeout: 30_000 }, - ) - .toEqual({ left: "8px", right: "8px" }) - await expect(header.getByRole("button", { name: "More options" })).toHaveCount(0) - await expect(page.getByText("Subagent sessions cannot be prompted.")).toBeVisible({ timeout: 30_000 }) - await expect(page.getByRole("button", { name: "Back to main session." })).toBeVisible({ timeout: 30_000 }) - await expect.poll(() => errs, { timeout: 5_000 }).toEqual([]) - }) - } finally { - page.off("pageerror", onError) - } -}) diff --git a/packages/app/e2e/session/session-composer-dock.spec.ts b/packages/app/e2e/session/session-composer-dock.spec.ts deleted file mode 100644 index ecacea83d..000000000 --- a/packages/app/e2e/session/session-composer-dock.spec.ts +++ /dev/null @@ -1,655 +0,0 @@ -import { test, expect } from "../fixtures" -import { - composerEvent, - type ComposerDriverState, - type ComposerProbeState, - type ComposerWindow, -} from "../../src/testing/session-composer" -import { cleanupSession, clearSessionDockSeed, closeDialog, openSettings, seedSessionQuestion } from "../actions" -import { - permissionDockSelector, - promptSelector, - questionDockSelector, - sessionComposerDockSelector, - sessionTodoToggleButtonSelector, -} from "../selectors" -import { modKey } from "../utils" -import { inputMatch } from "../prompt/mock" - -type Sdk = Parameters<typeof clearSessionDockSeed>[0] -type PermissionRule = { permission: string; pattern: string; action: "allow" | "deny" | "ask" } - -async function withDockSession<T>( - sdk: Sdk, - title: string, - fn: (session: { id: string; title: string }) => Promise<T>, - opts?: { permission?: PermissionRule[]; trackSession?: (sessionID: string) => void }, -) { - const session = await sdk.session - .create(opts?.permission ? { title, permission: opts.permission } : { title }) - .then((r) => r.data) - if (!session?.id) throw new Error("Session create did not return an id") - opts?.trackSession?.(session.id) - try { - return await fn(session) - } finally { - await cleanupSession({ sdk, sessionID: session.id }) - } -} - -const defaultQuestions = [ - { - header: "Need input", - question: "Pick one option", - options: [ - { label: "Continue", description: "Continue now" }, - { label: "Stop", description: "Stop here" }, - ], - }, -] - -test.setTimeout(120_000) - -async function withDockSeed<T>(sdk: Sdk, sessionID: string, fn: () => Promise<T>) { - try { - return await fn() - } finally { - await clearSessionDockSeed(sdk, sessionID).catch(() => undefined) - } -} - -async function clearPermissionDock(page: any, label: RegExp) { - const dock = page.locator(permissionDockSelector) - await expect(dock).toBeVisible() - await dock.getByRole("button", { name: label }).click() -} - -async function setAutoAccept(page: any, enabled: boolean) { - const dialog = await openSettings(page) - const toggle = dialog.locator('[data-action="settings-auto-accept-permissions"]').first() - const input = toggle.locator('[data-slot="switch-input"]').first() - await expect(toggle).toBeVisible() - const checked = (await input.getAttribute("aria-checked")) === "true" - if (checked !== enabled) await toggle.locator('[data-slot="switch-control"]').click() - await expect(input).toHaveAttribute("aria-checked", enabled ? "true" : "false") - await closeDialog(page, dialog) -} - -async function expectQuestionBlocked(page: any) { - await expect(page.locator(questionDockSelector)).toBeVisible() - await expect(page.locator(promptSelector)).toHaveCount(0) -} - -async function expectQuestionOpen(page: any) { - await expect(page.locator(questionDockSelector)).toHaveCount(0) - await expect(page.locator(promptSelector)).toBeVisible() -} - -async function expectPermissionBlocked(page: any) { - await expect(page.locator(permissionDockSelector)).toBeVisible() - await expect(page.locator(promptSelector)).toHaveCount(0) -} - -async function expectPermissionOpen(page: any) { - await expect(page.locator(permissionDockSelector)).toHaveCount(0) - await expect(page.locator(promptSelector)).toBeVisible() -} - -async function todoDock(page: any, sessionID: string) { - await page.addInitScript(() => { - const win = window as ComposerWindow - win.__opencode_e2e = { - ...win.__opencode_e2e, - composer: { - enabled: true, - sessions: {}, - }, - } - }) - - const write = async (driver: ComposerDriverState | undefined) => { - await page.evaluate( - (input: { event: string; sessionID: string; driver: ComposerDriverState | undefined }) => { - const win = window as ComposerWindow - const composer = win.__opencode_e2e?.composer - if (!composer?.enabled) throw new Error("Composer e2e driver is not enabled") - composer.sessions ??= {} - const prev = composer.sessions[input.sessionID] ?? {} - if (!input.driver) { - if (!prev.probe) { - delete composer.sessions[input.sessionID] - } else { - composer.sessions[input.sessionID] = { probe: prev.probe } - } - } else { - composer.sessions[input.sessionID] = { - ...prev, - driver: input.driver, - } - } - window.dispatchEvent(new CustomEvent(input.event, { detail: { sessionID: input.sessionID } })) - }, - { event: composerEvent, sessionID, driver }, - ) - } - - const read = () => - page.evaluate((sessionID: string) => { - const win = window as ComposerWindow - return win.__opencode_e2e?.composer?.sessions?.[sessionID]?.probe ?? null - }, sessionID) as Promise<ComposerProbeState | null> - - const api = { - async clear() { - await write(undefined) - return api - }, - async open(todos: NonNullable<ComposerDriverState["todos"]>) { - await write({ live: true, todos }) - return api - }, - async finish(todos: NonNullable<ComposerDriverState["todos"]>) { - await write({ live: false, todos }) - return api - }, - async expectOpen(states: ComposerProbeState["states"]) { - await expect.poll(read, { timeout: 10_000 }).toMatchObject({ - mounted: true, - collapsed: false, - hidden: false, - count: states.length, - states, - }) - return api - }, - async expectCollapsed(states: ComposerProbeState["states"]) { - await expect.poll(read, { timeout: 10_000 }).toMatchObject({ - mounted: true, - collapsed: true, - hidden: true, - count: states.length, - states, - }) - return api - }, - async expectClosed() { - await expect.poll(read, { timeout: 10_000 }).toMatchObject({ mounted: false }) - return api - }, - async collapse() { - await page.locator(sessionTodoToggleButtonSelector).click() - return api - }, - async expand() { - await page.locator(sessionTodoToggleButtonSelector).click() - return api - }, - } - - return api -} - -async function withMockPermission<T>( - page: any, - request: { - id: string - sessionID: string - permission: string - patterns: string[] - metadata?: Record<string, unknown> - always?: string[] - }, - opts: { child?: any } | undefined, - fn: (state: { resolved: () => Promise<void> }) => Promise<T>, -) { - const listUrl = /\/permission(?:\?.*)?$/ - const replyUrls = [/\/session\/[^/]+\/permissions\/[^/?]+(?:\?.*)?$/, /\/permission\/[^/]+\/reply(?:\?.*)?$/] - let pending = [ - { - ...request, - always: request.always ?? ["*"], - metadata: request.metadata ?? {}, - }, - ] - - const list = async (route: any) => { - await route.fulfill({ - status: 200, - contentType: "application/json", - body: JSON.stringify(pending), - }) - } - - const reply = async (route: any) => { - const url = new URL(route.request().url()) - const parts = url.pathname.split("/").filter(Boolean) - const id = parts.at(-1) === "reply" ? parts.at(-2) : parts.at(-1) - pending = pending.filter((item) => item.id !== id) - await route.fulfill({ - status: 200, - contentType: "application/json", - body: JSON.stringify(true), - }) - } - - await page.route(listUrl, list) - for (const item of replyUrls) { - await page.route(item, reply) - } - - const sessionList = opts?.child - ? async (route: any) => { - const res = await route.fetch() - const json = await res.json() - const list = Array.isArray(json) ? json : Array.isArray(json?.data) ? json.data : undefined - if (Array.isArray(list) && !list.some((item) => item?.id === opts.child?.id)) list.push(opts.child) - await route.fulfill({ - response: res, - body: JSON.stringify(json), - }) - } - : undefined - - if (sessionList) await page.route("**/session?*", sessionList) - - const state = { - async resolved() { - await expect.poll(() => pending.length, { timeout: 10_000 }).toBe(0) - }, - } - - try { - return await fn(state) - } finally { - await page.unroute(listUrl, list) - for (const item of replyUrls) { - await page.unroute(item, reply) - } - if (sessionList) await page.unroute("**/session?*", sessionList) - } -} - -test("default dock shows prompt input", async ({ page, project }) => { - await project.open() - await withDockSession( - project.sdk, - "e2e composer dock default", - async (session) => { - await project.gotoSession(session.id) - - await expect(page.locator(sessionComposerDockSelector)).toBeVisible() - await expect(page.locator(promptSelector)).toBeVisible() - await expect(page.locator('[data-action="prompt-permissions"]')).toHaveCount(0) - await expect(page.locator(questionDockSelector)).toHaveCount(0) - await expect(page.locator(permissionDockSelector)).toHaveCount(0) - - await page.locator(promptSelector).click() - await expect(page.locator(promptSelector)).toBeFocused() - }, - { trackSession: project.trackSession }, - ) -}) - -test("auto-accept toggle works before first submit", async ({ page, project }) => { - await project.open() - - await setAutoAccept(page, true) - await setAutoAccept(page, false) -}) - -test("blocked question flow unblocks after submit", async ({ page, llm, project }) => { - await project.open() - await withDockSession( - project.sdk, - "e2e composer dock question", - async (session) => { - await withDockSeed(project.sdk, session.id, async () => { - await project.gotoSession(session.id) - - await llm.toolMatch(inputMatch({ questions: defaultQuestions }), "question", { questions: defaultQuestions }) - await seedSessionQuestion(project.sdk, { - sessionID: session.id, - questions: defaultQuestions, - }) - - const dock = page.locator(questionDockSelector) - await expectQuestionBlocked(page) - - await dock.locator('[data-slot="question-option"]').first().click() - await dock.getByRole("button", { name: /submit/i }).click() - - await expectQuestionOpen(page) - }) - }, - { trackSession: project.trackSession }, - ) -}) - -test("blocked question flow supports keyboard shortcuts", async ({ page, llm, project }) => { - await project.open() - await withDockSession( - project.sdk, - "e2e composer dock question keyboard", - async (session) => { - await withDockSeed(project.sdk, session.id, async () => { - await project.gotoSession(session.id) - - await llm.toolMatch(inputMatch({ questions: defaultQuestions }), "question", { questions: defaultQuestions }) - await seedSessionQuestion(project.sdk, { - sessionID: session.id, - questions: defaultQuestions, - }) - - const dock = page.locator(questionDockSelector) - const first = dock.locator('[data-slot="question-option"]').first() - const second = dock.locator('[data-slot="question-option"]').nth(1) - - await expectQuestionBlocked(page) - await expect(first).toBeFocused() - - await page.keyboard.press("ArrowDown") - await expect(second).toBeFocused() - - await page.keyboard.press("Space") - await page.keyboard.press(`${modKey}+Enter`) - await expectQuestionOpen(page) - }) - }, - { trackSession: project.trackSession }, - ) -}) - -test("blocked question flow supports escape dismiss", async ({ page, llm, project }) => { - await project.open() - await withDockSession( - project.sdk, - "e2e composer dock question escape", - async (session) => { - await withDockSeed(project.sdk, session.id, async () => { - await project.gotoSession(session.id) - - await llm.toolMatch(inputMatch({ questions: defaultQuestions }), "question", { questions: defaultQuestions }) - await seedSessionQuestion(project.sdk, { - sessionID: session.id, - questions: defaultQuestions, - }) - - const dock = page.locator(questionDockSelector) - const first = dock.locator('[data-slot="question-option"]').first() - - await expectQuestionBlocked(page) - await expect(first).toBeFocused() - - await page.keyboard.press("Escape") - await expectQuestionOpen(page) - }) - }, - { trackSession: project.trackSession }, - ) -}) - -test("blocked permission flow supports allow once", async ({ page, project }) => { - await project.open() - await withDockSession( - project.sdk, - "e2e composer dock permission once", - async (session) => { - await project.gotoSession(session.id) - await setAutoAccept(page, false) - await withMockPermission( - page, - { - id: "per_e2e_once", - sessionID: session.id, - permission: "bash", - patterns: ["/tmp/opencode-e2e-perm-once"], - metadata: { description: "Need permission for command" }, - }, - undefined, - async (state) => { - await page.goto(page.url()) - await expectPermissionBlocked(page) - - await clearPermissionDock(page, /allow once/i) - await state.resolved() - await page.goto(page.url()) - await expectPermissionOpen(page) - }, - ) - }, - { trackSession: project.trackSession }, - ) -}) - -test("blocked permission flow supports reject", async ({ page, project }) => { - await project.open() - await withDockSession( - project.sdk, - "e2e composer dock permission reject", - async (session) => { - await project.gotoSession(session.id) - await setAutoAccept(page, false) - await withMockPermission( - page, - { - id: "per_e2e_reject", - sessionID: session.id, - permission: "bash", - patterns: ["/tmp/opencode-e2e-perm-reject"], - }, - undefined, - async (state) => { - await page.goto(page.url()) - await expectPermissionBlocked(page) - - await clearPermissionDock(page, /deny/i) - await state.resolved() - await page.goto(page.url()) - await expectPermissionOpen(page) - }, - ) - }, - { trackSession: project.trackSession }, - ) -}) - -test("blocked permission flow supports allow always", async ({ page, project }) => { - await project.open() - await withDockSession( - project.sdk, - "e2e composer dock permission always", - async (session) => { - await project.gotoSession(session.id) - await setAutoAccept(page, false) - await withMockPermission( - page, - { - id: "per_e2e_always", - sessionID: session.id, - permission: "bash", - patterns: ["/tmp/opencode-e2e-perm-always"], - metadata: { description: "Need permission for command" }, - }, - undefined, - async (state) => { - await page.goto(page.url()) - await expectPermissionBlocked(page) - - await clearPermissionDock(page, /allow always/i) - await state.resolved() - await page.goto(page.url()) - await expectPermissionOpen(page) - }, - ) - }, - { trackSession: project.trackSession }, - ) -}) - -test("child session question request blocks parent dock and unblocks after submit", async ({ page, llm, project }) => { - const questions = [ - { - header: "Child input", - question: "Pick one child option", - options: [ - { label: "Continue", description: "Continue child" }, - { label: "Stop", description: "Stop child" }, - ], - }, - ] - await project.open() - await withDockSession( - project.sdk, - "e2e composer dock child question parent", - async (session) => { - await project.gotoSession(session.id) - - const child = await project.sdk.session - .create({ - title: "e2e composer dock child question", - parentID: session.id, - }) - .then((r) => r.data) - if (!child?.id) throw new Error("Child session create did not return an id") - project.trackSession(child.id) - - try { - await withDockSeed(project.sdk, child.id, async () => { - await llm.toolMatch(inputMatch({ questions }), "question", { questions }) - await seedSessionQuestion(project.sdk, { - sessionID: child.id, - questions, - }) - - const dock = page.locator(questionDockSelector) - await expectQuestionBlocked(page) - - await dock.locator('[data-slot="question-option"]').first().click() - await dock.getByRole("button", { name: /submit/i }).click() - - await expectQuestionOpen(page) - }) - } finally { - await cleanupSession({ sdk: project.sdk, sessionID: child.id }) - } - }, - { trackSession: project.trackSession }, - ) -}) - -test("child session permission request blocks parent dock and supports allow once", async ({ page, project }) => { - await project.open() - await withDockSession( - project.sdk, - "e2e composer dock child permission parent", - async (session) => { - await project.gotoSession(session.id) - await setAutoAccept(page, false) - - const child = await project.sdk.session - .create({ - title: "e2e composer dock child permission", - parentID: session.id, - }) - .then((r) => r.data) - if (!child?.id) throw new Error("Child session create did not return an id") - project.trackSession(child.id) - - try { - await withMockPermission( - page, - { - id: "per_e2e_child", - sessionID: child.id, - permission: "bash", - patterns: ["/tmp/opencode-e2e-perm-child"], - metadata: { description: "Need child permission" }, - }, - { child }, - async (state) => { - await page.goto(page.url()) - await expectPermissionBlocked(page) - - await clearPermissionDock(page, /allow once/i) - await state.resolved() - await page.goto(page.url()) - - await expectPermissionOpen(page) - }, - ) - } finally { - await cleanupSession({ sdk: project.sdk, sessionID: child.id }) - } - }, - { trackSession: project.trackSession }, - ) -}) - -test("todo dock transitions and collapse behavior", async ({ page, project }) => { - await project.open() - await withDockSession( - project.sdk, - "e2e composer dock todo", - async (session) => { - const dock = await todoDock(page, session.id) - await project.gotoSession(session.id) - await expect(page.locator(sessionComposerDockSelector)).toBeVisible() - - try { - await dock.open([ - { content: "first task", status: "pending", priority: "high" }, - { content: "second task", status: "in_progress", priority: "medium" }, - ]) - await dock.expectOpen(["pending", "in_progress"]) - - await dock.collapse() - await dock.expectCollapsed(["pending", "in_progress"]) - - await dock.expand() - await dock.expectOpen(["pending", "in_progress"]) - - await dock.finish([ - { content: "first task", status: "completed", priority: "high" }, - { content: "second task", status: "cancelled", priority: "medium" }, - ]) - await dock.expectClosed() - } finally { - await dock.clear() - } - }, - { trackSession: project.trackSession }, - ) -}) - -test("keyboard focus stays off prompt while blocked", async ({ page, llm, project }) => { - const questions = [ - { - header: "Need input", - question: "Pick one option", - options: [{ label: "Continue", description: "Continue now" }], - }, - ] - await project.open() - await withDockSession( - project.sdk, - "e2e composer dock keyboard", - async (session) => { - await withDockSeed(project.sdk, session.id, async () => { - await project.gotoSession(session.id) - - await llm.toolMatch(inputMatch({ questions }), "question", { questions }) - await seedSessionQuestion(project.sdk, { - sessionID: session.id, - questions, - }) - - await expectQuestionBlocked(page) - - await page.locator("main").click({ position: { x: 5, y: 5 } }) - await page.keyboard.type("abc") - await expect(page.locator(promptSelector)).toHaveCount(0) - }) - }, - { trackSession: project.trackSession }, - ) -}) diff --git a/packages/app/e2e/session/session-model-persistence.spec.ts b/packages/app/e2e/session/session-model-persistence.spec.ts deleted file mode 100644 index c107cc518..000000000 --- a/packages/app/e2e/session/session-model-persistence.spec.ts +++ /dev/null @@ -1,362 +0,0 @@ -import type { Locator, Page } from "@playwright/test" -import { test, expect } from "../fixtures" -import { openSidebar, resolveSlug, setWorkspacesEnabled, waitSession, waitSlug } from "../actions" -import { - promptAgentSelector, - promptModelSelector, - promptVariantSelector, - workspaceItemSelector, - workspaceNewSessionSelector, -} from "../selectors" -import { createSdk, sessionPath } from "../utils" - -type Footer = { - agent: string - model: string - variant: string -} - -type Probe = { - dir?: string - sessionID?: string - agent?: string - model?: { providerID: string; modelID: string; name?: string } - variant?: string | null - pick?: { - agent?: string - model?: { providerID: string; modelID: string } - variant?: string | null - } - variants?: string[] - models?: Array<{ providerID: string; modelID: string; name: string }> - agents?: Array<{ name: string }> -} - -const escape = (value: string) => value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&") - -const text = async (locator: Locator) => ((await locator.textContent()) ?? "").trim() - -const modelKey = (state: Probe | null) => (state?.model ? `${state.model.providerID}:${state.model.modelID}` : null) - -async function probe(page: Page): Promise<Probe | null> { - return page.evaluate(() => { - const win = window as Window & { - __opencode_e2e?: { - model?: { - current?: Probe - } - } - } - return win.__opencode_e2e?.model?.current ?? null - }) -} - -async function currentModel(page: Page) { - await expect.poll(() => probe(page).then(modelKey), { timeout: 30_000 }).not.toBe(null) - const value = await probe(page).then(modelKey) - if (!value) throw new Error("Failed to resolve current model key") - return value -} - -async function waitControl(page: Page, key: "setAgent" | "setModel" | "setVariant") { - await expect - .poll( - () => - page.evaluate((key) => { - const win = window as Window & { - __opencode_e2e?: { - model?: { - controls?: Record<string, unknown> - } - } - } - return !!win.__opencode_e2e?.model?.controls?.[key] - }, key), - { timeout: 30_000 }, - ) - .toBe(true) -} - -async function pickAgent(page: Page, value: string) { - await waitControl(page, "setAgent") - await page.evaluate((value) => { - const win = window as Window & { - __opencode_e2e?: { - model?: { - controls?: { - setAgent?: (value: string | undefined) => void - } - } - } - } - const fn = win.__opencode_e2e?.model?.controls?.setAgent - if (!fn) throw new Error("Model e2e agent control is not enabled") - fn(value) - }, value) -} - -async function pickModel(page: Page, value: { providerID: string; modelID: string }) { - await waitControl(page, "setModel") - await page.evaluate((value) => { - const win = window as Window & { - __opencode_e2e?: { - model?: { - controls?: { - setModel?: (value: { providerID: string; modelID: string } | undefined) => void - } - } - } - } - const fn = win.__opencode_e2e?.model?.controls?.setModel - if (!fn) throw new Error("Model e2e model control is not enabled") - fn(value) - }, value) -} - -async function pickVariant(page: Page, value: string) { - await waitControl(page, "setVariant") - await page.evaluate((value) => { - const win = window as Window & { - __opencode_e2e?: { - model?: { - controls?: { - setVariant?: (value: string | undefined) => void - } - } - } - } - const fn = win.__opencode_e2e?.model?.controls?.setVariant - if (!fn) throw new Error("Model e2e variant control is not enabled") - fn(value) - }, value) -} - -async function read(page: Page): Promise<Footer> { - return { - agent: await text(page.locator(`${promptAgentSelector} [data-slot="select-select-trigger-value"]`).first()), - model: await text(page.locator(`${promptModelSelector} [data-action="prompt-model"] span`).first()), - variant: await text(page.locator(`${promptVariantSelector} [data-slot="select-select-trigger-value"]`).first()), - } -} - -async function waitFooter(page: Page, expected: Partial<Footer>) { - let hit: Footer | null = null - await expect - .poll( - async () => { - const state = await read(page) - const ok = Object.entries(expected).every(([key, value]) => state[key as keyof Footer] === value) - if (ok) hit = state - return ok - }, - { timeout: 30_000 }, - ) - .toBe(true) - if (!hit) throw new Error("Failed to resolve prompt footer state") - return hit -} - -async function waitModel(page: Page, value: string) { - await expect.poll(() => probe(page).then(modelKey), { timeout: 30_000 }).toBe(value) -} - -async function choose(page: Page, root: string, value: string) { - const select = page.locator(root) - await expect(select).toBeVisible() - await pickAgent(page, value) -} - -async function variantCount(page: Page) { - return (await probe(page))?.variants?.length ?? 0 -} - -async function agents(page: Page) { - return ((await probe(page))?.agents ?? []).map((item) => item.name).filter(Boolean) -} - -async function ensureVariant(page: Page, directory: string): Promise<Footer> { - const current = await read(page) - if ((await variantCount(page)) >= 2) return current - - const cfg = await createSdk(directory) - .config.get() - .then((x) => x.data) - const visible = new Set(await agents(page)) - const entry = Object.entries(cfg?.agent ?? {}).find((item) => { - const value = item[1] - return !!value && typeof value === "object" && "variant" in value && "model" in value && visible.has(item[0]) - }) - const name = entry?.[0] - test.skip(!name, "no agent with alternate variants available") - if (!name) return current - - await choose(page, promptAgentSelector, name) - await expect.poll(() => variantCount(page), { timeout: 30_000 }).toBeGreaterThanOrEqual(2) - return waitFooter(page, { agent: name }) -} - -async function chooseDifferentVariant(page: Page): Promise<Footer> { - const current = await read(page) - const next = (await probe(page))?.variants?.find((item) => item !== current.variant) - if (!next) throw new Error("Current model has no alternate variant to select") - - await pickVariant(page, next) - return waitFooter(page, { agent: current.agent, model: current.model, variant: next }) -} - -async function chooseOtherModel(page: Page, skip: string[] = []): Promise<Footer> { - const current = await currentModel(page) - const next = (await probe(page))?.models?.find((item) => { - const key = `${item.providerID}:${item.modelID}` - return key !== current && !skip.includes(key) - }) - if (!next) throw new Error("Failed to choose a different model") - await pickModel(page, { providerID: next.providerID, modelID: next.modelID }) - await expect.poll(async () => (await read(page)).model, { timeout: 30_000 }).toBe(next.name) - return read(page) -} - -async function goto(page: Page, directory: string, sessionID?: string) { - await page.goto(sessionPath(directory, sessionID)) - await waitSession(page, { directory, sessionID }) -} - -async function submit(project: Parameters<typeof test>[0]["project"], value: string) { - return project.prompt(value) -} - -async function createWorkspace(page: Page, root: string, seen: string[]) { - await openSidebar(page) - await page.getByRole("button", { name: "New workspace" }).first().click() - - const next = await resolveSlug(await waitSlug(page, [root, ...seen])) - await waitSession(page, { directory: next.directory }) - return next -} - -async function waitWorkspace(page: Page, slug: string) { - await openSidebar(page) - await expect - .poll( - async () => { - const item = page.locator(workspaceItemSelector(slug)).first() - try { - await item.hover({ timeout: 500 }) - return true - } catch { - return false - } - }, - { timeout: 60_000 }, - ) - .toBe(true) -} - -async function newWorkspaceSession(page: Page, slug: string) { - await waitWorkspace(page, slug) - const item = page.locator(workspaceItemSelector(slug)).first() - await item.hover() - - const button = page.locator(workspaceNewSessionSelector(slug)).first() - await expect(button).toBeVisible() - await button.click({ force: true }) - - const next = await resolveSlug(await waitSlug(page)) - return waitSession(page, { directory: next.directory }).then((item) => item.directory) -} - -test("session model restore per session without leaking into new sessions", async ({ page, project }) => { - await page.setViewportSize({ width: 1440, height: 900 }) - - await project.open() - await project.gotoSession() - - const firstState = await chooseOtherModel(page) - const firstKey = await currentModel(page) - const first = await submit(project, `session variant ${Date.now()}`) - - await page.reload() - await waitSession(page, { directory: project.directory, sessionID: first }) - await waitFooter(page, firstState) - - await project.gotoSession() - const fresh = await read(page) - expect(fresh.model).not.toBe(firstState.model) - - const secondState = await chooseOtherModel(page, [firstKey]) - const second = await submit(project, `session model ${Date.now()}`) - - await goto(page, project.directory, first) - await waitFooter(page, firstState) - - await goto(page, project.directory, second) - await waitFooter(page, secondState) - - await project.gotoSession() - await page.reload() - await waitSession(page, { directory: project.directory }) - await waitFooter(page, fresh) -}) - -test("session model restore across workspaces", async ({ page, project }) => { - await page.setViewportSize({ width: 1440, height: 900 }) - - await project.open() - const root = project.directory - await project.gotoSession() - - const firstState = await chooseOtherModel(page) - const firstKey = await currentModel(page) - const first = await submit(project, `root session ${Date.now()}`) - - await openSidebar(page) - await setWorkspacesEnabled(page, project.slug, true) - - const one = await createWorkspace(page, project.slug, []) - const oneDir = await newWorkspaceSession(page, one.slug) - project.trackDirectory(oneDir) - - const secondState = await chooseOtherModel(page, [firstKey]) - const secondKey = await currentModel(page) - const second = await submit(project, `workspace one ${Date.now()}`) - - const two = await createWorkspace(page, project.slug, [one.slug]) - const twoDir = await newWorkspaceSession(page, two.slug) - project.trackDirectory(twoDir) - - const thirdState = await chooseOtherModel(page, [firstKey, secondKey]) - const third = await submit(project, `workspace two ${Date.now()}`) - - await goto(page, root, first) - await waitFooter(page, firstState) - - await goto(page, oneDir, second) - await waitFooter(page, secondState) - - await goto(page, twoDir, third) - await waitFooter(page, thirdState) - - await goto(page, root, first) - await waitFooter(page, firstState) -}) - -test("variant preserved when switching agent modes", async ({ page, project }) => { - await page.setViewportSize({ width: 1440, height: 900 }) - - await project.open() - await project.gotoSession() - - await ensureVariant(page, project.directory) - const updated = await chooseDifferentVariant(page) - - const available = await agents(page) - const other = available.find((name) => name !== updated.agent) - test.skip(!other, "only one agent available") - if (!other) return - - await choose(page, promptAgentSelector, other) - await waitFooter(page, { agent: other, variant: updated.variant }) - - await choose(page, promptAgentSelector, updated.agent) - await waitFooter(page, { agent: updated.agent, variant: updated.variant }) -}) diff --git a/packages/app/e2e/session/session-review.spec.ts b/packages/app/e2e/session/session-review.spec.ts deleted file mode 100644 index c0a98cb2e..000000000 --- a/packages/app/e2e/session/session-review.spec.ts +++ /dev/null @@ -1,440 +0,0 @@ -import { waitSessionIdle, withSession } from "../actions" -import { test, expect } from "../fixtures" -import { bodyText } from "../prompt/mock" - -const count = 14 - -function body(mark: string) { - return [ - `title ${mark}`, - `mark ${mark}`, - ...Array.from({ length: 32 }, (_, i) => `line ${String(i + 1).padStart(2, "0")} ${mark}`), - ] -} - -function files(tag: string) { - return Array.from({ length: count }, (_, i) => { - const id = String(i).padStart(2, "0") - return { - file: `review-scroll-${id}.txt`, - mark: `${tag}-${id}`, - } - }) -} - -function seed(list: ReturnType<typeof files>) { - const out = ["*** Begin Patch"] - - for (const item of list) { - out.push(`*** Add File: ${item.file}`) - for (const line of body(item.mark)) out.push(`+${line}`) - } - - out.push("*** End Patch") - return out.join("\n") -} - -function edit(file: string, prev: string, next: string) { - return ["*** Begin Patch", `*** Update File: ${file}`, "@@", `-mark ${prev}`, `+mark ${next}`, "*** End Patch"].join( - "\n", - ) -} - -async function patchWithMock( - llm: Parameters<typeof test>[0]["llm"], - sdk: Parameters<typeof withSession>[0], - sessionID: string, - patchText: string, -) { - const callsBefore = await llm.calls() - await llm.toolMatch( - (hit) => bodyText(hit).includes("Your only valid response is one apply_patch tool call."), - "apply_patch", - { patchText }, - ) - await sdk.session.prompt({ - sessionID, - agent: "build", - system: [ - "You are seeding deterministic e2e UI state.", - "Your only valid response is one apply_patch tool call.", - `Use this JSON input: ${JSON.stringify({ patchText })}`, - "Do not call any other tools.", - "Do not output plain text.", - ].join("\n"), - parts: [{ type: "text", text: "Apply the provided patch exactly once." }], - }) - - await expect.poll(() => llm.calls().then((c) => c > callsBefore), { timeout: 30_000 }).toBe(true) - await expect - .poll( - async () => { - const diff = await sdk.session.diff({ sessionID }).then((res) => res.data ?? []) - return diff.length - }, - { timeout: 120_000 }, - ) - .toBeGreaterThan(0) -} - -async function show(page: Parameters<typeof test>[0]["page"]) { - const btn = page.getByRole("button", { name: "Toggle review" }).first() - await expect(btn).toBeVisible() - if ((await btn.getAttribute("aria-expanded")) !== "true") await btn.click() - await expect(btn).toHaveAttribute("aria-expanded", "true") -} - -async function expand(page: Parameters<typeof test>[0]["page"]) { - const close = page.getByRole("button", { name: /^Collapse all$/i }).first() - const open = await close - .isVisible() - .then((value) => value) - .catch(() => false) - - const btn = page.getByRole("button", { name: /^Expand all$/i }).first() - if (open) { - await close.click() - await expect(btn).toBeVisible() - } - - await expect(btn).toBeVisible() - await btn.click() - await expect(close).toBeVisible() -} - -async function waitMark(page: Parameters<typeof test>[0]["page"], file: string, mark: string) { - await page.waitForFunction( - ({ file, mark }) => { - const view = document.querySelector('[data-slot="session-review-scroll"] .scroll-view__viewport') - if (!(view instanceof HTMLElement)) return false - - const head = Array.from(view.querySelectorAll("h3")).find( - (node) => node instanceof HTMLElement && node.textContent?.includes(file), - ) - if (!(head instanceof HTMLElement)) return false - - return Array.from(head.parentElement?.querySelectorAll("diffs-container") ?? []).some((host) => { - if (!(host instanceof HTMLElement)) return false - const root = host.shadowRoot - return root?.textContent?.includes(`mark ${mark}`) ?? false - }) - }, - { file, mark }, - { timeout: 60_000 }, - ) -} - -async function spot(page: Parameters<typeof test>[0]["page"], file: string) { - return page.evaluate((file) => { - const view = document.querySelector('[data-slot="session-review-scroll"] .scroll-view__viewport') - if (!(view instanceof HTMLElement)) return null - - const row = Array.from(view.querySelectorAll("h3")).find( - (node) => node instanceof HTMLElement && node.textContent?.includes(file), - ) - if (!(row instanceof HTMLElement)) return null - - const a = row.getBoundingClientRect() - const b = view.getBoundingClientRect() - return { - top: a.top - b.top, - y: view.scrollTop, - } - }, file) -} - -async function comment(page: Parameters<typeof test>[0]["page"], file: string, note: string) { - const row = page.locator(`[data-file="${file}"]`).first() - await expect(row).toBeVisible() - - const line = row.locator('diffs-container [data-line="2"]').first() - await expect(line).toBeVisible() - await line.hover() - - const add = row.getByRole("button", { name: /^Comment$/ }).first() - await expect(add).toBeVisible() - await add.click() - - const area = row.locator('[data-slot="line-comment-textarea"]').first() - await expect(area).toBeVisible() - await area.fill(note) - - const submit = row.locator('[data-slot="line-comment-action"][data-variant="primary"]').first() - await expect(submit).toBeEnabled() - await submit.click() - - await expect(row.locator('[data-slot="line-comment-content"]').filter({ hasText: note }).first()).toBeVisible() - await expect(row.locator('[data-slot="line-comment-tools"]').first()).toBeVisible() -} - -async function overflow(page: Parameters<typeof test>[0]["page"], file: string) { - const row = page.locator(`[data-file="${file}"]`).first() - const view = page.locator('[data-slot="session-review-scroll"] .scroll-view__viewport').first() - const pop = row.locator('[data-slot="line-comment-popover"][data-inline-body]').first() - const tools = row.locator('[data-slot="line-comment-tools"]').first() - - const [width, viewBox, popBox, toolsBox] = await Promise.all([ - view.evaluate((el) => el.scrollWidth - el.clientWidth), - view.boundingBox(), - pop.boundingBox(), - tools.boundingBox(), - ]) - - if (!viewBox || !popBox || !toolsBox) return null - - return { - width, - pop: popBox.x + popBox.width - (viewBox.x + viewBox.width), - tools: toolsBox.x + toolsBox.width - (viewBox.x + viewBox.width), - } -} - -async function openReviewFile(page: Parameters<typeof test>[0]["page"], file: string) { - const row = page.locator(`[data-file="${file}"]`).first() - await expect(row).toBeVisible() - await row.hover() - - const open = row.getByRole("button", { name: /^Open file$/i }).first() - await expect(open).toBeVisible() - await open.click() - - const tab = page.getByRole("tab", { name: file }).first() - await expect(tab).toBeVisible() - await tab.click() - - const viewer = page.locator('[data-component="file"][data-mode="text"]').first() - await expect(viewer).toBeVisible() - return viewer -} - -async function fileComment(page: Parameters<typeof test>[0]["page"], note: string) { - const viewer = page.locator('[data-component="file"][data-mode="text"]').first() - await expect(viewer).toBeVisible() - - const line = viewer.locator('diffs-container [data-line="2"]').first() - await expect(line).toBeVisible() - await line.hover() - - const add = viewer.getByRole("button", { name: /^Comment$/ }).first() - await expect(add).toBeVisible() - await add.click() - - const area = viewer.locator('[data-slot="line-comment-textarea"]').first() - await expect(area).toBeVisible() - await area.fill(note) - - const submit = viewer.locator('[data-slot="line-comment-action"][data-variant="primary"]').first() - await expect(submit).toBeEnabled() - await submit.click() - - await expect(viewer.locator('[data-slot="line-comment-content"]').filter({ hasText: note }).first()).toBeVisible() - await expect(viewer.locator('[data-slot="line-comment-tools"]').first()).toBeVisible() -} - -async function fileOverflow(page: Parameters<typeof test>[0]["page"]) { - const viewer = page.locator('[data-component="file"][data-mode="text"]').first() - const view = page.locator('[role="tabpanel"] .scroll-view__viewport').first() - const pop = viewer.locator('[data-slot="line-comment-popover"][data-inline-body]').first() - const tools = viewer.locator('[data-slot="line-comment-tools"]').first() - - const [width, viewBox, popBox, toolsBox] = await Promise.all([ - view.evaluate((el) => el.scrollWidth - el.clientWidth), - view.boundingBox(), - pop.boundingBox(), - tools.boundingBox(), - ]) - - if (!viewBox || !popBox || !toolsBox) return null - - return { - width, - pop: popBox.x + popBox.width - (viewBox.x + viewBox.width), - tools: toolsBox.x + toolsBox.width - (viewBox.x + viewBox.width), - } -} - -test("review applies inline comment clicks without horizontal overflow", async ({ page, llm, project }) => { - test.setTimeout(180_000) - - const tag = `review-comment-${Date.now()}` - const file = `review-comment-${tag}.txt` - const note = `comment ${tag}` - - await page.setViewportSize({ width: 1280, height: 900 }) - - await project.open() - await withSession(project.sdk, `e2e review comment ${tag}`, async (session) => { - project.trackSession(session.id) - await patchWithMock(llm, project.sdk, session.id, seed([{ file, mark: tag }])) - - await expect - .poll( - async () => { - const diff = await project.sdk.session.diff({ sessionID: session.id }).then((res) => res.data ?? []) - return diff.length - }, - { timeout: 60_000 }, - ) - .toBe(1) - - await project.gotoSession(session.id) - await show(page) - - const tab = page.getByRole("tab", { name: /Review/i }).first() - await expect(tab).toBeVisible() - await tab.click() - - await expand(page) - await waitMark(page, file, tag) - await comment(page, file, note) - - await expect - .poll(async () => (await overflow(page, file))?.width ?? Number.POSITIVE_INFINITY, { timeout: 10_000 }) - .toBeLessThanOrEqual(1) - await expect - .poll(async () => (await overflow(page, file))?.pop ?? Number.POSITIVE_INFINITY, { timeout: 10_000 }) - .toBeLessThanOrEqual(1) - await expect - .poll(async () => (await overflow(page, file))?.tools ?? Number.POSITIVE_INFINITY, { timeout: 10_000 }) - .toBeLessThanOrEqual(1) - }) -}) - -test("review file comments submit on click without clipping actions", async ({ page, llm, project }) => { - test.setTimeout(180_000) - - const tag = `review-file-comment-${Date.now()}` - const file = `review-file-comment-${tag}.txt` - const note = `comment ${tag}` - - await page.setViewportSize({ width: 1280, height: 900 }) - - await project.open() - await withSession(project.sdk, `e2e review file comment ${tag}`, async (session) => { - project.trackSession(session.id) - await patchWithMock(llm, project.sdk, session.id, seed([{ file, mark: tag }])) - - await expect - .poll( - async () => { - const diff = await project.sdk.session.diff({ sessionID: session.id }).then((res) => res.data ?? []) - return diff.length - }, - { timeout: 60_000 }, - ) - .toBe(1) - - await project.gotoSession(session.id) - await show(page) - - const tab = page.getByRole("tab", { name: /Review/i }).first() - await expect(tab).toBeVisible() - await tab.click() - - await expand(page) - await waitMark(page, file, tag) - await openReviewFile(page, file) - await fileComment(page, note) - - await expect - .poll(async () => (await fileOverflow(page))?.width ?? Number.POSITIVE_INFINITY, { timeout: 10_000 }) - .toBeLessThanOrEqual(1) - await expect - .poll(async () => (await fileOverflow(page))?.pop ?? Number.POSITIVE_INFINITY, { timeout: 10_000 }) - .toBeLessThanOrEqual(1) - await expect - .poll(async () => (await fileOverflow(page))?.tools ?? Number.POSITIVE_INFINITY, { timeout: 10_000 }) - .toBeLessThanOrEqual(1) - }) -}) - -test.fixme("review keeps scroll position after a live diff update", async ({ page, llm, project }) => { - test.setTimeout(180_000) - - const tag = `review-${Date.now()}` - const list = files(tag) - const hit = list[list.length - 4]! - const next = `${tag}-live` - - await page.setViewportSize({ width: 1600, height: 1000 }) - - await project.open() - await withSession(project.sdk, `e2e review ${tag}`, async (session) => { - project.trackSession(session.id) - await patchWithMock(llm, project.sdk, session.id, seed(list)) - - await expect - .poll( - async () => { - const info = await project.sdk.session.get({ sessionID: session.id }).then((res) => res.data) - return info?.summary?.files ?? 0 - }, - { timeout: 60_000 }, - ) - .toBe(list.length) - - await expect - .poll( - async () => { - const diff = await project.sdk.session.diff({ sessionID: session.id }).then((res) => res.data ?? []) - return diff.length - }, - { timeout: 60_000 }, - ) - .toBe(list.length) - - await project.gotoSession(session.id) - await show(page) - - const tab = page.getByRole("tab", { name: /Review/i }).first() - await expect(tab).toBeVisible() - await tab.click() - - const view = page.locator('[data-slot="session-review-scroll"] .scroll-view__viewport').first() - await expect(view).toBeVisible() - const heads = page.getByRole("heading", { level: 3 }).filter({ hasText: /^review-scroll-/ }) - await expect(heads).toHaveCount(list.length, { timeout: 60_000 }) - - await expand(page) - await waitMark(page, hit.file, hit.mark) - - const row = page - .getByRole("heading", { - level: 3, - name: new RegExp(hit.file.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")), - }) - .first() - await expect(row).toBeVisible() - await row.evaluate((el) => el.scrollIntoView({ block: "center" })) - - await expect.poll(async () => (await spot(page, hit.file))?.y ?? 0).toBeGreaterThan(200) - const prev = await spot(page, hit.file) - if (!prev) throw new Error(`missing review row for ${hit.file}`) - - await patchWithMock(llm, project.sdk, session.id, edit(hit.file, hit.mark, next)) - - await expect - .poll( - async () => { - const diff = await project.sdk.session.diff({ sessionID: session.id }).then((res) => res.data ?? []) - const item = diff.find((item) => item.file === hit.file) - return typeof item?.after === "string" ? item.after : "" - }, - { timeout: 60_000 }, - ) - .toContain(`mark ${next}`) - - await waitMark(page, hit.file, next) - - await expect - .poll( - async () => { - const next = await spot(page, hit.file) - if (!next) return Number.POSITIVE_INFINITY - return Math.max(Math.abs(next.top - prev.top), Math.abs(next.y - prev.y)) - }, - { timeout: 60_000 }, - ) - .toBeLessThanOrEqual(32) - }) -}) diff --git a/packages/app/e2e/session/session-undo-redo.spec.ts b/packages/app/e2e/session/session-undo-redo.spec.ts deleted file mode 100644 index 709a45b4c..000000000 --- a/packages/app/e2e/session/session-undo-redo.spec.ts +++ /dev/null @@ -1,233 +0,0 @@ -import type { Page } from "@playwright/test" -import { test, expect } from "../fixtures" -import { withSession } from "../actions" -import { createSdk, modKey } from "../utils" -import { promptSelector } from "../selectors" - -async function seedConversation(input: { - page: Page - sdk: ReturnType<typeof createSdk> - sessionID: string - token: string -}) { - const messages = async () => - await input.sdk.session.messages({ sessionID: input.sessionID, limit: 100 }).then((r) => r.data ?? []) - const seeded = await messages() - const userIDs = new Set(seeded.filter((m) => m.info.role === "user").map((m) => m.info.id)) - - const prompt = input.page.locator(promptSelector) - await expect(prompt).toBeVisible() - await input.sdk.session.promptAsync({ - sessionID: input.sessionID, - noReply: true, - parts: [{ type: "text", text: input.token }], - }) - - let userMessageID: string | undefined - await expect - .poll( - async () => { - const users = (await messages()).filter( - (m) => - !userIDs.has(m.info.id) && - m.info.role === "user" && - m.parts.filter((p) => p.type === "text").some((p) => p.text.includes(input.token)), - ) - if (users.length === 0) return false - - const user = users[users.length - 1] - if (!user) return false - userMessageID = user.info.id - return true - }, - { timeout: 90_000, intervals: [250, 500, 1_000] }, - ) - .toBe(true) - - if (!userMessageID) throw new Error("Expected a user message id") - await expect(input.page.locator(`[data-message-id="${userMessageID}"]`)).toHaveCount(1, { timeout: 30_000 }) - return { prompt, userMessageID } -} - -test("slash undo sets revert and restores prior prompt", async ({ page, project }) => { - test.setTimeout(120_000) - - const token = `undo_${Date.now()}` - - await project.open() - const sdk = project.sdk - - await withSession(sdk, `e2e undo ${Date.now()}`, async (session) => { - project.trackSession(session.id) - await project.gotoSession(session.id) - - const seeded = await seedConversation({ page, sdk, sessionID: session.id, token }) - - await seeded.prompt.click() - await page.keyboard.type("/undo") - - const undo = page.locator('[data-slash-id="session.undo"]').first() - await expect(undo).toBeVisible() - await page.keyboard.press("Enter") - - await expect - .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), { - timeout: 30_000, - }) - .toBe(seeded.userMessageID) - - await expect(seeded.prompt).toContainText(token) - await expect(page.locator(`[data-message-id="${seeded.userMessageID}"]`)).toHaveCount(0) - }) -}) - -test("slash redo clears revert and restores latest state", async ({ page, project }) => { - test.setTimeout(120_000) - - const token = `redo_${Date.now()}` - - await project.open() - const sdk = project.sdk - - await withSession(sdk, `e2e redo ${Date.now()}`, async (session) => { - project.trackSession(session.id) - await project.gotoSession(session.id) - - const seeded = await seedConversation({ page, sdk, sessionID: session.id, token }) - - await seeded.prompt.click() - await page.keyboard.type("/undo") - - const undo = page.locator('[data-slash-id="session.undo"]').first() - await expect(undo).toBeVisible() - await page.keyboard.press("Enter") - - await expect - .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), { - timeout: 30_000, - }) - .toBe(seeded.userMessageID) - - await seeded.prompt.click() - await page.keyboard.press(`${modKey}+A`) - await page.keyboard.press("Backspace") - await page.keyboard.type("/redo") - - const redo = page.locator('[data-slash-id="session.redo"]').first() - await expect(redo).toBeVisible() - await page.keyboard.press("Enter") - - await expect - .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), { - timeout: 30_000, - }) - .toBeUndefined() - - await expect(seeded.prompt).not.toContainText(token) - await expect(page.locator(`[data-message-id="${seeded.userMessageID}"]`)).toHaveCount(1) - }) -}) - -test("slash undo/redo traverses multi-step revert stack", async ({ page, project }) => { - test.setTimeout(120_000) - - const firstToken = `undo_redo_first_${Date.now()}` - const secondToken = `undo_redo_second_${Date.now()}` - - await project.open() - const sdk = project.sdk - - await withSession(sdk, `e2e undo redo stack ${Date.now()}`, async (session) => { - project.trackSession(session.id) - await project.gotoSession(session.id) - - const first = await seedConversation({ - page, - sdk, - sessionID: session.id, - token: firstToken, - }) - const second = await seedConversation({ - page, - sdk, - sessionID: session.id, - token: secondToken, - }) - - expect(first.userMessageID).not.toBe(second.userMessageID) - - const firstMessage = page.locator(`[data-message-id="${first.userMessageID}"]`) - const secondMessage = page.locator(`[data-message-id="${second.userMessageID}"]`) - - await expect(firstMessage).toHaveCount(1) - await expect(secondMessage).toHaveCount(1) - - await second.prompt.click() - await page.keyboard.press(`${modKey}+A`) - await page.keyboard.press("Backspace") - await page.keyboard.type("/undo") - - const undo = page.locator('[data-slash-id="session.undo"]').first() - await expect(undo).toBeVisible() - await page.keyboard.press("Enter") - - await expect - .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), { - timeout: 30_000, - }) - .toBe(second.userMessageID) - - await expect(firstMessage).toHaveCount(1) - await expect(secondMessage).toHaveCount(0) - - await second.prompt.click() - await page.keyboard.press(`${modKey}+A`) - await page.keyboard.press("Backspace") - await page.keyboard.type("/undo") - await expect(undo).toBeVisible() - await page.keyboard.press("Enter") - - await expect - .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), { - timeout: 30_000, - }) - .toBe(first.userMessageID) - - await expect(firstMessage).toHaveCount(0) - await expect(secondMessage).toHaveCount(0) - - await second.prompt.click() - await page.keyboard.press(`${modKey}+A`) - await page.keyboard.press("Backspace") - await page.keyboard.type("/redo") - - const redo = page.locator('[data-slash-id="session.redo"]').first() - await expect(redo).toBeVisible() - await page.keyboard.press("Enter") - - await expect - .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), { - timeout: 30_000, - }) - .toBe(second.userMessageID) - - await expect(firstMessage).toHaveCount(1) - await expect(secondMessage).toHaveCount(0) - - await second.prompt.click() - await page.keyboard.press(`${modKey}+A`) - await page.keyboard.press("Backspace") - await page.keyboard.type("/redo") - await expect(redo).toBeVisible() - await page.keyboard.press("Enter") - - await expect - .poll(async () => await sdk.session.get({ sessionID: session.id }).then((r) => r.data?.revert?.messageID), { - timeout: 30_000, - }) - .toBeUndefined() - - await expect(firstMessage).toHaveCount(1) - await expect(secondMessage).toHaveCount(1) - }) -}) diff --git a/packages/app/e2e/session/session.spec.ts b/packages/app/e2e/session/session.spec.ts deleted file mode 100644 index 1b5fb1b60..000000000 --- a/packages/app/e2e/session/session.spec.ts +++ /dev/null @@ -1,182 +0,0 @@ -import { test, expect } from "../fixtures" -import { - openSidebar, - openSessionMoreMenu, - clickMenuItem, - confirmDialog, - openSharePopover, - withSession, -} from "../actions" -import { sessionItemSelector, inlineInputSelector } from "../selectors" - -const shareDisabled = process.env.OPENCODE_DISABLE_SHARE === "true" || process.env.OPENCODE_DISABLE_SHARE === "1" - -type Sdk = Parameters<typeof withSession>[0] - -async function seedMessage(sdk: Sdk, sessionID: string) { - await sdk.session.promptAsync({ - sessionID, - noReply: true, - parts: [{ type: "text", text: "e2e seed" }], - }) - - await expect - .poll( - async () => { - const messages = await sdk.session.messages({ sessionID, limit: 1 }).then((r) => r.data ?? []) - return messages.length - }, - { timeout: 30_000 }, - ) - .toBeGreaterThan(0) -} - -test("session can be renamed via header menu", async ({ page, project }) => { - const stamp = Date.now() - const originalTitle = `e2e rename test ${stamp}` - const renamedTitle = `e2e renamed ${stamp}` - - await project.open() - await withSession(project.sdk, originalTitle, async (session) => { - project.trackSession(session.id) - await seedMessage(project.sdk, session.id) - await project.gotoSession(session.id) - await expect(page.getByRole("heading", { level: 1 }).first()).toHaveText(originalTitle) - - const menu = await openSessionMoreMenu(page, session.id) - await clickMenuItem(menu, /rename/i) - - const input = page.locator(".scroll-view__viewport").locator(inlineInputSelector).first() - await expect(input).toBeVisible() - await expect(input).toBeFocused() - await input.fill(renamedTitle) - await expect(input).toHaveValue(renamedTitle) - await input.press("Enter") - - await expect - .poll( - async () => { - const data = await project.sdk.session.get({ sessionID: session.id }).then((r) => r.data) - return data?.title - }, - { timeout: 30_000 }, - ) - .toBe(renamedTitle) - - await expect(page.getByRole("heading", { level: 1 }).first()).toHaveText(renamedTitle) - }) -}) - -test("session can be archived via header menu", async ({ page, project }) => { - const stamp = Date.now() - const title = `e2e archive test ${stamp}` - - await project.open() - await withSession(project.sdk, title, async (session) => { - project.trackSession(session.id) - await seedMessage(project.sdk, session.id) - await project.gotoSession(session.id) - const menu = await openSessionMoreMenu(page, session.id) - await clickMenuItem(menu, /archive/i) - - await expect - .poll( - async () => { - const data = await project.sdk.session.get({ sessionID: session.id }).then((r) => r.data) - return data?.time?.archived - }, - { timeout: 30_000 }, - ) - .not.toBeUndefined() - - await openSidebar(page) - await expect(page.locator(sessionItemSelector(session.id))).toHaveCount(0) - }) -}) - -test("session can be deleted via header menu", async ({ page, project }) => { - const stamp = Date.now() - const title = `e2e delete test ${stamp}` - - await project.open() - await withSession(project.sdk, title, async (session) => { - project.trackSession(session.id) - await seedMessage(project.sdk, session.id) - await project.gotoSession(session.id) - const menu = await openSessionMoreMenu(page, session.id) - await clickMenuItem(menu, /delete/i) - await confirmDialog(page, /delete/i) - - await expect - .poll( - async () => { - const data = await project.sdk.session - .get({ sessionID: session.id }) - .then((r) => r.data) - .catch(() => undefined) - return data?.id - }, - { timeout: 30_000 }, - ) - .toBeUndefined() - - await openSidebar(page) - await expect(page.locator(sessionItemSelector(session.id))).toHaveCount(0) - }) -}) - -test("session can be shared and unshared via header button", async ({ page, project }) => { - test.skip(shareDisabled, "Share is disabled in this environment (OPENCODE_DISABLE_SHARE).") - - const stamp = Date.now() - const title = `e2e share test ${stamp}` - - await project.open() - await withSession(project.sdk, title, async (session) => { - project.trackSession(session.id) - await project.gotoSession(session.id) - await project.prompt(`share seed ${stamp}`) - - const shared = await openSharePopover(page) - const publish = shared.popoverBody.getByRole("button", { name: "Publish" }).first() - await expect(publish).toBeVisible({ timeout: 30_000 }) - await publish.click() - - await expect(shared.popoverBody.getByRole("button", { name: "Unpublish" }).first()).toBeVisible({ - timeout: 30_000, - }) - - await expect - .poll( - async () => { - const data = await project.sdk.session.get({ sessionID: session.id }).then((r) => r.data) - return data?.share?.url || undefined - }, - { timeout: 30_000 }, - ) - .not.toBeUndefined() - - const unpublish = shared.popoverBody.getByRole("button", { name: "Unpublish" }).first() - await expect(unpublish).toBeVisible({ timeout: 30_000 }) - await unpublish.click() - - await expect(shared.popoverBody.getByRole("button", { name: "Publish" }).first()).toBeVisible({ - timeout: 30_000, - }) - - await expect - .poll( - async () => { - const data = await project.sdk.session.get({ sessionID: session.id }).then((r) => r.data) - return data?.share?.url || undefined - }, - { timeout: 30_000 }, - ) - .toBeUndefined() - - const unshared = await openSharePopover(page) - await expect(unshared.popoverBody.getByRole("button", { name: "Publish" }).first()).toBeVisible({ - timeout: 30_000, - }) - }) -}) diff --git a/packages/app/e2e/settings/settings-keybinds.spec.ts b/packages/app/e2e/settings/settings-keybinds.spec.ts deleted file mode 100644 index 4fc50b68d..000000000 --- a/packages/app/e2e/settings/settings-keybinds.spec.ts +++ /dev/null @@ -1,389 +0,0 @@ -import { test, expect } from "../fixtures" -import { openSettings, closeDialog, waitTerminalFocusIdle, withSession } from "../actions" -import { keybindButtonSelector, terminalSelector } from "../selectors" -import { modKey } from "../utils" - -test("changing sidebar toggle keybind works", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - await dialog.getByRole("tab", { name: "Shortcuts" }).click() - - const keybindButton = dialog.locator(keybindButtonSelector("sidebar.toggle")).first() - await expect(keybindButton).toBeVisible() - - const initialKeybind = await keybindButton.textContent() - expect(initialKeybind).toContain("B") - - await keybindButton.click() - await expect(keybindButton).toHaveText(/press/i) - - await page.keyboard.press(`${modKey}+Shift+KeyH`) - await page.waitForTimeout(100) - - const newKeybind = await keybindButton.textContent() - expect(newKeybind).toContain("H") - - const stored = await page.evaluate(() => { - const raw = localStorage.getItem("settings.v3") - return raw ? JSON.parse(raw) : null - }) - expect(stored?.keybinds?.["sidebar.toggle"]).toBe("mod+shift+h") - - await closeDialog(page, dialog) - - const button = page.getByRole("button", { name: /toggle sidebar/i }).first() - const initiallyClosed = (await button.getAttribute("aria-expanded")) !== "true" - - await page.keyboard.press(`${modKey}+Shift+H`) - await expect(button).toHaveAttribute("aria-expanded", initiallyClosed ? "true" : "false") - - const afterToggleClosed = (await button.getAttribute("aria-expanded")) !== "true" - expect(afterToggleClosed).toBe(!initiallyClosed) - - await page.keyboard.press(`${modKey}+Shift+H`) - await expect(button).toHaveAttribute("aria-expanded", initiallyClosed ? "false" : "true") - - const finalClosed = (await button.getAttribute("aria-expanded")) !== "true" - expect(finalClosed).toBe(initiallyClosed) -}) - -test("sidebar toggle keybind guards against shortcut conflicts", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - await dialog.getByRole("tab", { name: "Shortcuts" }).click() - - const keybindButton = dialog.locator(keybindButtonSelector("sidebar.toggle")) - await expect(keybindButton).toBeVisible() - - const initialKeybind = await keybindButton.textContent() - expect(initialKeybind).toContain("B") - - await keybindButton.click() - await expect(keybindButton).toHaveText(/press/i) - - await page.keyboard.press(`${modKey}+Shift+KeyP`) - await page.waitForTimeout(100) - - const toast = page.locator('[data-component="toast"]').last() - await expect(toast).toBeVisible() - await expect(toast).toContainText(/already/i) - - await keybindButton.click() - await expect(keybindButton).toContainText("B") - - const stored = await page.evaluate(() => { - const raw = localStorage.getItem("settings.v3") - return raw ? JSON.parse(raw) : null - }) - expect(stored?.keybinds?.["sidebar.toggle"]).toBeUndefined() - - await closeDialog(page, dialog) -}) - -test("resetting all keybinds to defaults works", async ({ page, gotoSession }) => { - await page.addInitScript(() => { - localStorage.setItem("settings.v3", JSON.stringify({ keybinds: { "sidebar.toggle": "mod+shift+x" } })) - }) - - await gotoSession() - - const dialog = await openSettings(page) - await dialog.getByRole("tab", { name: "Shortcuts" }).click() - - const keybindButton = dialog.locator(keybindButtonSelector("sidebar.toggle")) - await expect(keybindButton).toBeVisible() - - const customKeybind = await keybindButton.textContent() - expect(customKeybind).toContain("X") - - const resetButton = dialog.getByRole("button", { name: "Reset to defaults" }) - await expect(resetButton).toBeVisible() - await expect(resetButton).toBeEnabled() - await resetButton.click() - await page.waitForTimeout(100) - - const restoredKeybind = await keybindButton.textContent() - expect(restoredKeybind).toContain("B") - - const stored = await page.evaluate(() => { - const raw = localStorage.getItem("settings.v3") - return raw ? JSON.parse(raw) : null - }) - expect(stored?.keybinds?.["sidebar.toggle"]).toBeUndefined() - - await closeDialog(page, dialog) -}) - -test("clearing a keybind works", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - await dialog.getByRole("tab", { name: "Shortcuts" }).click() - - const keybindButton = dialog.locator(keybindButtonSelector("sidebar.toggle")) - await expect(keybindButton).toBeVisible() - - const initialKeybind = await keybindButton.textContent() - expect(initialKeybind).toContain("B") - - await keybindButton.click() - await expect(keybindButton).toHaveText(/press/i) - - await page.keyboard.press("Delete") - await page.waitForTimeout(100) - - const clearedKeybind = await keybindButton.textContent() - expect(clearedKeybind).toMatch(/unassigned|press/i) - - const stored = await page.evaluate(() => { - const raw = localStorage.getItem("settings.v3") - return raw ? JSON.parse(raw) : null - }) - expect(stored?.keybinds?.["sidebar.toggle"]).toBe("none") - - await closeDialog(page, dialog) - - await page.keyboard.press(`${modKey}+B`) - await page.waitForTimeout(100) - - const stillOnSession = page.url().includes("/session") - expect(stillOnSession).toBe(true) -}) - -test("changing settings open keybind works", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - await dialog.getByRole("tab", { name: "Shortcuts" }).click() - - const keybindButton = dialog.locator(keybindButtonSelector("settings.open")) - await expect(keybindButton).toBeVisible() - - const initialKeybind = await keybindButton.textContent() - expect(initialKeybind).toContain(",") - - await keybindButton.click() - await expect(keybindButton).toHaveText(/press/i) - - await page.keyboard.press(`${modKey}+Slash`) - await page.waitForTimeout(100) - - const newKeybind = await keybindButton.textContent() - expect(newKeybind).toContain("/") - - const stored = await page.evaluate(() => { - const raw = localStorage.getItem("settings.v3") - return raw ? JSON.parse(raw) : null - }) - expect(stored?.keybinds?.["settings.open"]).toBe("mod+/") - - await closeDialog(page, dialog) - - const settingsDialog = page.getByRole("dialog") - await expect(settingsDialog).toHaveCount(0) - - await page.keyboard.press(`${modKey}+Slash`) - await page.waitForTimeout(100) - - await expect(settingsDialog).toBeVisible() - - await closeDialog(page, settingsDialog) -}) - -test("changing new session keybind works", async ({ page, sdk, gotoSession }) => { - await withSession(sdk, "test session for keybind", async (session) => { - await gotoSession(session.id) - - const initialUrl = page.url() - expect(initialUrl).toContain(`/session/${session.id}`) - - const dialog = await openSettings(page) - await dialog.getByRole("tab", { name: "Shortcuts" }).click() - - const keybindButton = dialog.locator(keybindButtonSelector("session.new")) - await expect(keybindButton).toBeVisible() - - await keybindButton.click() - await expect(keybindButton).toHaveText(/press/i) - - await page.keyboard.press(`${modKey}+Shift+KeyN`) - await page.waitForTimeout(100) - - const newKeybind = await keybindButton.textContent() - expect(newKeybind).toContain("N") - - const stored = await page.evaluate(() => { - const raw = localStorage.getItem("settings.v3") - return raw ? JSON.parse(raw) : null - }) - expect(stored?.keybinds?.["session.new"]).toBe("mod+shift+n") - - await closeDialog(page, dialog) - - await page.keyboard.press(`${modKey}+Shift+N`) - await page.waitForTimeout(200) - - const newUrl = page.url() - expect(newUrl).toMatch(/\/session\/?$/) - expect(newUrl).not.toContain(session.id) - }) -}) - -test("changing file open keybind works", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - await dialog.getByRole("tab", { name: "Shortcuts" }).click() - - const keybindButton = dialog.locator(keybindButtonSelector("file.open")) - await expect(keybindButton).toBeVisible() - - const initialKeybind = await keybindButton.textContent() - expect(initialKeybind).toContain("K") - - await keybindButton.click() - await expect(keybindButton).toHaveText(/press/i) - - await page.keyboard.press(`${modKey}+Shift+KeyF`) - await page.waitForTimeout(100) - - const newKeybind = await keybindButton.textContent() - expect(newKeybind).toContain("F") - - const stored = await page.evaluate(() => { - const raw = localStorage.getItem("settings.v3") - return raw ? JSON.parse(raw) : null - }) - expect(stored?.keybinds?.["file.open"]).toBe("mod+shift+f") - - await closeDialog(page, dialog) - - const filePickerDialog = page.getByRole("dialog").filter({ has: page.getByPlaceholder(/search files/i) }) - await expect(filePickerDialog).toHaveCount(0) - - await page.keyboard.press(`${modKey}+Shift+F`) - await page.waitForTimeout(100) - - await expect(filePickerDialog).toBeVisible() - - await page.keyboard.press("Escape") - await expect(filePickerDialog).toHaveCount(0) -}) - -test("changing terminal toggle keybind works", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - await dialog.getByRole("tab", { name: "Shortcuts" }).click() - - const keybindButton = dialog.locator(keybindButtonSelector("terminal.toggle")) - await expect(keybindButton).toBeVisible() - - await keybindButton.click() - await expect(keybindButton).toHaveText(/press/i) - - await page.keyboard.press(`${modKey}+KeyY`) - await page.waitForTimeout(100) - - const newKeybind = await keybindButton.textContent() - expect(newKeybind).toContain("Y") - - const stored = await page.evaluate(() => { - const raw = localStorage.getItem("settings.v3") - return raw ? JSON.parse(raw) : null - }) - expect(stored?.keybinds?.["terminal.toggle"]).toBe("mod+y") - - await closeDialog(page, dialog) - - const terminal = page.locator(terminalSelector) - await expect(terminal).not.toBeVisible() - - await page.keyboard.press(`${modKey}+Y`) - await waitTerminalFocusIdle(page, { term: terminal }) - - await page.keyboard.press(`${modKey}+Y`) - await expect(terminal).not.toBeVisible() -}) - -test("terminal toggle keybind persists after reload", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - await dialog.getByRole("tab", { name: "Shortcuts" }).click() - - const keybindButton = dialog.locator(keybindButtonSelector("terminal.toggle")) - await expect(keybindButton).toBeVisible() - - await keybindButton.click() - await expect(keybindButton).toHaveText(/press/i) - - await page.keyboard.press(`${modKey}+Shift+KeyY`) - await page.waitForTimeout(100) - - await expect(keybindButton).toContainText("Y") - await closeDialog(page, dialog) - - await page.reload() - - await expect - .poll(async () => { - return await page.evaluate(() => { - const raw = localStorage.getItem("settings.v3") - if (!raw) return - const parsed = JSON.parse(raw) - return parsed?.keybinds?.["terminal.toggle"] - }) - }) - .toBe("mod+shift+y") - - const reloaded = await openSettings(page) - await reloaded.getByRole("tab", { name: "Shortcuts" }).click() - const reloadedKeybind = reloaded.locator(keybindButtonSelector("terminal.toggle")).first() - await expect(reloadedKeybind).toContainText("Y") - await closeDialog(page, reloaded) -}) - -test("changing command palette keybind works", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - await dialog.getByRole("tab", { name: "Shortcuts" }).click() - - const keybindButton = dialog.locator(keybindButtonSelector("command.palette")) - await expect(keybindButton).toBeVisible() - - const initialKeybind = await keybindButton.textContent() - expect(initialKeybind).toContain("P") - - await keybindButton.click() - await expect(keybindButton).toHaveText(/press/i) - - await page.keyboard.press(`${modKey}+Shift+KeyK`) - await page.waitForTimeout(100) - - const newKeybind = await keybindButton.textContent() - expect(newKeybind).toContain("K") - - const stored = await page.evaluate(() => { - const raw = localStorage.getItem("settings.v3") - return raw ? JSON.parse(raw) : null - }) - expect(stored?.keybinds?.["command.palette"]).toBe("mod+shift+k") - - await closeDialog(page, dialog) - - const palette = page.getByRole("dialog").filter({ has: page.getByRole("textbox").first() }) - await expect(palette).toHaveCount(0) - - await page.keyboard.press(`${modKey}+Shift+K`) - await page.waitForTimeout(100) - - await expect(palette).toBeVisible() - await expect(palette.getByRole("textbox").first()).toBeVisible() - - await page.keyboard.press("Escape") - await expect(palette).toHaveCount(0) -}) diff --git a/packages/app/e2e/settings/settings-models.spec.ts b/packages/app/e2e/settings/settings-models.spec.ts deleted file mode 100644 index f7397abe8..000000000 --- a/packages/app/e2e/settings/settings-models.spec.ts +++ /dev/null @@ -1,122 +0,0 @@ -import { test, expect } from "../fixtures" -import { promptSelector } from "../selectors" -import { closeDialog, openSettings } from "../actions" - -test("hiding a model removes it from the model picker", async ({ page, gotoSession }) => { - await gotoSession() - - await page.locator(promptSelector).click() - await page.keyboard.type("/model") - - const command = page.locator('[data-slash-id="model.choose"]') - await expect(command).toBeVisible() - await command.hover() - await page.keyboard.press("Enter") - - const picker = page.getByRole("dialog") - await expect(picker).toBeVisible() - - const target = picker.locator('[data-slot="list-item"]').first() - await expect(target).toBeVisible() - - const key = await target.getAttribute("data-key") - if (!key) throw new Error("Failed to resolve model key from list item") - - const name = (await target.locator("span").first().innerText()).trim() - if (!name) throw new Error("Failed to resolve model name from list item") - - await page.keyboard.press("Escape") - await expect(picker).toHaveCount(0) - - const settings = await openSettings(page) - - await settings.getByRole("tab", { name: "Models" }).click() - const search = settings.getByPlaceholder("Search models") - await expect(search).toBeVisible() - await search.fill(name) - - const toggle = settings.locator('[data-component="switch"]').filter({ hasText: name }).first() - const input = toggle.locator('[data-slot="switch-input"]') - await expect(toggle).toBeVisible() - await expect(input).toHaveAttribute("aria-checked", "true") - await toggle.locator('[data-slot="switch-control"]').click() - await expect(input).toHaveAttribute("aria-checked", "false") - - await closeDialog(page, settings) - - await page.locator(promptSelector).click() - await page.keyboard.type("/model") - await expect(command).toBeVisible() - await command.hover() - await page.keyboard.press("Enter") - - const pickerAgain = page.getByRole("dialog") - await expect(pickerAgain).toBeVisible() - await expect(pickerAgain.locator('[data-slot="list-item"]').first()).toBeVisible() - - await expect(pickerAgain.locator(`[data-slot="list-item"][data-key="${key}"]`)).toHaveCount(0) - - await page.keyboard.press("Escape") - await expect(pickerAgain).toHaveCount(0) -}) - -test("showing a hidden model restores it to the model picker", async ({ page, gotoSession }) => { - await gotoSession() - - await page.locator(promptSelector).click() - await page.keyboard.type("/model") - - const command = page.locator('[data-slash-id="model.choose"]') - await expect(command).toBeVisible() - await command.hover() - await page.keyboard.press("Enter") - - const picker = page.getByRole("dialog") - await expect(picker).toBeVisible() - - const target = picker.locator('[data-slot="list-item"]').first() - await expect(target).toBeVisible() - - const key = await target.getAttribute("data-key") - if (!key) throw new Error("Failed to resolve model key from list item") - - const name = (await target.locator("span").first().innerText()).trim() - if (!name) throw new Error("Failed to resolve model name from list item") - - await page.keyboard.press("Escape") - await expect(picker).toHaveCount(0) - - const settings = await openSettings(page) - - await settings.getByRole("tab", { name: "Models" }).click() - const search = settings.getByPlaceholder("Search models") - await expect(search).toBeVisible() - await search.fill(name) - - const toggle = settings.locator('[data-component="switch"]').filter({ hasText: name }).first() - const input = toggle.locator('[data-slot="switch-input"]') - await expect(toggle).toBeVisible() - await expect(input).toHaveAttribute("aria-checked", "true") - - await toggle.locator('[data-slot="switch-control"]').click() - await expect(input).toHaveAttribute("aria-checked", "false") - - await toggle.locator('[data-slot="switch-control"]').click() - await expect(input).toHaveAttribute("aria-checked", "true") - - await closeDialog(page, settings) - - await page.locator(promptSelector).click() - await page.keyboard.type("/model") - await expect(command).toBeVisible() - await command.hover() - await page.keyboard.press("Enter") - - const pickerAgain = page.getByRole("dialog") - await expect(pickerAgain).toBeVisible() - - await expect(pickerAgain.locator(`[data-slot="list-item"][data-key="${key}"]`)).toBeVisible() - - await page.keyboard.press("Escape") - await expect(pickerAgain).toHaveCount(0) -}) diff --git a/packages/app/e2e/settings/settings-providers.spec.ts b/packages/app/e2e/settings/settings-providers.spec.ts deleted file mode 100644 index a55eb3498..000000000 --- a/packages/app/e2e/settings/settings-providers.spec.ts +++ /dev/null @@ -1,136 +0,0 @@ -import { test, expect } from "../fixtures" -import { closeDialog, openSettings } from "../actions" - -test("custom provider form can be filled and validates input", async ({ page, gotoSession }) => { - await gotoSession() - - const settings = await openSettings(page) - await settings.getByRole("tab", { name: "Providers" }).click() - - const customProviderSection = settings.locator('[data-component="custom-provider-section"]') - await expect(customProviderSection).toBeVisible() - - const connectButton = customProviderSection.getByRole("button", { name: "Connect" }) - await connectButton.click() - - const providerDialog = page.getByRole("dialog").filter({ has: page.getByText("Custom provider") }) - await expect(providerDialog).toBeVisible() - - await providerDialog.getByLabel("Provider ID").fill("test-provider") - await providerDialog.getByLabel("Display name").fill("Test Provider") - await providerDialog.getByLabel("Base URL").fill("http://localhost:9999/fake") - await providerDialog.getByLabel("API key").fill("fake-key") - - await providerDialog.getByPlaceholder("model-id").first().fill("test-model") - await providerDialog.getByPlaceholder("Display Name").first().fill("Test Model") - - await expect(providerDialog.getByRole("textbox", { name: "Provider ID" })).toHaveValue("test-provider") - await expect(providerDialog.getByRole("textbox", { name: "Display name" })).toHaveValue("Test Provider") - await expect(providerDialog.getByRole("textbox", { name: "Base URL" })).toHaveValue("http://localhost:9999/fake") - await expect(providerDialog.getByRole("textbox", { name: "API key" })).toHaveValue("fake-key") - await expect(providerDialog.getByPlaceholder("model-id").first()).toHaveValue("test-model") - await expect(providerDialog.getByPlaceholder("Display Name").first()).toHaveValue("Test Model") - - await page.keyboard.press("Escape") - await expect(providerDialog).toHaveCount(0) - - await closeDialog(page, settings) -}) - -test("custom provider form shows validation errors", async ({ page, gotoSession }) => { - await gotoSession() - - const settings = await openSettings(page) - await settings.getByRole("tab", { name: "Providers" }).click() - - const customProviderSection = settings.locator('[data-component="custom-provider-section"]') - await customProviderSection.getByRole("button", { name: "Connect" }).click() - - const providerDialog = page.getByRole("dialog").filter({ has: page.getByText("Custom provider") }) - await expect(providerDialog).toBeVisible() - - await providerDialog.getByLabel("Provider ID").fill("invalid provider id") - await providerDialog.getByLabel("Base URL").fill("not-a-url") - - await providerDialog.getByRole("button", { name: /submit|save/i }).click() - - await expect(providerDialog.locator('[data-slot="input-error"]').filter({ hasText: /lowercase/i })).toBeVisible() - await expect(providerDialog.locator('[data-slot="input-error"]').filter({ hasText: /http/i })).toBeVisible() - - await page.keyboard.press("Escape") - await expect(providerDialog).toHaveCount(0) - - await closeDialog(page, settings) -}) - -test("custom provider form can add and remove models", async ({ page, gotoSession }) => { - await gotoSession() - - const settings = await openSettings(page) - await settings.getByRole("tab", { name: "Providers" }).click() - - const customProviderSection = settings.locator('[data-component="custom-provider-section"]') - await customProviderSection.getByRole("button", { name: "Connect" }).click() - - const providerDialog = page.getByRole("dialog").filter({ has: page.getByText("Custom provider") }) - await expect(providerDialog).toBeVisible() - - await providerDialog.getByLabel("Provider ID").fill("multi-model-test") - await providerDialog.getByLabel("Display name").fill("Multi Model Test") - await providerDialog.getByLabel("Base URL").fill("http://localhost:9999/multi") - - await providerDialog.getByPlaceholder("model-id").first().fill("model-1") - await providerDialog.getByPlaceholder("Display Name").first().fill("Model 1") - - const idInputsBefore = await providerDialog.getByPlaceholder("model-id").count() - await providerDialog.getByRole("button", { name: "Add model" }).click() - const idInputsAfter = await providerDialog.getByPlaceholder("model-id").count() - expect(idInputsAfter).toBe(idInputsBefore + 1) - - await providerDialog.getByPlaceholder("model-id").nth(1).fill("model-2") - await providerDialog.getByPlaceholder("Display Name").nth(1).fill("Model 2") - - await expect(providerDialog.getByPlaceholder("model-id").nth(1)).toHaveValue("model-2") - await expect(providerDialog.getByPlaceholder("Display Name").nth(1)).toHaveValue("Model 2") - - await page.keyboard.press("Escape") - await expect(providerDialog).toHaveCount(0) - - await closeDialog(page, settings) -}) - -test("custom provider form can add and remove headers", async ({ page, gotoSession }) => { - await gotoSession() - - const settings = await openSettings(page) - await settings.getByRole("tab", { name: "Providers" }).click() - - const customProviderSection = settings.locator('[data-component="custom-provider-section"]') - await customProviderSection.getByRole("button", { name: "Connect" }).click() - - const providerDialog = page.getByRole("dialog").filter({ has: page.getByText("Custom provider") }) - await expect(providerDialog).toBeVisible() - - await providerDialog.getByLabel("Provider ID").fill("header-test") - await providerDialog.getByLabel("Display name").fill("Header Test") - await providerDialog.getByLabel("Base URL").fill("http://localhost:9999/headers") - - await providerDialog.getByPlaceholder("model-id").first().fill("model-x") - await providerDialog.getByPlaceholder("Display Name").first().fill("Model X") - - const headerInputsBefore = await providerDialog.getByPlaceholder("Header-Name").count() - await providerDialog.getByRole("button", { name: "Add header" }).click() - const headerInputsAfter = await providerDialog.getByPlaceholder("Header-Name").count() - expect(headerInputsAfter).toBe(headerInputsBefore + 1) - - await providerDialog.getByPlaceholder("Header-Name").first().fill("Authorization") - await providerDialog.getByPlaceholder("value").first().fill("Bearer token123") - - await expect(providerDialog.getByPlaceholder("Header-Name").first()).toHaveValue("Authorization") - await expect(providerDialog.getByPlaceholder("value").first()).toHaveValue("Bearer token123") - - await page.keyboard.press("Escape") - await expect(providerDialog).toHaveCount(0) - - await closeDialog(page, settings) -}) diff --git a/packages/app/e2e/settings/settings.spec.ts b/packages/app/e2e/settings/settings.spec.ts deleted file mode 100644 index 6455892cc..000000000 --- a/packages/app/e2e/settings/settings.spec.ts +++ /dev/null @@ -1,718 +0,0 @@ -import { test, expect, settingsKey } from "../fixtures" -import { closeDialog, openSettings } from "../actions" -import { - settingsColorSchemeSelector, - settingsCodeFontSelector, - settingsLanguageSelectSelector, - settingsNotificationsAgentSelector, - settingsNotificationsErrorsSelector, - settingsNotificationsPermissionsSelector, - settingsReleaseNotesSelector, - settingsSoundsAgentSelector, - settingsSoundsErrorsSelector, - settingsSoundsPermissionsSelector, - settingsThemeSelector, - settingsUIFontSelector, - settingsUpdatesStartupSelector, -} from "../selectors" - -test("smoke settings dialog opens, switches tabs, closes", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - - await dialog.getByRole("tab", { name: "Shortcuts" }).click() - await expect(dialog.getByRole("button", { name: "Reset to defaults" })).toBeVisible() - await expect(dialog.getByPlaceholder("Search shortcuts")).toBeVisible() - - await closeDialog(page, dialog) -}) - -test("changing language updates settings labels", async ({ page, gotoSession }) => { - await page.addInitScript(() => { - localStorage.setItem("opencode.global.dat:language", JSON.stringify({ locale: "en" })) - }) - - await gotoSession() - - const dialog = await openSettings(page) - - const heading = dialog.getByRole("heading", { level: 2 }) - await expect(heading).toHaveText("General") - - const select = dialog.locator(settingsLanguageSelectSelector) - await expect(select).toBeVisible() - await select.locator('[data-slot="select-select-trigger"]').click() - - await page.locator('[data-slot="select-select-item"]').filter({ hasText: "Deutsch" }).click() - - await expect(heading).toHaveText("Allgemein") - - await select.locator('[data-slot="select-select-trigger"]').click() - await page.locator('[data-slot="select-select-item"]').filter({ hasText: "English" }).click() - await expect(heading).toHaveText("General") -}) - -test("changing color scheme persists in localStorage", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const select = dialog.locator(settingsColorSchemeSelector) - await expect(select).toBeVisible() - - await select.locator('[data-slot="select-select-trigger"]').click() - await page.locator('[data-slot="select-select-item"]').filter({ hasText: "Dark" }).click() - - const colorScheme = await page.evaluate(() => { - return document.documentElement.getAttribute("data-color-scheme") - }) - expect(colorScheme).toBe("dark") - - await select.locator('[data-slot="select-select-trigger"]').click() - await page.locator('[data-slot="select-select-item"]').filter({ hasText: "Light" }).click() - - const lightColorScheme = await page.evaluate(() => { - return document.documentElement.getAttribute("data-color-scheme") - }) - expect(lightColorScheme).toBe("light") -}) - -test("changing theme persists in localStorage", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const select = dialog.locator(settingsThemeSelector) - await expect(select).toBeVisible() - - const currentThemeId = await page.evaluate(() => { - return document.documentElement.getAttribute("data-theme") - }) - const currentTheme = (await select.locator('[data-slot="select-select-trigger-value"]').textContent())?.trim() ?? "" - const trigger = select.locator('[data-slot="select-select-trigger"]') - const items = page.locator('[data-slot="select-select-item"]') - - await trigger.click() - const open = await expect - .poll(async () => (await items.count()) > 0, { timeout: 5_000 }) - .toBe(true) - .then(() => true) - .catch(() => false) - if (!open) { - await trigger.click() - await expect.poll(async () => (await items.count()) > 0, { timeout: 10_000 }).toBe(true) - } - await expect(items.first()).toBeVisible() - const count = await items.count() - expect(count).toBeGreaterThan(1) - - const nextTheme = (await items.locator('[data-slot="select-select-item-label"]').allTextContents()) - .map((x) => x.trim()) - .find((x) => x && x !== currentTheme) - expect(nextTheme).toBeTruthy() - - await items.filter({ hasText: nextTheme! }).first().click() - - await page.keyboard.press("Escape") - - const storedThemeId = await page.evaluate(() => { - return localStorage.getItem("opencode-theme-id") - }) - - expect(storedThemeId).not.toBeNull() - expect(storedThemeId).not.toBe(currentThemeId) - - const dataTheme = await page.evaluate(() => { - return document.documentElement.getAttribute("data-theme") - }) - expect(dataTheme).toBe(storedThemeId) -}) - -test("legacy oc-1 theme migrates to oc-2", async ({ page, gotoSession }) => { - await page.addInitScript(() => { - localStorage.setItem("opencode-theme-id", "oc-1") - localStorage.setItem("opencode-theme-css-light", "--background-base:#fff;") - localStorage.setItem("opencode-theme-css-dark", "--background-base:#000;") - }) - - await gotoSession() - - await expect(page.locator("html")).toHaveAttribute("data-theme", "oc-2") - - await expect - .poll(async () => { - return await page.evaluate(() => { - return localStorage.getItem("opencode-theme-id") - }) - }) - .toBe("oc-2") - - await expect - .poll(async () => { - return await page.evaluate(() => { - return localStorage.getItem("opencode-theme-css-light") - }) - }) - .toBeNull() - - await expect - .poll(async () => { - return await page.evaluate(() => { - return localStorage.getItem("opencode-theme-css-dark") - }) - }) - .toBeNull() -}) - -test("typing a code font with spaces persists and updates CSS variable", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const input = dialog.locator(settingsCodeFontSelector) - await expect(input).toBeVisible() - await expect(input).toHaveAttribute("placeholder", "System Mono") - - const initialFontFamily = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(), - ) - const initialUIFamily = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(), - ) - expect(initialFontFamily).toContain("ui-monospace") - - const next = "Test Mono" - - await input.click() - await input.clear() - await input.pressSequentially(next) - await expect(input).toHaveValue(next) - - await expect - .poll(async () => { - return await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - }) - .toMatchObject({ - appearance: { - mono: next, - }, - }) - - const newFontFamily = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(), - ) - const newUIFamily = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(), - ) - expect(newFontFamily).toContain(next) - expect(newFontFamily).not.toBe(initialFontFamily) - expect(newUIFamily).toBe(initialUIFamily) -}) - -test("typing a UI font with spaces persists and updates CSS variable", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const input = dialog.locator(settingsUIFontSelector) - await expect(input).toBeVisible() - await expect(input).toHaveAttribute("placeholder", "System Sans") - - const initialFontFamily = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(), - ) - const initialCodeFamily = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(), - ) - expect(initialFontFamily).toContain("ui-sans-serif") - - const next = "Test Sans" - - await input.click() - await input.clear() - await input.pressSequentially(next) - await expect(input).toHaveValue(next) - - await expect - .poll(async () => { - return await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - }) - .toMatchObject({ - appearance: { - sans: next, - }, - }) - - const newFontFamily = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(), - ) - const newCodeFamily = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(), - ) - expect(newFontFamily).toContain(next) - expect(newFontFamily).not.toBe(initialFontFamily) - expect(newCodeFamily).toBe(initialCodeFamily) -}) - -test("clearing the code font field restores the default placeholder and stack", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const input = dialog.locator(settingsCodeFontSelector) - await expect(input).toBeVisible() - - await input.click() - await input.clear() - await input.pressSequentially("Reset Mono") - - await expect - .poll(async () => { - return await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - }) - .toMatchObject({ - appearance: { - mono: "Reset Mono", - }, - }) - - await input.clear() - await input.press("Space") - await expect(input).toHaveValue("") - await expect(input).toHaveAttribute("placeholder", "System Mono") - - await expect - .poll(async () => { - return await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - }) - .toMatchObject({ - appearance: { - mono: "", - }, - }) - - const fontFamily = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(), - ) - expect(fontFamily).toContain("ui-monospace") - expect(fontFamily).not.toContain("Reset Mono") -}) - -test("clearing the UI font field restores the default placeholder and stack", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const input = dialog.locator(settingsUIFontSelector) - await expect(input).toBeVisible() - - await input.click() - await input.clear() - await input.pressSequentially("Reset Sans") - - await expect - .poll(async () => { - return await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - }) - .toMatchObject({ - appearance: { - sans: "Reset Sans", - }, - }) - - await input.clear() - await input.press("Space") - await expect(input).toHaveValue("") - await expect(input).toHaveAttribute("placeholder", "System Sans") - - await expect - .poll(async () => { - return await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - }) - .toMatchObject({ - appearance: { - sans: "", - }, - }) - - const fontFamily = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(), - ) - expect(fontFamily).toContain("ui-sans-serif") - expect(fontFamily).not.toContain("Reset Sans") -}) - -test("color scheme, code font, and UI font rehydrate after reload", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - - const colorSchemeSelect = dialog.locator(settingsColorSchemeSelector) - await expect(colorSchemeSelect).toBeVisible() - await colorSchemeSelect.locator('[data-slot="select-select-trigger"]').click() - await page.locator('[data-slot="select-select-item"]').filter({ hasText: "Dark" }).click() - await expect(page.locator("html")).toHaveAttribute("data-color-scheme", "dark") - - const code = dialog.locator(settingsCodeFontSelector) - const ui = dialog.locator(settingsUIFontSelector) - await expect(code).toBeVisible() - await expect(ui).toBeVisible() - - const initialMono = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(), - ) - const initialSans = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(), - ) - - const initialSettings = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - const mono = initialSettings?.appearance?.mono === "Reload Mono" ? "Reload Mono 2" : "Reload Mono" - const sans = initialSettings?.appearance?.sans === "Reload Sans" ? "Reload Sans 2" : "Reload Sans" - - await code.click() - await code.clear() - await code.pressSequentially(mono) - await expect(code).toHaveValue(mono) - - await ui.click() - await ui.clear() - await ui.pressSequentially(sans) - await expect(ui).toHaveValue(sans) - - await expect - .poll(async () => { - return await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - }) - .toMatchObject({ - appearance: { - mono, - sans, - }, - }) - - const updatedSettings = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - const updatedMono = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(), - ) - const updatedSans = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(), - ) - expect(updatedMono).toContain(mono) - expect(updatedMono).not.toBe(initialMono) - expect(updatedSans).toContain(sans) - expect(updatedSans).not.toBe(initialSans) - expect(updatedSettings?.appearance?.mono).toBe(mono) - expect(updatedSettings?.appearance?.sans).toBe(sans) - - await closeDialog(page, dialog) - await page.reload() - - await expect(page.locator("html")).toHaveAttribute("data-color-scheme", "dark") - - await expect - .poll(async () => { - return await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - }) - .toMatchObject({ - appearance: { - mono, - sans, - }, - }) - - const rehydratedSettings = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - await expect - .poll(async () => { - return await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(), - ) - }) - .toContain(mono) - - await expect - .poll(async () => { - return await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(), - ) - }) - .toContain(sans) - - const rehydratedMono = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-mono").trim(), - ) - const rehydratedSans = await page.evaluate(() => - getComputedStyle(document.documentElement).getPropertyValue("--font-family-sans").trim(), - ) - expect(rehydratedMono).toContain(mono) - expect(rehydratedMono).not.toBe(initialMono) - expect(rehydratedSans).toContain(sans) - expect(rehydratedSans).not.toBe(initialSans) - expect(rehydratedSettings?.appearance?.mono).toBe(mono) - expect(rehydratedSettings?.appearance?.sans).toBe(sans) -}) - -test("toggling notification agent switch updates localStorage", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const switchContainer = dialog.locator(settingsNotificationsAgentSelector) - await expect(switchContainer).toBeVisible() - - const toggleInput = switchContainer.locator('[data-slot="switch-input"]') - const initialState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked) - expect(initialState).toBe(true) - - await switchContainer.locator('[data-slot="switch-control"]').click() - await page.waitForTimeout(100) - - const newState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked) - expect(newState).toBe(false) - - const stored = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - expect(stored?.notifications?.agent).toBe(false) -}) - -test("toggling notification permissions switch updates localStorage", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const switchContainer = dialog.locator(settingsNotificationsPermissionsSelector) - await expect(switchContainer).toBeVisible() - - const toggleInput = switchContainer.locator('[data-slot="switch-input"]') - const initialState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked) - expect(initialState).toBe(true) - - await switchContainer.locator('[data-slot="switch-control"]').click() - await page.waitForTimeout(100) - - const newState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked) - expect(newState).toBe(false) - - const stored = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - expect(stored?.notifications?.permissions).toBe(false) -}) - -test("toggling notification errors switch updates localStorage", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const switchContainer = dialog.locator(settingsNotificationsErrorsSelector) - await expect(switchContainer).toBeVisible() - - const toggleInput = switchContainer.locator('[data-slot="switch-input"]') - const initialState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked) - expect(initialState).toBe(false) - - await switchContainer.locator('[data-slot="switch-control"]').click() - await page.waitForTimeout(100) - - const newState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked) - expect(newState).toBe(true) - - const stored = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - expect(stored?.notifications?.errors).toBe(true) -}) - -test("changing sound agent selection persists in localStorage", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const select = dialog.locator(settingsSoundsAgentSelector) - await expect(select).toBeVisible() - - await select.locator('[data-slot="select-select-trigger"]').click() - - const items = page.locator('[data-slot="select-select-item"]') - await items.nth(2).click() - - const stored = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - expect(stored?.sounds?.agent).not.toBe("staplebops-01") -}) - -test("selecting none disables agent sound", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const select = dialog.locator(settingsSoundsAgentSelector) - const trigger = select.locator('[data-slot="select-select-trigger"]') - await expect(select).toBeVisible() - await expect(trigger).toBeEnabled() - - await trigger.click() - const items = page.locator('[data-slot="select-select-item"]') - await expect(items.first()).toBeVisible() - await items.first().click() - - const stored = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - expect(stored?.sounds?.agentEnabled).toBe(false) -}) - -test("changing permissions and errors sounds updates localStorage", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const permissionsSelect = dialog.locator(settingsSoundsPermissionsSelector) - const errorsSelect = dialog.locator(settingsSoundsErrorsSelector) - await expect(permissionsSelect).toBeVisible() - await expect(errorsSelect).toBeVisible() - - const initial = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - const permissionsCurrent = - (await permissionsSelect.locator('[data-slot="select-select-trigger-value"]').textContent())?.trim() ?? "" - await permissionsSelect.locator('[data-slot="select-select-trigger"]').click() - const permissionItems = page.locator('[data-slot="select-select-item"]') - expect(await permissionItems.count()).toBeGreaterThan(1) - if (permissionsCurrent) { - await permissionItems.filter({ hasNotText: permissionsCurrent }).first().click() - } - if (!permissionsCurrent) { - await permissionItems.nth(1).click() - } - - const errorsCurrent = - (await errorsSelect.locator('[data-slot="select-select-trigger-value"]').textContent())?.trim() ?? "" - await errorsSelect.locator('[data-slot="select-select-trigger"]').click() - const errorItems = page.locator('[data-slot="select-select-item"]') - expect(await errorItems.count()).toBeGreaterThan(1) - if (errorsCurrent) { - await errorItems.filter({ hasNotText: errorsCurrent }).first().click() - } - if (!errorsCurrent) { - await errorItems.nth(1).click() - } - - await expect - .poll(async () => { - return await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - }) - .toMatchObject({ - sounds: { - permissions: expect.any(String), - errors: expect.any(String), - }, - }) - - const stored = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - expect(stored?.sounds?.permissions).not.toBe(initial?.sounds?.permissions) - expect(stored?.sounds?.errors).not.toBe(initial?.sounds?.errors) -}) - -test("toggling updates startup switch updates localStorage", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const switchContainer = dialog.locator(settingsUpdatesStartupSelector) - await expect(switchContainer).toBeVisible() - - const toggleInput = switchContainer.locator('[data-slot="switch-input"]') - - const isDisabled = await toggleInput.evaluate((el: HTMLInputElement) => el.disabled) - if (isDisabled) { - test.skip() - return - } - - const initialState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked) - expect(initialState).toBe(true) - - await switchContainer.locator('[data-slot="switch-control"]').click() - await page.waitForTimeout(100) - - const newState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked) - expect(newState).toBe(false) - - const stored = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - expect(stored?.updates?.startup).toBe(false) -}) - -test("toggling release notes switch updates localStorage", async ({ page, gotoSession }) => { - await gotoSession() - - const dialog = await openSettings(page) - const switchContainer = dialog.locator(settingsReleaseNotesSelector) - await expect(switchContainer).toBeVisible() - - const toggleInput = switchContainer.locator('[data-slot="switch-input"]') - const initialState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked) - expect(initialState).toBe(true) - - await switchContainer.locator('[data-slot="switch-control"]').click() - await page.waitForTimeout(100) - - const newState = await toggleInput.evaluate((el: HTMLInputElement) => el.checked) - expect(newState).toBe(false) - - const stored = await page.evaluate((key) => { - const raw = localStorage.getItem(key) - return raw ? JSON.parse(raw) : null - }, settingsKey) - - expect(stored?.general?.releaseNotes).toBe(false) -}) diff --git a/packages/app/e2e/sidebar/sidebar-popover-actions.spec.ts b/packages/app/e2e/sidebar/sidebar-popover-actions.spec.ts deleted file mode 100644 index 05a129a61..000000000 --- a/packages/app/e2e/sidebar/sidebar-popover-actions.spec.ts +++ /dev/null @@ -1,109 +0,0 @@ -import { test, expect } from "../fixtures" -import { - defocus, - cleanupSession, - cleanupTestProject, - closeSidebar, - createTestProject, - hoverSessionItem, - openSidebar, - waitSession, -} from "../actions" -import { projectSwitchSelector } from "../selectors" -import { dirSlug } from "../utils" - -test("collapsed sidebar popover stays open when archiving a session", async ({ page, slug, sdk, gotoSession }) => { - const stamp = Date.now() - - const one = await sdk.session.create({ title: `e2e sidebar popover archive 1 ${stamp}` }).then((r) => r.data) - const two = await sdk.session.create({ title: `e2e sidebar popover archive 2 ${stamp}` }).then((r) => r.data) - - if (!one?.id) throw new Error("Session create did not return an id") - if (!two?.id) throw new Error("Session create did not return an id") - - try { - await gotoSession(one.id) - await closeSidebar(page) - - const oneItem = page.locator(`[data-session-id="${one.id}"]`).last() - const twoItem = page.locator(`[data-session-id="${two.id}"]`).last() - - const project = page.locator(projectSwitchSelector(slug)).first() - await expect(project).toBeVisible() - await project.hover() - - await expect(oneItem).toBeVisible() - await expect(twoItem).toBeVisible() - - const item = await hoverSessionItem(page, one.id) - await item - .getByRole("button", { name: /archive/i }) - .first() - .click() - - await expect(twoItem).toBeVisible() - } finally { - await cleanupSession({ sdk, sessionID: one.id }) - await cleanupSession({ sdk, sessionID: two.id }) - } -}) - -test("open sidebar project popover stays closed after clicking avatar", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - - const other = await createTestProject() - const slug = dirSlug(other) - - try { - await project.open({ extra: [other] }) - await openSidebar(page) - - const projectButton = page.locator(projectSwitchSelector(slug)).first() - const card = page.locator('[data-component="hover-card-content"]') - - await expect(projectButton).toBeVisible() - await projectButton.hover() - await expect(card.getByText(/recent sessions/i)).toBeVisible() - - await projectButton.click() - await expect(card).toHaveCount(0) - - await waitSession(page, { directory: other }) - await expect(card).toHaveCount(0) - } finally { - await cleanupTestProject(other) - } -}) - -test("open sidebar project switch activates on first tabbed enter", async ({ page, project }) => { - await page.setViewportSize({ width: 1400, height: 800 }) - - const other = await createTestProject() - const slug = dirSlug(other) - - try { - await project.open({ extra: [other] }) - await openSidebar(page) - await defocus(page) - - const projectButton = page.locator(projectSwitchSelector(slug)).first() - - await expect(projectButton).toBeVisible() - - let hit = false - for (let i = 0; i < 20; i++) { - hit = await projectButton.evaluate((el) => { - return el.matches(":focus") || !!el.parentElement?.matches(":focus") - }) - if (hit) break - await page.keyboard.press("Tab") - } - - expect(hit).toBe(true) - - await page.keyboard.press("Enter") - await waitSession(page, { directory: other }) - } finally { - await cleanupTestProject(other) - } -}) diff --git a/packages/app/e2e/sidebar/sidebar-session-links.spec.ts b/packages/app/e2e/sidebar/sidebar-session-links.spec.ts deleted file mode 100644 index 22f98e94c..000000000 --- a/packages/app/e2e/sidebar/sidebar-session-links.spec.ts +++ /dev/null @@ -1,30 +0,0 @@ -import { test, expect } from "../fixtures" -import { cleanupSession, openSidebar, withSession } from "../actions" -import { promptSelector } from "../selectors" - -test("sidebar session links navigate to the selected session", async ({ page, slug, sdk, gotoSession }) => { - const stamp = Date.now() - - const one = await sdk.session.create({ title: `e2e sidebar nav 1 ${stamp}` }).then((r) => r.data) - const two = await sdk.session.create({ title: `e2e sidebar nav 2 ${stamp}` }).then((r) => r.data) - - if (!one?.id) throw new Error("Session create did not return an id") - if (!two?.id) throw new Error("Session create did not return an id") - - try { - await gotoSession(one.id) - - await openSidebar(page) - - const target = page.locator(`[data-session-id="${two.id}"] a`).first() - await expect(target).toBeVisible() - await target.click() - - await expect(page).toHaveURL(new RegExp(`/${slug}/session/${two.id}(?:\\?|#|$)`)) - await expect(page.locator(promptSelector)).toBeVisible() - await expect(page.locator(`[data-session-id="${two.id}"] a`).first()).toHaveClass(/\bactive\b/) - } finally { - await cleanupSession({ sdk, sessionID: one.id }) - await cleanupSession({ sdk, sessionID: two.id }) - } -}) diff --git a/packages/app/e2e/sidebar/sidebar.spec.ts b/packages/app/e2e/sidebar/sidebar.spec.ts deleted file mode 100644 index c6bf3fa9a..000000000 --- a/packages/app/e2e/sidebar/sidebar.spec.ts +++ /dev/null @@ -1,40 +0,0 @@ -import { test, expect } from "../fixtures" -import { openSidebar, toggleSidebar, withSession } from "../actions" - -test("sidebar can be collapsed and expanded", async ({ page, gotoSession }) => { - await gotoSession() - - await openSidebar(page) - const button = page.getByRole("button", { name: /toggle sidebar/i }).first() - await expect(button).toHaveAttribute("aria-expanded", "true") - - await toggleSidebar(page) - await expect(button).toHaveAttribute("aria-expanded", "false") - - await toggleSidebar(page) - await expect(button).toHaveAttribute("aria-expanded", "true") -}) - -test("sidebar collapsed state persists across navigation and reload", async ({ page, sdk, gotoSession }) => { - await withSession(sdk, "sidebar persist session 1", async (session1) => { - await withSession(sdk, "sidebar persist session 2", async (session2) => { - await gotoSession(session1.id) - - await openSidebar(page) - const button = page.getByRole("button", { name: /toggle sidebar/i }).first() - await toggleSidebar(page) - await expect(button).toHaveAttribute("aria-expanded", "false") - - await gotoSession(session2.id) - await expect(button).toHaveAttribute("aria-expanded", "false") - - await page.reload() - await expect(button).toHaveAttribute("aria-expanded", "false") - - const opened = await page.evaluate( - () => JSON.parse(localStorage.getItem("opencode.global.dat:layout") ?? "{}").sidebar?.opened, - ) - await expect(opened).toBe(false) - }) - }) -}) diff --git a/packages/app/e2e/status/status-popover.spec.ts b/packages/app/e2e/status/status-popover.spec.ts deleted file mode 100644 index d53578a49..000000000 --- a/packages/app/e2e/status/status-popover.spec.ts +++ /dev/null @@ -1,94 +0,0 @@ -import { test, expect } from "../fixtures" -import { openStatusPopover } from "../actions" - -test("status popover opens and shows tabs", async ({ page, gotoSession }) => { - await gotoSession() - - const { popoverBody } = await openStatusPopover(page) - - await expect(popoverBody.getByRole("tab", { name: /servers/i })).toBeVisible() - await expect(popoverBody.getByRole("tab", { name: /mcp/i })).toBeVisible() - await expect(popoverBody.getByRole("tab", { name: /lsp/i })).toBeVisible() - await expect(popoverBody.getByRole("tab", { name: /plugins/i })).toBeVisible() - - await page.keyboard.press("Escape") - await expect(popoverBody).toHaveCount(0) -}) - -test("status popover servers tab shows current server", async ({ page, gotoSession }) => { - await gotoSession() - - const { popoverBody } = await openStatusPopover(page) - - const serversTab = popoverBody.getByRole("tab", { name: /servers/i }) - await expect(serversTab).toHaveAttribute("aria-selected", "true") - - const serverList = popoverBody.locator('[role="tabpanel"]').first() - await expect(serverList.locator("button").first()).toBeVisible() -}) - -test("status popover can switch to mcp tab", async ({ page, gotoSession }) => { - await gotoSession() - - const { popoverBody } = await openStatusPopover(page) - - const mcpTab = popoverBody.getByRole("tab", { name: /mcp/i }) - await mcpTab.click() - - const ariaSelected = await mcpTab.getAttribute("aria-selected") - expect(ariaSelected).toBe("true") - - const mcpContent = popoverBody.locator('[role="tabpanel"]:visible').first() - await expect(mcpContent).toBeVisible() -}) - -test("status popover can switch to lsp tab", async ({ page, gotoSession }) => { - await gotoSession() - - const { popoverBody } = await openStatusPopover(page) - - const lspTab = popoverBody.getByRole("tab", { name: /lsp/i }) - await lspTab.click() - - const ariaSelected = await lspTab.getAttribute("aria-selected") - expect(ariaSelected).toBe("true") - - const lspContent = popoverBody.locator('[role="tabpanel"]:visible').first() - await expect(lspContent).toBeVisible() -}) - -test("status popover can switch to plugins tab", async ({ page, gotoSession }) => { - await gotoSession() - - const { popoverBody } = await openStatusPopover(page) - - const pluginsTab = popoverBody.getByRole("tab", { name: /plugins/i }) - await pluginsTab.click() - - const ariaSelected = await pluginsTab.getAttribute("aria-selected") - expect(ariaSelected).toBe("true") - - const pluginsContent = popoverBody.locator('[role="tabpanel"]:visible').first() - await expect(pluginsContent).toBeVisible() -}) - -test("status popover closes on escape", async ({ page, gotoSession }) => { - await gotoSession() - - const { popoverBody } = await openStatusPopover(page) - await expect(popoverBody).toBeVisible() - - await page.keyboard.press("Escape") - await expect(popoverBody).toHaveCount(0) -}) - -test("status popover closes when clicking outside", async ({ page, gotoSession }) => { - await gotoSession() - - const { popoverBody } = await openStatusPopover(page) - await expect(popoverBody).toBeVisible() - - await page.getByRole("main").click({ position: { x: 5, y: 5 } }) - - await expect(popoverBody).toHaveCount(0) -}) diff --git a/packages/app/e2e/terminal/terminal-init.spec.ts b/packages/app/e2e/terminal/terminal-init.spec.ts deleted file mode 100644 index 689d0436a..000000000 --- a/packages/app/e2e/terminal/terminal-init.spec.ts +++ /dev/null @@ -1,28 +0,0 @@ -import { test, expect } from "../fixtures" -import { waitTerminalFocusIdle, waitTerminalReady } from "../actions" -import { promptSelector, terminalSelector } from "../selectors" -import { terminalToggleKey } from "../utils" - -test("smoke terminal mounts and can create a second tab", async ({ page, gotoSession }) => { - await gotoSession() - - const terminals = page.locator(terminalSelector) - const tabs = page.locator('#terminal-panel [data-slot="tabs-trigger"]') - const opened = await terminals.first().isVisible() - - if (!opened) { - await page.keyboard.press(terminalToggleKey) - } - - await waitTerminalFocusIdle(page, { term: terminals.first() }) - await expect(terminals).toHaveCount(1) - - // Ghostty captures a lot of keybinds when focused; move focus back - // to the app shell before triggering `terminal.new`. - await page.locator(promptSelector).click() - await page.keyboard.press("Control+Alt+T") - - await expect(tabs).toHaveCount(2) - await expect(terminals).toHaveCount(1) - await waitTerminalReady(page, { term: terminals.first() }) -}) diff --git a/packages/app/e2e/terminal/terminal-reconnect.spec.ts b/packages/app/e2e/terminal/terminal-reconnect.spec.ts deleted file mode 100644 index 1a11a047a..000000000 --- a/packages/app/e2e/terminal/terminal-reconnect.spec.ts +++ /dev/null @@ -1,45 +0,0 @@ -import type { Page } from "@playwright/test" -import { disconnectTerminal, runTerminal, terminalConnects, waitTerminalReady } from "../actions" -import { test, expect } from "../fixtures" -import { terminalSelector } from "../selectors" -import { terminalToggleKey } from "../utils" - -async function open(page: Page) { - const term = page.locator(terminalSelector).first() - const visible = await term.isVisible().catch(() => false) - if (!visible) await page.keyboard.press(terminalToggleKey) - await waitTerminalReady(page, { term }) - return term -} - -test("terminal reconnects without replacing the pty", async ({ page, project }) => { - await project.open() - const name = `OPENCODE_E2E_RECONNECT_${Date.now()}` - const token = `E2E_RECONNECT_${Date.now()}` - - await project.gotoSession() - - const term = await open(page) - const id = await term.getAttribute("data-pty-id") - if (!id) throw new Error("Active terminal missing data-pty-id") - - const prev = await terminalConnects(page, { term }) - - await runTerminal(page, { - term, - cmd: `export ${name}=${token}; echo ${token}`, - token, - }) - - await disconnectTerminal(page, { term }) - - await expect.poll(() => terminalConnects(page, { term }), { timeout: 15_000 }).toBeGreaterThan(prev) - await expect.poll(() => term.getAttribute("data-pty-id"), { timeout: 5_000 }).toBe(id) - - await runTerminal(page, { - term, - cmd: `echo $${name}`, - token, - timeout: 15_000, - }) -}) diff --git a/packages/app/e2e/terminal/terminal-tabs.spec.ts b/packages/app/e2e/terminal/terminal-tabs.spec.ts deleted file mode 100644 index 5cb5bbf20..000000000 --- a/packages/app/e2e/terminal/terminal-tabs.spec.ts +++ /dev/null @@ -1,165 +0,0 @@ -import type { Page } from "@playwright/test" -import { runTerminal, waitTerminalReady } from "../actions" -import { test, expect } from "../fixtures" -import { dropdownMenuContentSelector, terminalSelector } from "../selectors" -import { terminalToggleKey, workspacePersistKey } from "../utils" - -type State = { - active?: string - all: Array<{ - id: string - title: string - titleNumber: number - buffer?: string - }> -} - -async function open(page: Page) { - const terminal = page.locator(terminalSelector) - const visible = await terminal.isVisible().catch(() => false) - if (!visible) await page.keyboard.press(terminalToggleKey) - await waitTerminalReady(page, { term: terminal }) -} - -async function store(page: Page, key: string) { - return page.evaluate((key) => { - const raw = localStorage.getItem(key) - if (raw) return JSON.parse(raw) as State - - for (let i = 0; i < localStorage.length; i++) { - const next = localStorage.key(i) - if (!next?.endsWith(":workspace:terminal")) continue - const value = localStorage.getItem(next) - if (!value) continue - return JSON.parse(value) as State - } - }, key) -} - -test("inactive terminal tab buffers persist across tab switches", async ({ page, project }) => { - await project.open() - const key = workspacePersistKey(project.directory, "terminal") - const one = `E2E_TERM_ONE_${Date.now()}` - const two = `E2E_TERM_TWO_${Date.now()}` - const tabs = page.locator('#terminal-panel [data-slot="tabs-trigger"]') - const first = tabs.filter({ hasText: /Terminal 1/ }).first() - const second = tabs.filter({ hasText: /Terminal 2/ }).first() - - await project.gotoSession() - await open(page) - - await runTerminal(page, { cmd: `echo ${one}`, token: one }) - - await page.getByRole("button", { name: /new terminal/i }).click() - await expect(tabs).toHaveCount(2) - - await runTerminal(page, { cmd: `echo ${two}`, token: two }) - - await first.click() - await expect(first).toHaveAttribute("aria-selected", "true") - - await expect - .poll( - async () => { - const state = await store(page, key) - const first = state?.all.find((item) => item.titleNumber === 1)?.buffer ?? "" - const second = state?.all.find((item) => item.titleNumber === 2)?.buffer ?? "" - return { - first: first.includes(one), - second: second.includes(two), - } - }, - { timeout: 5_000 }, - ) - .toEqual({ first: false, second: true }) - - await second.click() - await expect(second).toHaveAttribute("aria-selected", "true") - await expect - .poll( - async () => { - const state = await store(page, key) - const first = state?.all.find((item) => item.titleNumber === 1)?.buffer ?? "" - const second = state?.all.find((item) => item.titleNumber === 2)?.buffer ?? "" - return { - first: first.includes(one), - second: second.includes(two), - } - }, - { timeout: 5_000 }, - ) - .toEqual({ first: true, second: false }) -}) - -test("closing the active terminal tab falls back to the previous tab", async ({ page, project }) => { - await project.open() - const key = workspacePersistKey(project.directory, "terminal") - const tabs = page.locator('#terminal-panel [data-slot="tabs-trigger"]') - - await project.gotoSession() - await open(page) - - await page.getByRole("button", { name: /new terminal/i }).click() - await expect(tabs).toHaveCount(2) - - const second = tabs.filter({ hasText: /Terminal 2/ }).first() - await second.click() - await expect(second).toHaveAttribute("aria-selected", "true") - - await second.hover() - await page - .getByRole("button", { name: /close terminal/i }) - .nth(1) - .click({ force: true }) - - const first = tabs.filter({ hasText: /Terminal 1/ }).first() - await expect(tabs).toHaveCount(1) - await expect(first).toHaveAttribute("aria-selected", "true") - await expect - .poll( - async () => { - const state = await store(page, key) - return { - count: state?.all.length ?? 0, - first: state?.all.some((item) => item.titleNumber === 1) ?? false, - } - }, - { timeout: 15_000 }, - ) - .toEqual({ count: 1, first: true }) -}) - -test("terminal tab can be renamed from the context menu", async ({ page, project }) => { - await project.open() - const key = workspacePersistKey(project.directory, "terminal") - const rename = `E2E term ${Date.now()}` - const tab = page.locator('#terminal-panel [data-slot="tabs-trigger"]').first() - - await project.gotoSession() - await open(page) - - await expect(tab).toContainText(/Terminal 1/) - await tab.click({ button: "right" }) - - const menu = page.locator(dropdownMenuContentSelector).first() - await expect(menu).toBeVisible() - await menu.getByRole("menuitem", { name: /^Rename$/i }).click() - await expect(menu).toHaveCount(0) - - const input = page.locator('#terminal-panel input[type="text"]').first() - await expect(input).toBeVisible() - await input.fill(rename) - await input.press("Enter") - - await expect(input).toHaveCount(0) - await expect(tab).toContainText(rename) - await expect - .poll( - async () => { - const state = await store(page, key) - return state?.all[0]?.title - }, - { timeout: 5_000 }, - ) - .toBe(rename) -}) diff --git a/packages/app/e2e/terminal/terminal.spec.ts b/packages/app/e2e/terminal/terminal.spec.ts deleted file mode 100644 index 768f7c182..000000000 --- a/packages/app/e2e/terminal/terminal.spec.ts +++ /dev/null @@ -1,18 +0,0 @@ -import { test, expect } from "../fixtures" -import { waitTerminalReady } from "../actions" -import { terminalSelector } from "../selectors" -import { terminalToggleKey } from "../utils" - -test("terminal panel can be toggled", async ({ page, gotoSession }) => { - await gotoSession() - - const terminal = page.locator(terminalSelector) - const initiallyOpen = await terminal.isVisible() - if (initiallyOpen) { - await page.keyboard.press(terminalToggleKey) - await expect(terminal).toHaveCount(0) - } - - await page.keyboard.press(terminalToggleKey) - await waitTerminalReady(page, { term: terminal }) -}) diff --git a/packages/app/e2e/thinking-level.spec.ts b/packages/app/e2e/thinking-level.spec.ts deleted file mode 100644 index 92200933e..000000000 --- a/packages/app/e2e/thinking-level.spec.ts +++ /dev/null @@ -1,25 +0,0 @@ -import { test, expect } from "./fixtures" -import { modelVariantCycleSelector } from "./selectors" - -test("smoke model variant cycle updates label", async ({ page, gotoSession }) => { - await gotoSession() - - await page.addStyleTag({ - content: `${modelVariantCycleSelector} { display: inline-block !important; }`, - }) - - const button = page.locator(modelVariantCycleSelector) - const exists = (await button.count()) > 0 - test.skip(!exists, "current model has no variants") - if (!exists) return - - await expect(button).toBeVisible() - - const before = (await button.innerText()).trim() - await button.click() - await expect(button).not.toHaveText(before) - - const after = (await button.innerText()).trim() - await button.click() - await expect(button).not.toHaveText(after) -}) diff --git a/packages/app/e2e/todo.spec.ts b/packages/app/e2e/todo.spec.ts new file mode 100644 index 000000000..dac2d8ee8 --- /dev/null +++ b/packages/app/e2e/todo.spec.ts @@ -0,0 +1,11 @@ +import { test } from "@playwright/test" + +test( + "test something cool", + { + annotation: { type: "todo" }, + }, + async () => { + test.fixme() + }, +) diff --git a/packages/app/e2e/tsconfig.json b/packages/app/e2e/tsconfig.json index a86352b83..3f1cad80c 100644 --- a/packages/app/e2e/tsconfig.json +++ b/packages/app/e2e/tsconfig.json @@ -5,5 +5,5 @@ "rootDir": "..", "types": ["node", "bun"] }, - "include": ["./**/*.ts", "../src/testing/terminal.ts"] + "include": ["./**/*.ts"] } diff --git a/packages/app/e2e/utils.ts b/packages/app/e2e/utils.ts deleted file mode 100644 index 17a878566..000000000 --- a/packages/app/e2e/utils.ts +++ /dev/null @@ -1,63 +0,0 @@ -import { createOpencodeClient } from "@opencode-ai/sdk/v2/client" -import { base64Encode, checksum } from "@opencode-ai/util/encode" - -export const serverHost = process.env.PLAYWRIGHT_SERVER_HOST ?? "127.0.0.1" -export const serverPort = process.env.PLAYWRIGHT_SERVER_PORT ?? "4096" - -export const serverUrl = `http://${serverHost}:${serverPort}` -export const serverName = `${serverHost}:${serverPort}` - -const localHosts = ["127.0.0.1", "localhost"] - -const serverLabels = (() => { - const url = new URL(serverUrl) - if (!localHosts.includes(url.hostname)) return [serverName] - return localHosts.map((host) => `${host}:${url.port}`) -})() - -export const serverNames = [...new Set(serverLabels)] - -export const serverUrls = serverNames.map((name) => `http://${name}`) - -const escape = (value: string) => value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&") - -export const serverNamePattern = new RegExp(`(?:${serverNames.map(escape).join("|")})`) - -export const modKey = process.platform === "darwin" ? "Meta" : "Control" -export const terminalToggleKey = "Control+Backquote" - -export function createSdk(directory?: string, baseUrl = serverUrl) { - return createOpencodeClient({ baseUrl, directory, throwOnError: true }) -} - -export async function resolveDirectory(directory: string, baseUrl = serverUrl) { - return createSdk(directory, baseUrl) - .path.get() - .then((x) => x.data?.directory ?? directory) -} - -export async function getWorktree(baseUrl = serverUrl) { - const sdk = createSdk(undefined, baseUrl) - const result = await sdk.path.get() - const data = result.data - if (!data?.worktree) throw new Error(`Failed to resolve a worktree from ${baseUrl}/path`) - return data.worktree -} - -export function dirSlug(directory: string) { - return base64Encode(directory) -} - -export function dirPath(directory: string) { - return `/${dirSlug(directory)}` -} - -export function sessionPath(directory: string, sessionID?: string) { - return `${dirPath(directory)}/session${sessionID ? `/${sessionID}` : ""}` -} - -export function workspacePersistKey(directory: string, key: string) { - const head = (directory.slice(0, 12) || "workspace").replace(/[^a-zA-Z0-9._-]/g, "-") - const sum = checksum(directory) ?? "0" - return `opencode.workspace.${head}.${sum}.dat:workspace:${key}` -} diff --git a/packages/app/package.json b/packages/app/package.json index 2ac271df2..483c71dc5 100644 --- a/packages/app/package.json +++ b/packages/app/package.json @@ -1,6 +1,6 @@ { "name": "@opencode-ai/app", - "version": "1.4.3", + "version": "1.4.6", "description": "", "type": "module", "exports": { @@ -19,14 +19,14 @@ "test:unit": "bun test --preload ./happydom.ts ./src", "test:unit:watch": "bun test --watch --preload ./happydom.ts ./src", "test:e2e": "playwright test", - "test:e2e:local": "bun script/e2e-local.ts", + "test:e2e:local": "playwright test", "test:e2e:ui": "playwright test --ui", "test:e2e:report": "playwright show-report e2e/playwright-report" }, "license": "MIT", "devDependencies": { "@happy-dom/global-registrator": "20.0.11", - "@playwright/test": "1.57.0", + "@playwright/test": "catalog:", "@tailwindcss/vite": "catalog:", "@tsconfig/bun": "1.0.9", "@types/bun": "catalog:", @@ -42,7 +42,7 @@ "@kobalte/core": "catalog:", "@opencode-ai/sdk": "workspace:*", "@opencode-ai/ui": "workspace:*", - "@opencode-ai/util": "workspace:*", + "@opencode-ai/shared": "workspace:*", "@shikijs/transformers": "3.9.2", "@solid-primitives/active-element": "2.1.3", "@solid-primitives/audio": "1.4.2", diff --git a/packages/app/script/e2e-local.ts b/packages/app/script/e2e-local.ts deleted file mode 100644 index 4f0f795a3..000000000 --- a/packages/app/script/e2e-local.ts +++ /dev/null @@ -1,180 +0,0 @@ -import fs from "node:fs/promises" -import net from "node:net" -import os from "node:os" -import path from "node:path" - -async function freePort() { - return await new Promise<number>((resolve, reject) => { - const server = net.createServer() - server.once("error", reject) - server.listen(0, () => { - const address = server.address() - if (!address || typeof address === "string") { - server.close(() => reject(new Error("Failed to acquire a free port"))) - return - } - server.close((err) => { - if (err) { - reject(err) - return - } - resolve(address.port) - }) - }) - }) -} - -async function waitForHealth(url: string) { - const timeout = Date.now() + 120_000 - const errors: string[] = [] - while (Date.now() < timeout) { - const result = await fetch(url) - .then((r) => ({ ok: r.ok, error: undefined })) - .catch((error) => ({ - ok: false, - error: error instanceof Error ? error.message : String(error), - })) - if (result.ok) return - if (result.error) errors.push(result.error) - await new Promise((r) => setTimeout(r, 250)) - } - const last = errors.length ? ` (last error: ${errors[errors.length - 1]})` : "" - throw new Error(`Timed out waiting for server health: ${url}${last}`) -} - -const appDir = process.cwd() -const repoDir = path.resolve(appDir, "../..") -const opencodeDir = path.join(repoDir, "packages", "opencode") - -const extraArgs = (() => { - const args = process.argv.slice(2) - if (args[0] === "--") return args.slice(1) - return args -})() - -const [serverPort, webPort] = await Promise.all([freePort(), freePort()]) - -const sandbox = await fs.mkdtemp(path.join(os.tmpdir(), "opencode-e2e-")) -const keepSandbox = process.env.OPENCODE_E2E_KEEP_SANDBOX === "1" - -const serverEnv = { - ...process.env, - OPENCODE_DISABLE_SHARE: process.env.OPENCODE_DISABLE_SHARE ?? "true", - OPENCODE_DISABLE_LSP_DOWNLOAD: "true", - OPENCODE_DISABLE_DEFAULT_PLUGINS: "true", - OPENCODE_EXPERIMENTAL_DISABLE_FILEWATCHER: "true", - OPENCODE_TEST_HOME: path.join(sandbox, "home"), - XDG_DATA_HOME: path.join(sandbox, "share"), - XDG_CACHE_HOME: path.join(sandbox, "cache"), - XDG_CONFIG_HOME: path.join(sandbox, "config"), - XDG_STATE_HOME: path.join(sandbox, "state"), - OPENCODE_E2E_PROJECT_DIR: repoDir, - OPENCODE_E2E_SESSION_TITLE: "E2E Session", - OPENCODE_E2E_MESSAGE: "Seeded for UI e2e", - OPENCODE_E2E_MODEL: process.env.OPENCODE_E2E_MODEL ?? "opencode/gpt-5-nano", - OPENCODE_CLIENT: "app", - OPENCODE_STRICT_CONFIG_DEPS: "true", -} satisfies Record<string, string> - -const runnerEnv = { - ...serverEnv, - PLAYWRIGHT_SERVER_HOST: "127.0.0.1", - PLAYWRIGHT_SERVER_PORT: String(serverPort), - VITE_OPENCODE_SERVER_HOST: "127.0.0.1", - VITE_OPENCODE_SERVER_PORT: String(serverPort), - PLAYWRIGHT_PORT: String(webPort), -} satisfies Record<string, string> - -let seed: ReturnType<typeof Bun.spawn> | undefined -let runner: ReturnType<typeof Bun.spawn> | undefined -let server: { stop: (close?: boolean) => Promise<void> | void } | undefined -let inst: { Instance: { disposeAll: () => Promise<void> | void } } | undefined -let cleaned = false - -const cleanup = async () => { - if (cleaned) return - cleaned = true - - if (seed && seed.exitCode === null) seed.kill("SIGTERM") - if (runner && runner.exitCode === null) runner.kill("SIGTERM") - - const jobs = [ - inst?.Instance.disposeAll(), - typeof server?.stop === "function" ? server.stop() : undefined, - keepSandbox ? undefined : fs.rm(sandbox, { recursive: true, force: true }), - ].filter(Boolean) - await Promise.allSettled(jobs) -} - -const shutdown = (code: number, reason: string) => { - process.exitCode = code - void cleanup().finally(() => { - console.error(`e2e-local shutdown: ${reason}`) - process.exit(code) - }) -} - -const reportInternalError = (reason: string, error: unknown) => { - console.warn(`e2e-local ignored server error: ${reason}`) - console.warn(error) -} - -process.once("SIGINT", () => shutdown(130, "SIGINT")) -process.once("SIGTERM", () => shutdown(143, "SIGTERM")) -process.once("SIGHUP", () => shutdown(129, "SIGHUP")) -process.once("uncaughtException", (error) => { - reportInternalError("uncaughtException", error) -}) -process.once("unhandledRejection", (error) => { - reportInternalError("unhandledRejection", error) -}) - -let code = 1 - -try { - seed = Bun.spawn(["bun", "script/seed-e2e.ts"], { - cwd: opencodeDir, - env: serverEnv, - stdout: "inherit", - stderr: "inherit", - }) - - const seedExit = await seed.exited - if (seedExit !== 0) { - code = seedExit - } else { - Object.assign(process.env, serverEnv) - process.env.AGENT = "1" - process.env.OPENCODE = "1" - process.env.OPENCODE_PID = String(process.pid) - - const log = await import("../../opencode/src/util/log") - const install = await import("../../opencode/src/installation") - await log.Log.init({ - print: true, - dev: install.Installation.isLocal(), - level: "WARN", - }) - - const servermod = await import("../../opencode/src/server/server") - inst = await import("../../opencode/src/project/instance") - server = await servermod.Server.listen({ port: serverPort, hostname: "127.0.0.1" }) - console.log(`opencode server listening on http://127.0.0.1:${serverPort}`) - - await waitForHealth(`http://127.0.0.1:${serverPort}/global/health`) - runner = Bun.spawn(["bun", "test:e2e", ...extraArgs], { - cwd: appDir, - env: runnerEnv, - stdout: "inherit", - stderr: "inherit", - }) - code = await runner.exited - } -} catch (error) { - console.error(error) - code = 1 -} finally { - await cleanup() -} - -process.exit(code) diff --git a/packages/app/src/addons/serialize.test.ts b/packages/app/src/addons/serialize.test.ts index 7f6780557..6828e60f8 100644 --- a/packages/app/src/addons/serialize.test.ts +++ b/packages/app/src/addons/serialize.test.ts @@ -180,8 +180,8 @@ describe("SerializeAddon", () => { await writeAndWait(term, input) const origLine = term.buffer.active.getLine(0) - const origFg = origLine!.getCell(0)!.getFgColor() - const origBg = origLine!.getCell(0)!.getBgColor() + const _origFg = origLine!.getCell(0)!.getFgColor() + const _origBg = origLine!.getCell(0)!.getBgColor() expect(origLine!.getCell(0)!.isBold()).toBe(1) const serialized = addon.serialize({ range: { start: 0, end: 0 } }) diff --git a/packages/app/src/addons/serialize.ts b/packages/app/src/addons/serialize.ts index 4cab55b3f..3823fb443 100644 --- a/packages/app/src/addons/serialize.ts +++ b/packages/app/src/addons/serialize.ts @@ -258,8 +258,8 @@ class StringSerializeHandler extends BaseSerializeHandler { } protected _beforeSerialize(rows: number, start: number, _end: number): void { - this._allRows = new Array<string>(rows) - this._allRowSeparators = new Array<string>(rows) + this._allRows = Array.from<string>({ length: rows }) + this._allRowSeparators = Array.from<string>({ length: rows }) this._rowIndex = 0 this._currentRow = "" diff --git a/packages/app/src/app.tsx b/packages/app/src/app.tsx index 35fd36cca..dbe107448 100644 --- a/packages/app/src/app.tsx +++ b/packages/app/src/app.tsx @@ -10,7 +10,7 @@ import { ThemeProvider } from "@opencode-ai/ui/theme/context" import { MetaProvider } from "@solidjs/meta" import { type BaseRouterProps, Navigate, Route, Router } from "@solidjs/router" import { QueryClient, QueryClientProvider } from "@tanstack/solid-query" -import { type Duration, Effect } from "effect" +import { Effect } from "effect" import { type Component, createMemo, @@ -121,10 +121,10 @@ function SessionProviders(props: ParentProps) { function RouterRoot(props: ParentProps<{ appChildren?: JSX.Element }>) { return ( <AppShellProviders> - <Suspense fallback={<Loading />}> - {props.appChildren} - {props.children} - </Suspense> + {/*<Suspense fallback={<Loading />}>*/} + {props.appChildren} + {props.children} + {/*</Suspense>*/} </AppShellProviders> ) } @@ -156,11 +156,6 @@ export function AppBaseProviders(props: ParentProps<{ locale?: Locale }>) { ) } -const effectMinDuration = - (duration: Duration.Input) => - <A, E, R>(e: Effect.Effect<A, E, R>) => - Effect.all([e, Effect.sleep(duration)], { concurrency: "unbounded" }).pipe(Effect.map((v) => v[0])) - function ConnectionGate(props: ParentProps<{ disableHealthCheck?: boolean }>) { const server = useServer() const checkServerHealth = useCheckServerHealth() @@ -189,32 +184,41 @@ function ConnectionGate(props: ParentProps<{ disableHealthCheck?: boolean }>) { ) return ( - <Show - when={checkMode() === "blocking" ? !startupHealthCheck.loading : startupHealthCheck.state !== "pending"} + <Suspense fallback={ <div class="h-dvh w-screen flex flex-col items-center justify-center bg-background-base"> <Splash class="w-16 h-20 opacity-50 animate-pulse" /> </div> } > + {/*<Show + when={checkMode() === "blocking" ? !startupHealthCheck.loading : startupHealthCheck.state !== "pending"} + fallback={ + <div class="h-dvh w-screen flex flex-col items-center justify-center bg-background-base"> + <Splash class="w-16 h-20 opacity-50 animate-pulse" /> + </div> + } + >*/} + {checkMode() === "blocking" ? startupHealthCheck() : startupHealthCheck.latest} <Show when={startupHealthCheck()} fallback={ <ConnectionError onRetry={() => { - if (checkMode() === "background") healthCheckActions.refetch() + if (checkMode() === "background") void healthCheckActions.refetch() }} onServerSelected={(key) => { setCheckMode("blocking") server.setActive(key) - healthCheckActions.refetch() + void healthCheckActions.refetch() }} /> } > {props.children} </Show> - </Show> + {/*</Show>*/} + </Suspense> ) } diff --git a/packages/app/src/components/dialog-connect-provider.tsx b/packages/app/src/components/dialog-connect-provider.tsx index 41225d02a..e30574379 100644 --- a/packages/app/src/components/dialog-connect-provider.tsx +++ b/packages/app/src/components/dialog-connect-provider.tsx @@ -327,7 +327,7 @@ export function DialogConnectProvider(props: { provider: string }) { if (loading()) return if (methods().length === 1) { auto = true - selectMethod(0) + void selectMethod(0) } }) @@ -373,7 +373,7 @@ export function DialogConnectProvider(props: { provider: string }) { key={(m) => m?.label} onSelect={async (selected, index) => { if (!selected) return - selectMethod(index) + void selectMethod(index) }} > {(i) => ( diff --git a/packages/app/src/components/dialog-edit-project.tsx b/packages/app/src/components/dialog-edit-project.tsx index eb962f47e..ea5d70065 100644 --- a/packages/app/src/components/dialog-edit-project.tsx +++ b/packages/app/src/components/dialog-edit-project.tsx @@ -9,7 +9,7 @@ import { createStore } from "solid-js/store" import { useGlobalSDK } from "@/context/global-sdk" import { useGlobalSync } from "@/context/global-sync" import { type LocalProject, getAvatarColors } from "@/context/layout" -import { getFilename } from "@opencode-ai/util/path" +import { getFilename } from "@opencode-ai/shared/util/path" import { Avatar } from "@opencode-ai/ui/avatar" import { useLanguage } from "@/context/language" diff --git a/packages/app/src/components/dialog-fork.tsx b/packages/app/src/components/dialog-fork.tsx index 9e1b896fa..710618c30 100644 --- a/packages/app/src/components/dialog-fork.tsx +++ b/packages/app/src/components/dialog-fork.tsx @@ -9,7 +9,7 @@ import { List } from "@opencode-ai/ui/list" import { showToast } from "@opencode-ai/ui/toast" import { extractPromptFromParts } from "@/utils/prompt" import type { TextPart as SDKTextPart } from "@opencode-ai/sdk/v2/client" -import { base64Encode } from "@opencode-ai/util/encode" +import { base64Encode } from "@opencode-ai/shared/util/encode" import { useLanguage } from "@/context/language" interface ForkableMessage { diff --git a/packages/app/src/components/dialog-select-directory.tsx b/packages/app/src/components/dialog-select-directory.tsx index 91e23f8ff..903cb1915 100644 --- a/packages/app/src/components/dialog-select-directory.tsx +++ b/packages/app/src/components/dialog-select-directory.tsx @@ -3,7 +3,7 @@ import { Dialog } from "@opencode-ai/ui/dialog" import { FileIcon } from "@opencode-ai/ui/file-icon" import { List } from "@opencode-ai/ui/list" import type { ListRef } from "@opencode-ai/ui/list" -import { getDirectory, getFilename } from "@opencode-ai/util/path" +import { getDirectory, getFilename } from "@opencode-ai/shared/util/path" import fuzzysort from "fuzzysort" import { createMemo, createResource, createSignal } from "solid-js" import { useGlobalSDK } from "@/context/global-sdk" diff --git a/packages/app/src/components/dialog-select-file.tsx b/packages/app/src/components/dialog-select-file.tsx index e21be77fb..186906f92 100644 --- a/packages/app/src/components/dialog-select-file.tsx +++ b/packages/app/src/components/dialog-select-file.tsx @@ -4,8 +4,8 @@ import { FileIcon } from "@opencode-ai/ui/file-icon" import { Icon } from "@opencode-ai/ui/icon" import { Keybind } from "@opencode-ai/ui/keybind" import { List } from "@opencode-ai/ui/list" -import { base64Encode } from "@opencode-ai/util/encode" -import { getDirectory, getFilename } from "@opencode-ai/util/path" +import { base64Encode } from "@opencode-ai/shared/util/encode" +import { getDirectory, getFilename } from "@opencode-ai/shared/util/path" import { useNavigate } from "@solidjs/router" import { createMemo, createSignal, Match, onCleanup, Show, Switch } from "solid-js" import { formatKeybind, useCommand, type CommandOption } from "@/context/command" @@ -348,8 +348,8 @@ export function DialogSelectFile(props: { mode?: DialogSelectFileMode; onOpenFil const open = (path: string) => { const value = file.tab(path) - tabs().open(value) - file.load(path) + void tabs().open(value) + void file.load(path) if (!view().reviewPanel.opened()) view().reviewPanel.open() layout.fileTree.setTab("all") props.onOpenFile?.(path) diff --git a/packages/app/src/components/dialog-select-server.tsx b/packages/app/src/components/dialog-select-server.tsx index ca4c42a37..dd92edec3 100644 --- a/packages/app/src/components/dialog-select-server.tsx +++ b/packages/app/src/components/dialog-select-server.tsx @@ -344,7 +344,7 @@ export function DialogSelectServer() { createEffect(() => { items() - refreshHealth() + void refreshHealth() const interval = setInterval(refreshHealth, 10_000) onCleanup(() => clearInterval(interval)) }) @@ -498,7 +498,7 @@ export function DialogSelectServer() { async function handleRemove(url: ServerConnection.Key) { server.remove(url) if ((await platform.getDefaultServer?.()) === url) { - platform.setDefaultServer?.(null) + void platform.setDefaultServer?.(null) } } @@ -536,7 +536,7 @@ export function DialogSelectServer() { items={sortedItems} key={(x) => x.http.url} onSelect={(x) => { - if (x) select(x) + if (x) void select(x) }} divider={true} class="px-5 [&_[data-slot=list-search-wrapper]]:w-full [&_[data-slot=list-scroll]]h-[300px] [&_[data-slot=list-scroll]]:overflow-y-auto [&_[data-slot=list-items]]:bg-surface-base [&_[data-slot=list-items]]:rounded-md [&_[data-slot=list-item]]:min-h-14 [&_[data-slot=list-item]]:p-3 [&_[data-slot=list-item]]:!bg-transparent" diff --git a/packages/app/src/components/file-tree.tsx b/packages/app/src/components/file-tree.tsx index 930832fb6..211ce05ef 100644 --- a/packages/app/src/components/file-tree.tsx +++ b/packages/app/src/components/file-tree.tsx @@ -14,7 +14,6 @@ import { Switch, untrack, type ComponentProps, - type JSXElement, type ParentProps, } from "solid-js" import { Dynamic } from "solid-js/web" @@ -149,7 +148,7 @@ const FileTreeNode = ( classList={{ "w-full min-w-0 h-6 flex items-center justify-start gap-x-1.5 rounded-md px-1.5 py-0 text-left hover:bg-surface-raised-base-hover active:bg-surface-base-active transition-colors cursor-pointer": true, "bg-surface-base-active": local.node.path === local.active, - ...(local.classList ?? {}), + ...local.classList, [local.class ?? ""]: !!local.class, [local.nodeClass ?? ""]: !!local.nodeClass, }} diff --git a/packages/app/src/components/prompt-input.tsx b/packages/app/src/components/prompt-input.tsx index eedbc91cf..156b0b3a4 100644 --- a/packages/app/src/components/prompt-input.tsx +++ b/packages/app/src/components/prompt-input.tsx @@ -35,7 +35,6 @@ import { useLanguage } from "@/context/language" import { usePlatform } from "@/context/platform" import { useSessionLayout } from "@/pages/session/session-layout" import { createSessionTabs } from "@/pages/session/helpers" -import { promptEnabled, promptProbe } from "@/testing/prompt" import { createTextFragment, getCursorPosition, setCursorPosition, setRangeEdge } from "./prompt-input/editor-dom" import { createPromptAttachments } from "./prompt-input/attachments" import { ACCEPTED_FILE_TYPES } from "./prompt-input/files" @@ -55,6 +54,8 @@ import { PromptImageAttachments } from "./prompt-input/image-attachments" import { PromptDragOverlay } from "./prompt-input/drag-overlay" import { promptPlaceholder } from "./prompt-input/placeholder" import { ImagePreview } from "@opencode-ai/ui/image-preview" +import { useQuery } from "@tanstack/solid-query" +import { loadAgentsQuery, loadProvidersQuery } from "@/context/global-sync/bootstrap" interface PromptInputProps { class?: string @@ -101,6 +102,7 @@ const NON_EMPTY_TEXT = /[^\s\u200B]/ export const PromptInput: Component<PromptInputProps> = (props) => { const sdk = useSDK() + const sync = useSync() const local = useLocal() const files = useFile() @@ -213,9 +215,9 @@ export const PromptInput: Component<PromptInputProps> = (props) => { if (!view().reviewPanel.opened()) view().reviewPanel.open() layout.fileTree.setTab("all") const tab = files.tab(item.path) - tabs().open(tab) + void tabs().open(tab) tabs().setActive(tab) - Promise.resolve(files.load(item.path)).finally(() => queueCommentFocus()) + void Promise.resolve(files.load(item.path)).finally(() => queueCommentFocus()) } const recent = createMemo(() => { @@ -639,7 +641,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => { const handleSlashSelect = (cmd: SlashCommand | undefined) => { if (!cmd) return - promptProbe.select(cmd.id) closePopover() const images = imageAttachments() @@ -728,21 +729,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => { element?.scrollIntoView({ block: "nearest", behavior: "smooth" }) }) }) - - if (promptEnabled()) { - createEffect(() => { - promptProbe.set({ - popover: store.popover, - slash: { - active: slashActive() ?? null, - ids: slashFlat().map((cmd) => cmd.id), - }, - }) - }) - - onCleanup(() => promptProbe.clear()) - } - const selectPopoverActive = () => { if (store.popover === "at") { const items = atFlat() @@ -1156,7 +1142,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => { } if (working()) { - abort() + void abort() event.preventDefault() event.stopPropagation() return @@ -1222,7 +1208,7 @@ export const PromptInput: Component<PromptInputProps> = (props) => { return } if (working()) { - abort() + void abort() event.preventDefault() } return @@ -1262,10 +1248,18 @@ export const PromptInput: Component<PromptInputProps> = (props) => { ) { return } - handleSubmit(event) + void handleSubmit(event) } } + const agentsQuery = useQuery(() => loadAgentsQuery(sdk.directory)) + const agentsLoading = () => agentsQuery.isLoading + + const globalProvidersQuery = useQuery(() => loadProvidersQuery(null)) + const providersQuery = useQuery(() => loadProvidersQuery(sdk.directory)) + + const providersLoading = () => agentsLoading() || providersQuery.isLoading || globalProvidersQuery.isLoading + return ( <div class="relative size-full _max-h-[320px] flex flex-col gap-0"> <PromptPopover @@ -1461,53 +1455,89 @@ export const PromptInput: Component<PromptInputProps> = (props) => { <span class="truncate text-13-medium text-text-strong">{language.t("prompt.mode.shell")}</span> <div class="size-4 shrink-0" /> </div> - <div class="flex items-center gap-1.5 min-w-0 flex-1"> - <div data-component="prompt-agent-control"> - <TooltipKeybind - placement="top" - gutter={4} - title={language.t("command.agent.cycle")} - keybind={command.keybind("agent.cycle")} - > - <Select - size="normal" - options={agentNames()} - current={local.agent.current()?.name ?? ""} - onSelect={(value) => { - local.agent.set(value) - restoreFocus() - }} - class="capitalize max-w-[160px] text-text-base" - valueClass="truncate text-13-regular text-text-base" - triggerStyle={control()} - triggerProps={{ "data-action": "prompt-agent" }} - variant="ghost" - /> - </TooltipKeybind> - </div> - <Show when={store.mode !== "shell"}> - <div data-component="prompt-model-control"> - <Show - when={providers.paid().length > 0} - fallback={ + <div class="flex items-center gap-1.5 min-w-0 flex-1 h-7"> + <Show when={!agentsLoading()}> + <div data-component="prompt-agent-control"> + <TooltipKeybind + placement="top" + gutter={4} + title={language.t("command.agent.cycle")} + keybind={command.keybind("agent.cycle")} + > + <Select + size="normal" + options={agentNames()} + current={local.agent.current()?.name ?? ""} + onSelect={(value) => { + local.agent.set(value) + restoreFocus() + }} + class="capitalize max-w-[160px] text-text-base" + valueClass="truncate text-13-regular text-text-base" + triggerStyle={control()} + triggerProps={{ "data-action": "prompt-agent" }} + variant="ghost" + /> + </TooltipKeybind> + </div> + </Show> + <Show when={!providersLoading()}> + <Show when={store.mode !== "shell"}> + <div data-component="prompt-model-control"> + <Show + when={providers.paid().length > 0} + fallback={ + <TooltipKeybind + placement="top" + gutter={4} + title={language.t("command.model.choose")} + keybind={command.keybind("model.choose")} + > + <Button + data-action="prompt-model" + as="div" + variant="ghost" + size="normal" + class="min-w-0 max-w-[320px] text-13-regular text-text-base group" + style={control()} + onClick={() => { + void import("@/components/dialog-select-model-unpaid").then((x) => { + dialog.show(() => <x.DialogSelectModelUnpaid model={local.model} />) + }) + }} + > + <Show when={local.model.current()?.provider?.id}> + <ProviderIcon + id={local.model.current()?.provider?.id ?? ""} + class="size-4 shrink-0 opacity-40 group-hover:opacity-100 transition-opacity duration-150" + style={{ "will-change": "opacity", transform: "translateZ(0)" }} + /> + </Show> + <span class="truncate"> + {local.model.current()?.name ?? language.t("dialog.model.select.title")} + </span> + <Icon name="chevron-down" size="small" class="shrink-0" /> + </Button> + </TooltipKeybind> + } + > <TooltipKeybind placement="top" gutter={4} title={language.t("command.model.choose")} keybind={command.keybind("model.choose")} > - <Button - data-action="prompt-model" - as="div" - variant="ghost" - size="normal" - class="min-w-0 max-w-[320px] text-13-regular text-text-base group" - style={control()} - onClick={() => { - void import("@/components/dialog-select-model-unpaid").then((x) => { - dialog.show(() => <x.DialogSelectModelUnpaid model={local.model} />) - }) + <ModelSelectorPopover + model={local.model} + triggerAs={Button} + triggerProps={{ + variant: "ghost", + size: "normal", + style: control(), + class: "min-w-0 max-w-[320px] text-13-regular text-text-base group", + "data-action": "prompt-model", }} + onClose={restoreFocus} > <Show when={local.model.current()?.provider?.id}> <ProviderIcon @@ -1520,67 +1550,35 @@ export const PromptInput: Component<PromptInputProps> = (props) => { {local.model.current()?.name ?? language.t("dialog.model.select.title")} </span> <Icon name="chevron-down" size="small" class="shrink-0" /> - </Button> + </ModelSelectorPopover> </TooltipKeybind> - } - > + </Show> + </div> + <div data-component="prompt-variant-control"> <TooltipKeybind placement="top" gutter={4} - title={language.t("command.model.choose")} - keybind={command.keybind("model.choose")} + title={language.t("command.model.variant.cycle")} + keybind={command.keybind("model.variant.cycle")} > - <ModelSelectorPopover - model={local.model} - triggerAs={Button} - triggerProps={{ - variant: "ghost", - size: "normal", - style: control(), - class: "min-w-0 max-w-[320px] text-13-regular text-text-base group", - "data-action": "prompt-model", + <Select + size="normal" + options={variants()} + current={local.model.variant.current() ?? "default"} + label={(x) => (x === "default" ? language.t("common.default") : x)} + onSelect={(value) => { + local.model.variant.set(value === "default" ? undefined : value) + restoreFocus() }} - onClose={restoreFocus} - > - <Show when={local.model.current()?.provider?.id}> - <ProviderIcon - id={local.model.current()?.provider?.id ?? ""} - class="size-4 shrink-0 opacity-40 group-hover:opacity-100 transition-opacity duration-150" - style={{ "will-change": "opacity", transform: "translateZ(0)" }} - /> - </Show> - <span class="truncate"> - {local.model.current()?.name ?? language.t("dialog.model.select.title")} - </span> - <Icon name="chevron-down" size="small" class="shrink-0" /> - </ModelSelectorPopover> + class="capitalize max-w-[160px] text-text-base" + valueClass="truncate text-13-regular text-text-base" + triggerStyle={control()} + triggerProps={{ "data-action": "prompt-model-variant" }} + variant="ghost" + /> </TooltipKeybind> - </Show> - </div> - <div data-component="prompt-variant-control"> - <TooltipKeybind - placement="top" - gutter={4} - title={language.t("command.model.variant.cycle")} - keybind={command.keybind("model.variant.cycle")} - > - <Select - size="normal" - options={variants()} - current={local.model.variant.current() ?? "default"} - label={(x) => (x === "default" ? language.t("common.default") : x)} - onSelect={(value) => { - local.model.variant.set(value === "default" ? undefined : value) - restoreFocus() - }} - class="capitalize max-w-[160px] text-text-base" - valueClass="truncate text-13-regular text-text-base" - triggerStyle={control()} - triggerProps={{ "data-action": "prompt-model-variant" }} - variant="ghost" - /> - </TooltipKeybind> - </div> + </div> + </Show> </Show> </div> </div> diff --git a/packages/app/src/components/prompt-input/build-request-parts.ts b/packages/app/src/components/prompt-input/build-request-parts.ts index a1076e60c..c268af35e 100644 --- a/packages/app/src/components/prompt-input/build-request-parts.ts +++ b/packages/app/src/components/prompt-input/build-request-parts.ts @@ -1,4 +1,4 @@ -import { getFilename } from "@opencode-ai/util/path" +import { getFilename } from "@opencode-ai/shared/util/path" import { type AgentPartInput, type FilePartInput, type Part, type TextPartInput } from "@opencode-ai/sdk/v2/client" import type { FileSelection } from "@/context/file" import { encodeFilePath } from "@/context/file/path" diff --git a/packages/app/src/components/prompt-input/context-items.tsx b/packages/app/src/components/prompt-input/context-items.tsx index b138fe3ef..9f20f1c04 100644 --- a/packages/app/src/components/prompt-input/context-items.tsx +++ b/packages/app/src/components/prompt-input/context-items.tsx @@ -2,7 +2,7 @@ import { Component, For, Show } from "solid-js" import { FileIcon } from "@opencode-ai/ui/file-icon" import { IconButton } from "@opencode-ai/ui/icon-button" import { Tooltip } from "@opencode-ai/ui/tooltip" -import { getDirectory, getFilename, getFilenameTruncated } from "@opencode-ai/util/path" +import { getDirectory, getFilename, getFilenameTruncated } from "@opencode-ai/shared/util/path" import type { ContextItem } from "@/context/prompt" type PromptContextItem = ContextItem & { key: string } diff --git a/packages/app/src/components/prompt-input/slash-popover.tsx b/packages/app/src/components/prompt-input/slash-popover.tsx index 65eb01c79..0c8c95923 100644 --- a/packages/app/src/components/prompt-input/slash-popover.tsx +++ b/packages/app/src/components/prompt-input/slash-popover.tsx @@ -1,7 +1,7 @@ import { Component, For, Match, Show, Switch } from "solid-js" import { FileIcon } from "@opencode-ai/ui/file-icon" import { Icon } from "@opencode-ai/ui/icon" -import { getDirectory, getFilename } from "@opencode-ai/util/path" +import { getDirectory, getFilename } from "@opencode-ai/shared/util/path" export type AtOption = | { type: "agent"; name: string; display: string } diff --git a/packages/app/src/components/prompt-input/submit.test.ts b/packages/app/src/components/prompt-input/submit.test.ts index 03bece2e3..cf9949723 100644 --- a/packages/app/src/components/prompt-input/submit.test.ts +++ b/packages/app/src/components/prompt-input/submit.test.ts @@ -74,7 +74,7 @@ beforeAll(async () => { showToast: () => 0, })) - mock.module("@opencode-ai/util/encode", () => ({ + mock.module("@opencode-ai/shared/util/encode", () => ({ base64Encode: (value: string) => value, })) diff --git a/packages/app/src/components/prompt-input/submit.ts b/packages/app/src/components/prompt-input/submit.ts index 2a3a3d0e9..6805f619c 100644 --- a/packages/app/src/components/prompt-input/submit.ts +++ b/packages/app/src/components/prompt-input/submit.ts @@ -1,9 +1,9 @@ import type { Message, Session } from "@opencode-ai/sdk/v2/client" import { showToast } from "@opencode-ai/ui/toast" -import { base64Encode } from "@opencode-ai/util/encode" -import { Binary } from "@opencode-ai/util/binary" +import { base64Encode } from "@opencode-ai/shared/util/encode" +import { Binary } from "@opencode-ai/shared/util/binary" import { useNavigate, useParams } from "@solidjs/router" -import type { Accessor } from "solid-js" +import { batch, type Accessor } from "solid-js" import type { FileSelection } from "@/context/file" import { useGlobalSync } from "@/context/global-sync" import { useLanguage } from "@/context/language" @@ -13,7 +13,6 @@ import { usePermission } from "@/context/permission" import { type ContextItem, type ImageAttachmentPart, type Prompt, usePrompt } from "@/context/prompt" import { useSDK } from "@/context/sdk" import { useSync } from "@/context/sync" -import { promptProbe } from "@/testing/prompt" import { Identifier } from "@/utils/id" import { Worktree as WorktreeState } from "@/utils/worktree" import { buildRequestParts } from "./build-request-parts" @@ -139,13 +138,17 @@ export async function sendFollowupDraft(input: FollowupSendInput) { messageID, }) - setBusy() - add() + batch(() => { + setBusy() + add() + }) try { if (!(await wait())) { - setIdle() - remove() + batch(() => { + setIdle() + remove() + }) return false } @@ -159,8 +162,10 @@ export async function sendFollowupDraft(input: FollowupSendInput) { }) return true } catch (err) { - setIdle() - remove() + batch(() => { + setIdle() + remove() + }) throw err } } @@ -290,7 +295,7 @@ export function createPromptSubmit(input: PromptSubmitInput) { const mode = input.mode() if (text.trim().length === 0 && images.length === 0 && input.commentCount() === 0) { - if (input.working()) abort() + if (input.working()) void abort() return } @@ -307,7 +312,6 @@ export function createPromptSubmit(input: PromptSubmitInput) { input.addToHistory(currentPrompt, mode) input.resetHistoryNavigation() - promptProbe.start() const projectDirectory = sdk.directory const isNewSession = !params.id @@ -427,7 +431,6 @@ export function createPromptSubmit(input: PromptSubmitInput) { return } - promptProbe.submit({ sessionID: session.id, directory: sessionDirectory }) input.onSubmit?.() if (mode === "shell") { diff --git a/packages/app/src/components/session-context-usage.tsx b/packages/app/src/components/session-context-usage.tsx index d7c249ab0..6b7fe4ef7 100644 --- a/packages/app/src/components/session-context-usage.tsx +++ b/packages/app/src/components/session-context-usage.tsx @@ -24,7 +24,7 @@ function openSessionContext(args: { }) { if (!args.view.reviewPanel.opened()) args.view.reviewPanel.open() if (args.layout.fileTree.opened() && args.layout.fileTree.tab() !== "all") args.layout.fileTree.setTab("all") - args.tabs.open("context") + void args.tabs.open("context") args.tabs.setActive("context") } diff --git a/packages/app/src/components/session/session-context-tab.tsx b/packages/app/src/components/session/session-context-tab.tsx index 4e7dc8e78..abf4c9334 100644 --- a/packages/app/src/components/session/session-context-tab.tsx +++ b/packages/app/src/components/session/session-context-tab.tsx @@ -1,8 +1,8 @@ import { createMemo, createEffect, on, onCleanup, For, Show } from "solid-js" import type { JSX } from "solid-js" import { useSync } from "@/context/sync" -import { checksum } from "@opencode-ai/util/encode" -import { findLast } from "@opencode-ai/util/array" +import { checksum } from "@opencode-ai/shared/util/encode" +import { findLast } from "@opencode-ai/shared/util/array" import { same } from "@/utils/same" import { Icon } from "@opencode-ai/ui/icon" import { Accordion } from "@opencode-ai/ui/accordion" diff --git a/packages/app/src/components/session/session-header.tsx b/packages/app/src/components/session/session-header.tsx index 495b32340..7acfdfc37 100644 --- a/packages/app/src/components/session/session-header.tsx +++ b/packages/app/src/components/session/session-header.tsx @@ -7,8 +7,8 @@ import { Keybind } from "@opencode-ai/ui/keybind" import { Spinner } from "@opencode-ai/ui/spinner" import { showToast } from "@opencode-ai/ui/toast" import { Tooltip, TooltipKeybind } from "@opencode-ai/ui/tooltip" -import { getFilename } from "@opencode-ai/util/path" -import { createEffect, createMemo, For, onCleanup, Show } from "solid-js" +import { getFilename } from "@opencode-ai/shared/util/path" +import { createEffect, createMemo, For, Show } from "solid-js" import { createStore } from "solid-js/store" import { Portal } from "solid-js/web" import { useCommand } from "@/context/command" diff --git a/packages/app/src/components/session/session-new-view.tsx b/packages/app/src/components/session/session-new-view.tsx index e4ef36393..d2cac28fc 100644 --- a/packages/app/src/components/session/session-new-view.tsx +++ b/packages/app/src/components/session/session-new-view.tsx @@ -5,7 +5,7 @@ import { useSDK } from "@/context/sdk" import { useLanguage } from "@/context/language" import { Icon } from "@opencode-ai/ui/icon" import { Mark } from "@opencode-ai/ui/logo" -import { getDirectory, getFilename } from "@opencode-ai/util/path" +import { getDirectory, getFilename } from "@opencode-ai/shared/util/path" const MAIN_WORKTREE = "main" const CREATE_WORKTREE = "create" diff --git a/packages/app/src/components/session/session-sortable-tab.tsx b/packages/app/src/components/session/session-sortable-tab.tsx index dfda91c16..fb2275c44 100644 --- a/packages/app/src/components/session/session-sortable-tab.tsx +++ b/packages/app/src/components/session/session-sortable-tab.tsx @@ -5,7 +5,7 @@ import { FileIcon } from "@opencode-ai/ui/file-icon" import { IconButton } from "@opencode-ai/ui/icon-button" import { TooltipKeybind } from "@opencode-ai/ui/tooltip" import { Tabs } from "@opencode-ai/ui/tabs" -import { getFilename } from "@opencode-ai/util/path" +import { getFilename } from "@opencode-ai/shared/util/path" import { useFile } from "@/context/file" import { useLanguage } from "@/context/language" import { useCommand } from "@/context/command" diff --git a/packages/app/src/components/session/session-sortable-terminal-tab.tsx b/packages/app/src/components/session/session-sortable-terminal-tab.tsx index ba697f91a..2d88ed180 100644 --- a/packages/app/src/components/session/session-sortable-terminal-tab.tsx +++ b/packages/app/src/components/session/session-sortable-terminal-tab.tsx @@ -44,7 +44,7 @@ export function SortableTerminalTab(props: { terminal: LocalPTY; onClose?: () => const close = () => { const count = terminal.all().length - terminal.close(props.terminal.id) + void terminal.close(props.terminal.id) if (count === 1) { props.onClose?.() } diff --git a/packages/app/src/components/terminal.tsx b/packages/app/src/components/terminal.tsx index c8430d8bb..57e91d6d3 100644 --- a/packages/app/src/components/terminal.tsx +++ b/packages/app/src/components/terminal.tsx @@ -13,7 +13,6 @@ import { useSDK } from "@/context/sdk" import { useServer } from "@/context/server" import { monoFontFamily, useSettings } from "@/context/settings" import type { LocalPTY } from "@/context/terminal" -import { terminalAttr, terminalProbe } from "@/testing/terminal" import { disposeIfDisposable, getHoveredLinkText, setOptionIfSupported } from "@/utils/runtime-adapters" import { terminalWriter } from "@/utils/terminal-writer" @@ -178,7 +177,6 @@ export const Terminal = (props: TerminalProps) => { let container!: HTMLDivElement const [local, others] = splitProps(props, ["pty", "class", "classList", "autoFocus", "onConnect", "onConnectError"]) const id = local.pty.id - const probe = terminalProbe(id) const restore = typeof local.pty.buffer === "string" ? local.pty.buffer : "" const restoreSize = restore && @@ -193,7 +191,7 @@ export const Terminal = (props: TerminalProps) => { const scrollY = typeof local.pty.scrollY === "number" ? local.pty.scrollY : undefined let ws: WebSocket | undefined let term: Term | undefined - let ghostty: Ghostty + let _ghostty: Ghostty let serializeAddon: SerializeAddon let fitAddon: FitAddon let handleResize: () => void @@ -349,9 +347,6 @@ export const Terminal = (props: TerminalProps) => { } onMount(() => { - probe.init() - cleanups.push(() => probe.drop()) - const run = async () => { const loaded = await loadGhostty() if (disposed) return @@ -377,12 +372,10 @@ export const Terminal = (props: TerminalProps) => { cleanup() return } - ghostty = g + _ghostty = g term = t output = terminalWriter((data, done) => t.write(data, () => { - probe.render(data) - probe.settle() done?.() }), ) @@ -422,7 +415,7 @@ export const Terminal = (props: TerminalProps) => { if (local.autoFocus !== false) focusTerminal() if (typeof document !== "undefined" && document.fonts) { - document.fonts.ready.then(scheduleFit) + void document.fonts.ready.then(scheduleFit) } const onResize = t.onResize((size) => { @@ -534,7 +527,6 @@ export const Terminal = (props: TerminalProps) => { const handleOpen = () => { if (disposed) return tries = 0 - probe.connect() local.onConnect?.() scheduleSize(t.cols, t.rows) } @@ -599,13 +591,6 @@ export const Terminal = (props: TerminalProps) => { socket.addEventListener("close", handleClose) } - probe.control({ - disconnect: () => { - if (!ws) return - ws.close(4_000, "e2e") - }, - }) - open() } @@ -645,12 +630,11 @@ export const Terminal = (props: TerminalProps) => { <div ref={container} data-component="terminal" - {...{ [terminalAttr]: id }} data-prevent-autofocus tabIndex={-1} style={{ "background-color": terminalColors().background }} classList={{ - ...(local.classList ?? {}), + ...local.classList, "select-text": true, "size-full px-6 py-3 font-mono relative overflow-hidden": true, [local.class ?? ""]: !!local.class, diff --git a/packages/app/src/components/titlebar.tsx b/packages/app/src/components/titlebar.tsx index 0a41f3119..b7edb85ed 100644 --- a/packages/app/src/components/titlebar.tsx +++ b/packages/app/src/components/titlebar.tsx @@ -1,4 +1,4 @@ -import { createEffect, createMemo, onCleanup, Show, untrack } from "solid-js" +import { createEffect, createMemo, Show, untrack } from "solid-js" import { createStore } from "solid-js/store" import { useLocation, useNavigate, useParams } from "@solidjs/router" import { IconButton } from "@opencode-ai/ui/icon-button" @@ -252,41 +252,48 @@ export function Titlebar() { </div> </div> </Show> - <Show when={hasProjects()}> - <div - class="flex items-center gap-0 transition-transform" - classList={{ - "translate-x-0": !layout.sidebar.opened(), - "-translate-x-[36px]": layout.sidebar.opened(), - "duration-180 ease-out": !layout.sidebar.opened(), - "duration-180 ease-in": layout.sidebar.opened(), - }} - > - <Tooltip placement="bottom" value={language.t("common.goBack")} openDelay={2000}> - <Button - variant="ghost" - icon="chevron-left" - class="titlebar-icon w-6 h-6 p-0 box-border" - disabled={!canBack()} - onClick={back} - aria-label={language.t("common.goBack")} - /> - </Tooltip> - <Tooltip placement="bottom" value={language.t("common.goForward")} openDelay={2000}> - <Button - variant="ghost" - icon="chevron-right" - class="titlebar-icon w-6 h-6 p-0 box-border" - disabled={!canForward()} - onClick={forward} - aria-label={language.t("common.goForward")} - /> - </Tooltip> - </div> - </Show> + <div + class="flex items-center shrink-0" + classList={{ + "translate-x-0": !layout.sidebar.opened(), + "-translate-x-[36px]": layout.sidebar.opened(), + "duration-180 ease-out": !layout.sidebar.opened(), + "duration-180 ease-in": layout.sidebar.opened(), + }} + > + <Show when={hasProjects()}> + <div class="flex items-center gap-0 transition-transform"> + <Tooltip placement="bottom" value={language.t("common.goBack")} openDelay={2000}> + <Button + variant="ghost" + icon="chevron-left" + class="titlebar-icon w-6 h-6 p-0 box-border" + disabled={!canBack()} + onClick={back} + aria-label={language.t("common.goBack")} + /> + </Tooltip> + <Tooltip placement="bottom" value={language.t("common.goForward")} openDelay={2000}> + <Button + variant="ghost" + icon="chevron-right" + class="titlebar-icon w-6 h-6 p-0 box-border" + disabled={!canForward()} + onClick={forward} + aria-label={language.t("common.goForward")} + /> + </Tooltip> + </div> + </Show> + <div id="opencode-titlebar-left" class="flex items-center gap-3 min-w-0 px-2" /> + {["beta", "dev"].includes(import.meta.env.VITE_OPENCODE_CHANNEL) && ( + <div class="bg-icon-interactive-base text-[#FFF] font-medium px-2 rounded-sm uppercase font-mono"> + {import.meta.env.VITE_OPENCODE_CHANNEL.toUpperCase()} + </div> + )} + </div> </div> </div> - <div id="opencode-titlebar-left" class="flex items-center gap-3 min-w-0 px-2" /> </div> <div class="min-w-0 flex items-center justify-center pointer-events-none"> diff --git a/packages/app/src/context/file.tsx b/packages/app/src/context/file.tsx index f8fec7142..8998731a6 100644 --- a/packages/app/src/context/file.tsx +++ b/packages/app/src/context/file.tsx @@ -3,7 +3,7 @@ import { createStore, produce, reconcile } from "solid-js/store" import { createSimpleContext } from "@opencode-ai/ui/context" import { showToast } from "@opencode-ai/ui/toast" import { useParams } from "@solidjs/router" -import { getFilename } from "@opencode-ai/util/path" +import { getFilename } from "@opencode-ai/shared/util/path" import { useSDK } from "./sdk" import { useSync } from "./sync" import { useLanguage } from "@/context/language" diff --git a/packages/app/src/context/global-sdk.tsx b/packages/app/src/context/global-sdk.tsx index 1205a8fa8..e53d60d5a 100644 --- a/packages/app/src/context/global-sdk.tsx +++ b/packages/app/src/context/global-sdk.tsx @@ -128,6 +128,7 @@ export const { use: useGlobalSDK, provider: GlobalSDKProvider } = createSimpleCo if (started) return run started = true run = (async () => { + // oxlint-disable-next-line no-unmodified-loop-condition -- `started` is set to false by stop() which also aborts; both flags are checked to allow graceful exit while (!abort.signal.aborted && started) { attempt = new AbortController() lastEventAt = Date.now() @@ -155,7 +156,12 @@ export const { use: useGlobalSDK, provider: GlobalSDKProvider } = createSimpleCo resetHeartbeat() streamErrorLogged = false const directory = event.directory ?? "global" - const payload = event.payload + if (event.payload.type === "sync") { + continue + } + + const payload = event.payload as Event + const k = key(directory, payload) if (k) { const i = coalesced.get(k) diff --git a/packages/app/src/context/global-sync.tsx b/packages/app/src/context/global-sync.tsx index 0cf3570a8..6ff60f161 100644 --- a/packages/app/src/context/global-sync.tsx +++ b/packages/app/src/context/global-sync.tsx @@ -8,7 +8,7 @@ import type { Todo, } from "@opencode-ai/sdk/v2/client" import { showToast } from "@opencode-ai/ui/toast" -import { getFilename } from "@opencode-ai/util/path" +import { getFilename } from "@opencode-ai/shared/util/path" import { createContext, getOwner, onCleanup, onMount, type ParentProps, untrack, useContext } from "solid-js" import { createStore, produce, reconcile } from "solid-js/store" import { useLanguage } from "@/context/language" @@ -26,6 +26,7 @@ import type { ProjectMeta } from "./global-sync/types" import { SESSION_RECENT_LIMIT } from "./global-sync/types" import { sanitizeProject } from "./global-sync/utils" import { formatServerError } from "@/utils/server-errors" +import { queryOptions, skipToken, useQueryClient } from "@tanstack/solid-query" type GlobalStore = { ready: boolean @@ -41,6 +42,9 @@ type GlobalStore = { reload: undefined | "pending" | "complete" } +export const loadSessionsQuery = (directory: string) => + queryOptions<null>({ queryKey: [directory, "loadSessions"], queryFn: skipToken }) + function createGlobalSync() { const globalSDK = useGlobalSDK() const language = useLanguage() @@ -67,6 +71,7 @@ function createGlobalSync() { config: {}, reload: undefined, }) + const queryClient = useQueryClient() let active = true let projectWritten = false @@ -198,46 +203,53 @@ function createGlobalSync() { } const limit = Math.max(store.limit + SESSION_RECENT_LIMIT, SESSION_RECENT_LIMIT) - const promise = loadRootSessionsWithFallback({ - directory, - limit, - list: (query) => globalSDK.client.session.list(query), - }) - .then((x) => { - const nonArchived = (x.data ?? []) - .filter((s) => !!s?.id) - .filter((s) => !s.time?.archived) - .sort((a, b) => (a.id < b.id ? -1 : a.id > b.id ? 1 : 0)) - const limit = store.limit - const childSessions = store.session.filter((s) => !!s.parentID) - const sessions = trimSessions([...nonArchived, ...childSessions], { - limit, - permission: store.permission, - }) - setStore( - "sessionTotal", - estimateRootSessionTotal({ - count: nonArchived.length, - limit: x.limit, - limited: x.limited, - }), - ) - setStore("session", reconcile(sessions, { key: "id" })) - cleanupDroppedSessionCaches(store, setStore, sessions, setSessionTodo) - sessionMeta.set(directory, { limit }) - }) - .catch((err) => { - console.error("Failed to load sessions", err) - const project = getFilename(directory) - showToast({ - variant: "error", - title: language.t("toast.session.listFailed.title", { project }), - description: formatServerError(err, language.t), - }) + const promise = queryClient + .ensureQueryData({ + ...loadSessionsQuery(directory), + queryFn: () => + loadRootSessionsWithFallback({ + directory, + limit, + list: (query) => globalSDK.client.session.list(query), + }) + .then((x) => { + const nonArchived = (x.data ?? []) + .filter((s) => !!s?.id) + .filter((s) => !s.time?.archived) + .sort((a, b) => (a.id < b.id ? -1 : a.id > b.id ? 1 : 0)) + const limit = store.limit + const childSessions = store.session.filter((s) => !!s.parentID) + const sessions = trimSessions([...nonArchived, ...childSessions], { + limit, + permission: store.permission, + }) + setStore( + "sessionTotal", + estimateRootSessionTotal({ + count: nonArchived.length, + limit: x.limit, + limited: x.limited, + }), + ) + setStore("session", reconcile(sessions, { key: "id" })) + cleanupDroppedSessionCaches(store, setStore, sessions, setSessionTodo) + sessionMeta.set(directory, { limit }) + }) + .catch((err) => { + console.error("Failed to load sessions", err) + const project = getFilename(directory) + showToast({ + variant: "error", + title: language.t("toast.session.listFailed.title", { project }), + description: formatServerError(err, language.t), + }) + }) + .then(() => null), }) + .then(() => {}) sessionLoads.set(directory, promise) - promise.finally(() => { + void promise.finally(() => { sessionLoads.delete(directory) children.unpin(directory) }) @@ -250,8 +262,9 @@ function createGlobalSync() { if (pending) return pending children.pin(directory) - const promise = (async () => { + const promise = Promise.resolve().then(async () => { const child = children.ensureChild(directory) + child[1]("bootstrapPromise", promise!) const cache = children.vcsCache.get(directory) if (!cache) return const sdk = sdkFor(directory) @@ -269,11 +282,12 @@ function createGlobalSync() { vcsCache: cache, loadSessions, translate: language.t, + queryClient, }) - })() + }) booting.set(directory, promise) - promise.finally(() => { + void promise.finally(() => { booting.delete(directory) children.unpin(directory) }) @@ -317,7 +331,7 @@ function createGlobalSync() { setSessionTodo, vcsCache: children.vcsCache.get(directory), loadLsp: () => { - sdkFor(directory) + void sdkFor(directory) .lsp.status() .then((x) => { setStore("lsp", x.data ?? []) @@ -346,6 +360,7 @@ function createGlobalSync() { translate: language.t, formatMoreCount: (count) => language.t("common.moreCountSuffix", { count }), setGlobalStore: setBootStore, + queryClient, }) bootedAt = Date.now() } finally { @@ -359,13 +374,13 @@ function createGlobalSync() { eventFrame = undefined eventTimer = setTimeout(() => { eventTimer = undefined - globalSDK.event.start() + void globalSDK.event.start() }, 0) }) } else { eventTimer = setTimeout(() => { eventTimer = undefined - globalSDK.event.start() + void globalSDK.event.start() }, 0) } void bootstrap() diff --git a/packages/app/src/context/global-sync/bootstrap.ts b/packages/app/src/context/global-sync/bootstrap.ts index 7edd5a1ce..17fe726f9 100644 --- a/packages/app/src/context/global-sync/bootstrap.ts +++ b/packages/app/src/context/global-sync/bootstrap.ts @@ -11,13 +11,15 @@ import type { Todo, } from "@opencode-ai/sdk/v2/client" import { showToast } from "@opencode-ai/ui/toast" -import { getFilename } from "@opencode-ai/util/path" -import { retry } from "@opencode-ai/util/retry" +import { getFilename } from "@opencode-ai/shared/util/path" +import { retry } from "@opencode-ai/shared/util/retry" import { batch } from "solid-js" import { reconcile, type SetStoreFunction, type Store } from "solid-js/store" import type { State, VcsCache } from "./types" import { cmp, normalizeAgentList, normalizeProviderList } from "./utils" import { formatServerError } from "@/utils/server-errors" +import { QueryClient, queryOptions, skipToken } from "@tanstack/solid-query" +import { loadSessionsQuery } from "../global-sync" type GlobalStore = { ready: boolean @@ -65,28 +67,13 @@ function runAll(list: Array<() => Promise<unknown>>) { return Promise.allSettled(list.map((item) => item())) } -function showErrors(input: { - errors: unknown[] - title: string - translate: (key: string, vars?: Record<string, string | number>) => string - formatMoreCount: (count: number) => string -}) { - if (input.errors.length === 0) return - const message = formatServerError(input.errors[0], input.translate) - const more = input.errors.length > 1 ? input.formatMoreCount(input.errors.length - 1) : "" - showToast({ - variant: "error", - title: input.title, - description: message + more, - }) -} - export async function bootstrapGlobal(input: { globalSDK: OpencodeClient requestFailedTitle: string translate: (key: string, vars?: Record<string, string | number>) => string formatMoreCount: (count: number) => string setGlobalStore: SetStoreFunction<GlobalStore> + queryClient: QueryClient }) { const fast = [ () => @@ -96,11 +83,16 @@ export async function bootstrapGlobal(input: { }), ), () => - retry(() => - input.globalSDK.provider.list().then((x) => { - input.setGlobalStore("provider", normalizeProviderList(x.data!)) - }), - ), + input.queryClient.fetchQuery({ + ...loadProvidersQuery(null), + queryFn: () => + retry(() => + input.globalSDK.provider.list().then((x) => { + input.setGlobalStore("provider", normalizeProviderList(x.data!)) + return null + }), + ), + }), ] const slow = [ @@ -122,20 +114,21 @@ export async function bootstrapGlobal(input: { }), ), ] - - showErrors({ - errors: errors(await runAll(fast)), - title: input.requestFailedTitle, - translate: input.translate, - formatMoreCount: input.formatMoreCount, - }) + await runAll(fast) + // showErrors({ + // errors: errors(await runAll(fast)), + // title: input.requestFailedTitle, + // translate: input.translate, + // formatMoreCount: input.formatMoreCount, + // }) await waitForPaint() - showErrors({ - errors: errors(await runAll(slow)), - title: input.requestFailedTitle, - translate: input.translate, - formatMoreCount: input.formatMoreCount, - }) + await runAll(slow) + // showErrors({ + // errors: errors(), + // title: input.requestFailedTitle, + // translate: input.translate, + // formatMoreCount: input.formatMoreCount, + // }) input.setGlobalStore("ready", true) } @@ -187,6 +180,12 @@ function warmSessions(input: { ).then(() => undefined) } +export const loadProvidersQuery = (directory: string | null) => + queryOptions<null>({ queryKey: [directory, "providers"], queryFn: skipToken }) + +export const loadAgentsQuery = (directory: string | null) => + queryOptions<null>({ queryKey: [directory, "agents"], queryFn: skipToken }) + export async function bootstrapDirectory(input: { directory: string sdk: OpencodeClient @@ -201,6 +200,7 @@ export async function bootstrapDirectory(input: { project: Project[] provider: ProviderListResponse } + queryClient: QueryClient }) { const loading = input.store.status !== "complete" const seededProject = projectID(input.directory, input.global.project) @@ -222,97 +222,7 @@ export async function bootstrapDirectory(input: { input.setStore("lsp", []) if (loading) input.setStore("status", "partial") - const fast = [ - () => retry(() => input.sdk.app.agents().then((x) => input.setStore("agent", normalizeAgentList(x.data)))), - () => retry(() => input.sdk.config.get().then((x) => input.setStore("config", x.data!))), - () => retry(() => input.sdk.session.status().then((x) => input.setStore("session_status", x.data!))), - ] - - const slow = [ - () => - seededProject - ? Promise.resolve() - : retry(() => input.sdk.project.current()).then((x) => input.setStore("project", x.data!.id)), - () => - seededPath - ? Promise.resolve() - : retry(() => - input.sdk.path.get().then((x) => { - input.setStore("path", x.data!) - const next = projectID(x.data?.directory ?? input.directory, input.global.project) - if (next) input.setStore("project", next) - }), - ), - () => - retry(() => - input.sdk.vcs.get().then((x) => { - const next = x.data ?? input.store.vcs - input.setStore("vcs", next) - if (next) input.vcsCache.setStore("value", next) - }), - ), - () => retry(() => input.sdk.command.list().then((x) => input.setStore("command", x.data ?? []))), - () => - retry(() => - input.sdk.permission.list().then((x) => { - const ids = (x.data ?? []).map((perm) => perm?.sessionID).filter((id): id is string => !!id) - const grouped = groupBySession( - (x.data ?? []).filter((perm): perm is PermissionRequest => !!perm?.id && !!perm.sessionID), - ) - return warmSessions({ ids, store: input.store, setStore: input.setStore, sdk: input.sdk }).then(() => - batch(() => { - for (const sessionID of Object.keys(input.store.permission)) { - if (grouped[sessionID]) continue - input.setStore("permission", sessionID, []) - } - for (const [sessionID, permissions] of Object.entries(grouped)) { - input.setStore( - "permission", - sessionID, - reconcile( - permissions.filter((p) => !!p?.id).sort((a, b) => cmp(a.id, b.id)), - { key: "id" }, - ), - ) - } - }), - ) - }), - ), - () => - retry(() => - input.sdk.question.list().then((x) => { - const ids = (x.data ?? []).map((question) => question?.sessionID).filter((id): id is string => !!id) - const grouped = groupBySession((x.data ?? []).filter((q): q is QuestionRequest => !!q?.id && !!q.sessionID)) - return warmSessions({ ids, store: input.store, setStore: input.setStore, sdk: input.sdk }).then(() => - batch(() => { - for (const sessionID of Object.keys(input.store.question)) { - if (grouped[sessionID]) continue - input.setStore("question", sessionID, []) - } - for (const [sessionID, questions] of Object.entries(grouped)) { - input.setStore( - "question", - sessionID, - reconcile( - questions.filter((q) => !!q?.id).sort((a, b) => cmp(a.id, b.id)), - { key: "id" }, - ), - ) - } - }), - ) - }), - ), - () => Promise.resolve(input.loadSessions(input.directory)), - () => - retry(() => - input.sdk.mcp.status().then((x) => { - input.setStore("mcp", x.data!) - input.setStore("mcp_ready", true) - }), - ), - ] + const fast = [() => Promise.resolve(input.loadSessions(input.directory))] const errs = errors(await runAll(fast)) if (errs.length > 0) { @@ -325,36 +235,138 @@ export async function bootstrapDirectory(input: { }) } - await waitForPaint() - const slowErrs = errors(await runAll(slow)) - if (slowErrs.length > 0) { - console.error("Failed to finish bootstrap instance", slowErrs[0]) - const project = getFilename(input.directory) - showToast({ - variant: "error", - title: input.translate("toast.project.reloadFailed.title", { project }), - description: formatServerError(slowErrs[0], input.translate), - }) - } - - if (loading && errs.length === 0 && slowErrs.length === 0) input.setStore("status", "complete") + ;(async () => { + const slow = [ + () => + input.queryClient.ensureQueryData({ + ...loadAgentsQuery(input.directory), + queryFn: () => + retry(() => input.sdk.app.agents().then((x) => input.setStore("agent", normalizeAgentList(x.data)))).then( + () => null, + ), + }), + () => retry(() => input.sdk.config.get().then((x) => input.setStore("config", x.data!))), + () => retry(() => input.sdk.session.status().then((x) => input.setStore("session_status", x.data!))), + () => + seededProject + ? Promise.resolve() + : retry(() => input.sdk.project.current()).then((x) => input.setStore("project", x.data!.id)), + () => + seededPath + ? Promise.resolve() + : retry(() => + input.sdk.path.get().then((x) => { + input.setStore("path", x.data!) + const next = projectID(x.data?.directory ?? input.directory, input.global.project) + if (next) input.setStore("project", next) + }), + ), + () => + retry(() => + input.sdk.vcs.get().then((x) => { + const next = x.data ?? input.store.vcs + input.setStore("vcs", next) + if (next) input.vcsCache.setStore("value", next) + }), + ), + () => retry(() => input.sdk.command.list().then((x) => input.setStore("command", x.data ?? []))), + () => + retry(() => + input.sdk.permission.list().then((x) => { + const ids = (x.data ?? []).map((perm) => perm?.sessionID).filter((id): id is string => !!id) + const grouped = groupBySession( + (x.data ?? []).filter((perm): perm is PermissionRequest => !!perm?.id && !!perm.sessionID), + ) + return warmSessions({ ids, store: input.store, setStore: input.setStore, sdk: input.sdk }).then(() => + batch(() => { + for (const sessionID of Object.keys(input.store.permission)) { + if (grouped[sessionID]) continue + input.setStore("permission", sessionID, []) + } + for (const [sessionID, permissions] of Object.entries(grouped)) { + input.setStore( + "permission", + sessionID, + reconcile( + permissions.filter((p) => !!p?.id).sort((a, b) => cmp(a.id, b.id)), + { key: "id" }, + ), + ) + } + }), + ) + }), + ), + () => + retry(() => + input.sdk.question.list().then((x) => { + const ids = (x.data ?? []).map((question) => question?.sessionID).filter((id): id is string => !!id) + const grouped = groupBySession((x.data ?? []).filter((q): q is QuestionRequest => !!q?.id && !!q.sessionID)) + return warmSessions({ ids, store: input.store, setStore: input.setStore, sdk: input.sdk }).then(() => + batch(() => { + for (const sessionID of Object.keys(input.store.question)) { + if (grouped[sessionID]) continue + input.setStore("question", sessionID, []) + } + for (const [sessionID, questions] of Object.entries(grouped)) { + input.setStore( + "question", + sessionID, + reconcile( + questions.filter((q) => !!q?.id).sort((a, b) => cmp(a.id, b.id)), + { key: "id" }, + ), + ) + } + }), + ) + }), + ), + () => Promise.resolve(input.loadSessions(input.directory)), + () => + retry(() => + input.sdk.mcp.status().then((x) => { + input.setStore("mcp", x.data!) + input.setStore("mcp_ready", true) + }), + ), + ] - const rev = (providerRev.get(input.directory) ?? 0) + 1 - providerRev.set(input.directory, rev) - void retry(() => input.sdk.provider.list()) - .then((x) => { - if (providerRev.get(input.directory) !== rev) return - input.setStore("provider", normalizeProviderList(x.data!)) - input.setStore("provider_ready", true) - }) - .catch((err) => { - if (providerRev.get(input.directory) !== rev) return - console.error("Failed to refresh provider list", err) + await waitForPaint() + const slowErrs = errors(await runAll(slow)) + if (slowErrs.length > 0) { + console.error("Failed to finish bootstrap instance", slowErrs[0]) const project = getFilename(input.directory) showToast({ variant: "error", title: input.translate("toast.project.reloadFailed.title", { project }), - description: formatServerError(err, input.translate), + description: formatServerError(slowErrs[0], input.translate), }) + } + + if (loading && errs.length === 0 && slowErrs.length === 0) input.setStore("status", "complete") + + const rev = (providerRev.get(input.directory) ?? 0) + 1 + providerRev.set(input.directory, rev) + void input.queryClient.ensureQueryData({ + ...loadSessionsQuery(input.directory), + queryFn: () => + retry(() => input.sdk.provider.list()) + .then((x) => { + if (providerRev.get(input.directory) !== rev) return + input.setStore("provider", normalizeProviderList(x.data!)) + input.setStore("provider_ready", true) + }) + .catch((err) => { + if (providerRev.get(input.directory) !== rev) console.error("Failed to refresh provider list", err) + const project = getFilename(input.directory) + showToast({ + variant: "error", + title: input.translate("toast.project.reloadFailed.title", { project }), + description: formatServerError(err, input.translate), + }) + }) + .then(() => null), }) + })() } diff --git a/packages/app/src/context/global-sync/child-store.ts b/packages/app/src/context/global-sync/child-store.ts index 5678491f8..6788e8cc5 100644 --- a/packages/app/src/context/global-sync/child-store.ts +++ b/packages/app/src/context/global-sync/child-store.ts @@ -182,6 +182,7 @@ export function createChildStoreManager(input: { limit: 5, message: {}, part: {}, + bootstrapPromise: Promise.resolve(), }) children[directory] = child disposers.set(directory, dispose) @@ -243,8 +244,8 @@ export function createChildStoreManager(input: { const cached = metaCache.get(directory) if (!cached) return const previous = store.projectMeta ?? {} - const icon = patch.icon ? { ...(previous.icon ?? {}), ...patch.icon } : previous.icon - const commands = patch.commands ? { ...(previous.commands ?? {}), ...patch.commands } : previous.commands + const icon = patch.icon ? { ...previous.icon, ...patch.icon } : previous.icon + const commands = patch.commands ? { ...previous.commands, ...patch.commands } : previous.commands const next = { ...previous, ...patch, diff --git a/packages/app/src/context/global-sync/event-reducer.ts b/packages/app/src/context/global-sync/event-reducer.ts index 500013c1d..11a0cf83f 100644 --- a/packages/app/src/context/global-sync/event-reducer.ts +++ b/packages/app/src/context/global-sync/event-reducer.ts @@ -1,4 +1,4 @@ -import { Binary } from "@opencode-ai/util/binary" +import { Binary } from "@opencode-ai/shared/util/binary" import { produce, reconcile, type SetStoreFunction, type Store } from "solid-js/store" import type { Message, diff --git a/packages/app/src/context/global-sync/queue.ts b/packages/app/src/context/global-sync/queue.ts index c3468583b..5c228dac0 100644 --- a/packages/app/src/context/global-sync/queue.ts +++ b/packages/app/src/context/global-sync/queue.ts @@ -63,6 +63,7 @@ export function createRefreshQueue(input: QueueInput) { } } finally { running = false + // oxlint-disable-next-line no-unsafe-finally -- intentional: early return skips schedule() when paused if (input.paused()) return if (root || queued.size) schedule() } diff --git a/packages/app/src/context/global-sync/types.ts b/packages/app/src/context/global-sync/types.ts index b0f340a90..28b3705d1 100644 --- a/packages/app/src/context/global-sync/types.ts +++ b/packages/app/src/context/global-sync/types.ts @@ -8,7 +8,6 @@ import type { Part, Path, PermissionRequest, - Project, ProviderListResponse, QuestionRequest, Session, @@ -73,6 +72,7 @@ export type State = { part: { [messageID: string]: Part[] } + bootstrapPromise: Promise<void> } export type VcsCache = { diff --git a/packages/app/src/context/layout.tsx b/packages/app/src/context/layout.tsx index bab3d39f3..74ea28531 100644 --- a/packages/app/src/context/layout.tsx +++ b/packages/app/src/context/layout.tsx @@ -344,7 +344,7 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext( return } - setStore("sessionView", sessionKey, "scroll", (prev) => ({ ...(prev ?? {}), ...next })) + setStore("sessionView", sessionKey, "scroll", (prev) => ({ ...prev, ...next })) prune(keep) }, }) @@ -399,7 +399,7 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext( local?.icon?.color !== undefined const base = { - ...(metadata ?? {}), + ...metadata, ...project, icon: { url: metadata?.icon?.url, @@ -582,7 +582,7 @@ export const { use: useLayout, provider: LayoutProvider } = createSimpleContext( open(directory: string) { const root = rootFor(directory) if (server.projects.list().find((x) => x.worktree === root)) return - globalSync.project.loadSessions(root) + void globalSync.project.loadSessions(root) server.projects.open(root) }, close(directory: string) { diff --git a/packages/app/src/context/local.tsx b/packages/app/src/context/local.tsx index 1633607de..0b0972ee6 100644 --- a/packages/app/src/context/local.tsx +++ b/packages/app/src/context/local.tsx @@ -1,11 +1,10 @@ import { createSimpleContext } from "@opencode-ai/ui/context" -import { base64Encode } from "@opencode-ai/util/encode" +import { base64Encode } from "@opencode-ai/shared/util/encode" import { useParams } from "@solidjs/router" -import { batch, createEffect, createMemo, onCleanup } from "solid-js" +import { batch, createEffect, createMemo } from "solid-js" import { createStore } from "solid-js/store" import { useModels } from "@/context/models" import { useProviders } from "@/hooks/use-providers" -import { modelEnabled, modelProbe } from "@/testing/model-selection" import { Persist, persisted } from "@/utils/persist" import { cycleModelVariant, getConfiguredAgentVariant, resolveModelVariant } from "./model-variant" import { useSDK } from "./sdk" @@ -388,53 +387,6 @@ export const { use: useLocal, provider: LocalProvider } = createSimpleContext({ }, }, } - - if (modelEnabled()) { - const probe = Symbol("model-probe") - - modelProbe.bind(probe, { - setAgent: agent.set, - setModel: model.set, - setVariant: model.variant.set, - }) - - createEffect(() => { - const agent = result.agent.current() - const model = result.model.current() - modelProbe.set(probe, { - dir: sdk.directory, - sessionID: id(), - last: store.last, - agent: agent?.name, - model: model - ? { - providerID: model.provider.id, - modelID: model.id, - name: model.name, - } - : undefined, - variant: result.model.variant.current() ?? null, - selected: result.model.variant.selected(), - configured: result.model.variant.configured(), - pick: scope(), - base: undefined, - current: store.current, - variants: result.model.variant.list(), - models: result.model - .list() - .filter((item) => result.model.visible({ providerID: item.provider.id, modelID: item.id })) - .map((item) => ({ - providerID: item.provider.id, - modelID: item.id, - name: item.name, - })), - agents: result.agent.list().map((item) => ({ name: item.name })), - }) - }) - - onCleanup(() => modelProbe.clear(probe)) - } - return result }, }) diff --git a/packages/app/src/context/notification.tsx b/packages/app/src/context/notification.tsx index 281a1ef33..251b67b06 100644 --- a/packages/app/src/context/notification.tsx +++ b/packages/app/src/context/notification.tsx @@ -7,8 +7,8 @@ import { useGlobalSync } from "./global-sync" import { usePlatform } from "@/context/platform" import { useLanguage } from "@/context/language" import { useSettings } from "@/context/settings" -import { Binary } from "@opencode-ai/util/binary" -import { base64Encode } from "@opencode-ai/util/encode" +import { Binary } from "@opencode-ai/shared/util/binary" +import { base64Encode } from "@opencode-ai/shared/util/encode" import { decode64 } from "@/utils/base64" import { EventSessionError } from "@opencode-ai/sdk/v2" import { Persist, persisted } from "@/utils/persist" diff --git a/packages/app/src/context/permission-auto-respond.test.ts b/packages/app/src/context/permission-auto-respond.test.ts index 755611300..2f8ca6265 100644 --- a/packages/app/src/context/permission-auto-respond.test.ts +++ b/packages/app/src/context/permission-auto-respond.test.ts @@ -1,6 +1,6 @@ import { describe, expect, test } from "bun:test" import type { PermissionRequest, Session } from "@opencode-ai/sdk/v2/client" -import { base64Encode } from "@opencode-ai/util/encode" +import { base64Encode } from "@opencode-ai/shared/util/encode" import { autoRespondsPermission, isDirectoryAutoAccepting } from "./permission-auto-respond" const session = (input: { id: string; parentID?: string }) => diff --git a/packages/app/src/context/permission-auto-respond.ts b/packages/app/src/context/permission-auto-respond.ts index b206deedf..2ebca3434 100644 --- a/packages/app/src/context/permission-auto-respond.ts +++ b/packages/app/src/context/permission-auto-respond.ts @@ -1,4 +1,4 @@ -import { base64Encode } from "@opencode-ai/util/encode" +import { base64Encode } from "@opencode-ai/shared/util/encode" export function acceptKey(sessionID: string, directory?: string) { if (!directory) return sessionID diff --git a/packages/app/src/context/prompt.tsx b/packages/app/src/context/prompt.tsx index 831fdbca8..9b666e5e7 100644 --- a/packages/app/src/context/prompt.tsx +++ b/packages/app/src/context/prompt.tsx @@ -1,5 +1,5 @@ import { createSimpleContext } from "@opencode-ai/ui/context" -import { checksum } from "@opencode-ai/util/encode" +import { checksum } from "@opencode-ai/shared/util/encode" import { useParams } from "@solidjs/router" import { batch, createMemo, createRoot, getOwner, onCleanup } from "solid-js" import { createStore, type SetStoreFunction } from "solid-js/store" diff --git a/packages/app/src/context/sync.tsx b/packages/app/src/context/sync.tsx index fb02a2d2d..29b7fe68c 100644 --- a/packages/app/src/context/sync.tsx +++ b/packages/app/src/context/sync.tsx @@ -1,7 +1,7 @@ import { batch, createMemo } from "solid-js" import { createStore, produce, reconcile } from "solid-js/store" -import { Binary } from "@opencode-ai/util/binary" -import { retry } from "@opencode-ai/util/retry" +import { Binary } from "@opencode-ai/shared/util/binary" +import { retry } from "@opencode-ai/shared/util/retry" import { createSimpleContext } from "@opencode-ai/ui/context" import { clearSessionPrefetch, diff --git a/packages/app/src/context/terminal.tsx b/packages/app/src/context/terminal.tsx index 17355aab9..31d2d6e04 100644 --- a/packages/app/src/context/terminal.tsx +++ b/packages/app/src/context/terminal.tsx @@ -117,7 +117,7 @@ export function clearWorkspaceTerminals(dir: string, sessionIDs?: string[], plat entry?.value.clear() } - removePersisted(Persist.workspace(dir, "terminal"), platform) + void removePersisted(Persist.workspace(dir, "terminal"), platform) const legacy = new Set(getLegacyTerminalStorageKeys(dir)) for (const id of sessionIDs ?? []) { @@ -126,7 +126,7 @@ export function clearWorkspaceTerminals(dir: string, sessionIDs?: string[], plat } } for (const key of legacy) { - removePersisted({ key }, platform) + void removePersisted({ key }, platform) } } diff --git a/packages/app/src/env.d.ts b/packages/app/src/env.d.ts index 89721f34f..22e52f991 100644 --- a/packages/app/src/env.d.ts +++ b/packages/app/src/env.d.ts @@ -3,6 +3,7 @@ import "solid-js" interface ImportMetaEnv { readonly VITE_OPENCODE_SERVER_HOST: string readonly VITE_OPENCODE_SERVER_PORT: string + readonly OPENCODE_CHANNEL?: "dev" | "beta" | "prod" } interface ImportMeta { diff --git a/packages/app/src/i18n/ko.ts b/packages/app/src/i18n/ko.ts index 0f2f7647a..2b5ccd43d 100644 --- a/packages/app/src/i18n/ko.ts +++ b/packages/app/src/i18n/ko.ts @@ -1,7 +1,3 @@ -import { dict as en } from "./en" - -type Keys = keyof typeof en - export const dict = { "command.category.suggested": "추천", "command.category.view": "보기", diff --git a/packages/app/src/pages/directory-layout.tsx b/packages/app/src/pages/directory-layout.tsx index 427b4823b..f604dd6c5 100644 --- a/packages/app/src/pages/directory-layout.tsx +++ b/packages/app/src/pages/directory-layout.tsx @@ -1,6 +1,6 @@ import { DataProvider } from "@opencode-ai/ui/context" import { showToast } from "@opencode-ai/ui/toast" -import { base64Encode } from "@opencode-ai/util/encode" +import { base64Encode } from "@opencode-ai/shared/util/encode" import { useLocation, useNavigate, useParams } from "@solidjs/router" import { createEffect, createMemo, type ParentProps, Show } from "solid-js" import { useLanguage } from "@/context/language" diff --git a/packages/app/src/pages/error.tsx b/packages/app/src/pages/error.tsx index 1cdc06116..11284b3d2 100644 --- a/packages/app/src/pages/error.tsx +++ b/packages/app/src/pages/error.tsx @@ -1,12 +1,11 @@ import { TextField } from "@opencode-ai/ui/text-field" import { Logo } from "@opencode-ai/ui/logo" import { Button } from "@opencode-ai/ui/button" -import { Component, Show, onMount } from "solid-js" +import { Component, Show } from "solid-js" import { createStore } from "solid-js/store" import { usePlatform } from "@/context/platform" import { useLanguage } from "@/context/language" import { Icon } from "@opencode-ai/ui/icon" -import type { E2EWindow } from "@/testing/terminal" export type InitError = { name: string @@ -227,13 +226,6 @@ export const ErrorPage: Component<ErrorPageProps> = (props) => { actionError: undefined as string | undefined, }) - onMount(() => { - const win = window as E2EWindow - if (!win.__opencode_e2e) return - const detail = formatError(props.error, language.t) - console.error(`[e2e:error-boundary] ${window.location.pathname}\n${detail}`) - }) - async function checkForUpdates() { if (!platform.checkUpdate) return setStore("checking", true) diff --git a/packages/app/src/pages/home.tsx b/packages/app/src/pages/home.tsx index 4c795b968..46cacdf62 100644 --- a/packages/app/src/pages/home.tsx +++ b/packages/app/src/pages/home.tsx @@ -3,7 +3,7 @@ import { Button } from "@opencode-ai/ui/button" import { Logo } from "@opencode-ai/ui/logo" import { useLayout } from "@/context/layout" import { useNavigate } from "@solidjs/router" -import { base64Encode } from "@opencode-ai/util/encode" +import { base64Encode } from "@opencode-ai/shared/util/encode" import { Icon } from "@opencode-ai/ui/icon" import { usePlatform } from "@/context/platform" import { DateTime } from "luxon" diff --git a/packages/app/src/pages/layout.tsx b/packages/app/src/pages/layout.tsx index f402f4bc0..12a2bf763 100644 --- a/packages/app/src/pages/layout.tsx +++ b/packages/app/src/pages/layout.tsx @@ -17,7 +17,7 @@ import { useNavigate, useParams } from "@solidjs/router" import { useLayout, LocalProject } from "@/context/layout" import { useGlobalSync } from "@/context/global-sync" import { Persist, persisted } from "@/utils/persist" -import { base64Encode } from "@opencode-ai/util/encode" +import { base64Encode } from "@opencode-ai/shared/util/encode" import { decode64 } from "@/utils/base64" import { ResizeHandle } from "@opencode-ai/ui/resize-handle" import { Button } from "@opencode-ai/ui/button" @@ -25,7 +25,7 @@ import { IconButton } from "@opencode-ai/ui/icon-button" import { Tooltip } from "@opencode-ai/ui/tooltip" import { DropdownMenu } from "@opencode-ai/ui/dropdown-menu" import { Dialog } from "@opencode-ai/ui/dialog" -import { getFilename } from "@opencode-ai/util/path" +import { getFilename } from "@opencode-ai/shared/util/path" import { Session, type Message } from "@opencode-ai/sdk/v2/client" import { usePlatform } from "@/context/platform" import { useSettings } from "@/context/settings" @@ -48,8 +48,8 @@ import { } from "@/context/global-sync/session-prefetch" import { useNotification } from "@/context/notification" import { usePermission } from "@/context/permission" -import { Binary } from "@opencode-ai/util/binary" -import { retry } from "@opencode-ai/util/retry" +import { Binary } from "@opencode-ai/shared/util/binary" +import { retry } from "@opencode-ai/shared/util/retry" import { playSoundById } from "@/utils/sound" import { createAim } from "@/utils/aim" import { setNavigate } from "@/utils/notification-click" @@ -132,9 +132,11 @@ export default function Layout(props: ParentProps) { if (!slug) return { slug, dir: "" } const dir = decode64(slug) if (!dir) return { slug, dir: "" } + const store = globalSync.peek(dir, { bootstrap: false }) return { slug, - dir: globalSync.peek(dir, { bootstrap: false })[0].path.directory || dir, + store, + dir: store[0].path.directory || dir, } }) const availableThemeEntries = createMemo(() => theme.ids().map((id) => [id, theme.themes()[id]] as const)) @@ -704,7 +706,7 @@ export default function Layout(props: ParentProps) { createEffect(() => { const active = new Set(visibleSessionDirs()) - for (const directory of [...prefetchedByDir.keys()]) { + for (const directory of prefetchedByDir.keys()) { if (active.has(directory)) continue prefetchedByDir.delete(directory) } @@ -956,7 +958,7 @@ export default function Layout(props: ParentProps) { // warm up child store to prevent flicker globalSync.child(target.worktree) - openProject(target.worktree) + void openProject(target.worktree) } function navigateSessionByUnseen(offset: number) { @@ -1094,7 +1096,7 @@ export default function Layout(props: ParentProps) { disabled: !params.dir || !params.id, onSelect: () => { const session = currentSessions().find((s) => s.id === params.id) - if (session) archiveSession(session) + if (session) void archiveSession(session) }, }, { @@ -1360,11 +1362,11 @@ export default function Layout(props: ParentProps) { if (!server.isLocal()) return for (const directory of collectOpenProjectDeepLinks(urls)) { - openProject(directory) + void openProject(directory) } for (const link of collectNewSessionDeepLinks(urls)) { - openProject(link.directory, false) + void openProject(link.directory, false) const slug = base64Encode(link.directory) if (link.prompt) { setSessionHandoff(slug, { prompt: link.prompt }) @@ -1453,11 +1455,11 @@ export default function Layout(props: ParentProps) { function resolve(result: string | string[] | null) { if (Array.isArray(result)) { for (const directory of result) { - openProject(directory, false) + void openProject(directory, false) } - navigateToProject(result[0]) + void navigateToProject(result[0]) } else if (result) { - openProject(result) + void openProject(result) } } @@ -1825,7 +1827,7 @@ export default function Layout(props: ParentProps) { const next = new Set(dirs) for (const directory of next) { if (loadedSessionDirs.has(directory)) continue - globalSync.project.loadSessions(directory) + void globalSync.project.loadSessions(directory) } loadedSessionDirs.clear() @@ -2110,7 +2112,7 @@ export default function Layout(props: ParentProps) { onSave={(next) => { const item = project() if (!item) return - renameProject(item, next) + void renameProject(item, next) }} class="text-14-medium text-text-strong truncate" displayClass="text-14-medium text-text-strong truncate" @@ -2242,7 +2244,7 @@ export default function Layout(props: ParentProps) { onClick={() => { const item = project() if (!item) return - createWorkspace(item) + void createWorkspace(item) }} > {language.t("workspace.new")} @@ -2353,8 +2355,14 @@ export default function Layout(props: ParentProps) { /> ) + const [loading] = createResource( + () => route()?.store?.[0]?.bootstrapPromise, + (p) => p, + ) + return ( <div class="relative bg-background-base flex-1 min-h-0 min-w-0 flex flex-col select-none [&_input]:select-text [&_textarea]:select-text [&_[contenteditable]]:select-text"> + {(autoselecting(), loading()) ?? ""} <Titlebar /> <div class="flex-1 min-h-0 min-w-0 flex"> <div class="flex-1 min-h-0 relative"> diff --git a/packages/app/src/pages/layout/helpers.ts b/packages/app/src/pages/layout/helpers.ts index 48158debb..26b66d166 100644 --- a/packages/app/src/pages/layout/helpers.ts +++ b/packages/app/src/pages/layout/helpers.ts @@ -1,4 +1,4 @@ -import { getFilename } from "@opencode-ai/util/path" +import { getFilename } from "@opencode-ai/shared/util/path" import { type Session } from "@opencode-ai/sdk/v2/client" type SessionStore = { diff --git a/packages/app/src/pages/layout/sidebar-items.tsx b/packages/app/src/pages/layout/sidebar-items.tsx index e56accfc8..b0f45859a 100644 --- a/packages/app/src/pages/layout/sidebar-items.tsx +++ b/packages/app/src/pages/layout/sidebar-items.tsx @@ -4,7 +4,7 @@ import { Icon } from "@opencode-ai/ui/icon" import { IconButton } from "@opencode-ai/ui/icon-button" import { Spinner } from "@opencode-ai/ui/spinner" import { Tooltip } from "@opencode-ai/ui/tooltip" -import { getFilename } from "@opencode-ai/util/path" +import { getFilename } from "@opencode-ai/shared/util/path" import { A, useParams } from "@solidjs/router" import { type Accessor, createMemo, For, type JSX, Match, Show, Switch } from "solid-js" import { useGlobalSync } from "@/context/global-sync" diff --git a/packages/app/src/pages/layout/sidebar-project.tsx b/packages/app/src/pages/layout/sidebar-project.tsx index 7c9ae1aaf..076e1ef88 100644 --- a/packages/app/src/pages/layout/sidebar-project.tsx +++ b/packages/app/src/pages/layout/sidebar-project.tsx @@ -1,6 +1,6 @@ import { createMemo, For, Show, type Accessor, type JSX } from "solid-js" import { createStore } from "solid-js/store" -import { base64Encode } from "@opencode-ai/util/encode" +import { base64Encode } from "@opencode-ai/shared/util/encode" import { Button } from "@opencode-ai/ui/button" import { ContextMenu } from "@opencode-ai/ui/context-menu" import { HoverCard } from "@opencode-ai/ui/hover-card" diff --git a/packages/app/src/pages/layout/sidebar-workspace.tsx b/packages/app/src/pages/layout/sidebar-workspace.tsx index 68e36ff77..c1836fa8a 100644 --- a/packages/app/src/pages/layout/sidebar-workspace.tsx +++ b/packages/app/src/pages/layout/sidebar-workspace.tsx @@ -3,8 +3,8 @@ import { createEffect, createMemo, For, Show, type Accessor, type JSX } from "so import { createStore } from "solid-js/store" import { createSortable } from "@thisbeyond/solid-dnd" import { createMediaQuery } from "@solid-primitives/media" -import { base64Encode } from "@opencode-ai/util/encode" -import { getFilename } from "@opencode-ai/util/path" +import { base64Encode } from "@opencode-ai/shared/util/encode" +import { getFilename } from "@opencode-ai/shared/util/path" import { Button } from "@opencode-ai/ui/button" import { Collapsible } from "@opencode-ai/ui/collapsible" import { DropdownMenu } from "@opencode-ai/ui/dropdown-menu" @@ -14,10 +14,11 @@ import { Spinner } from "@opencode-ai/ui/spinner" import { Tooltip } from "@opencode-ai/ui/tooltip" import { type Session } from "@opencode-ai/sdk/v2/client" import { type LocalProject } from "@/context/layout" -import { useGlobalSync } from "@/context/global-sync" +import { loadSessionsQuery, useGlobalSync } from "@/context/global-sync" import { useLanguage } from "@/context/language" import { NewSessionItem, SessionItem, SessionSkeleton } from "./sidebar-items" import { sortedRootSessions, workspaceKey } from "./helpers" +import { useQuery } from "@tanstack/solid-query" type InlineEditorComponent = (props: { id: string @@ -274,10 +275,10 @@ const WorkspaceSessionList = (props: { <div class="relative w-full py-1"> <Button variant="ghost" - class="flex w-full text-left justify-start text-14-regular text-text-weak pl-9 pr-10" + class="flex w-full text-left justify-start text-14-regular text-text-weak pl-2 pr-10" size="large" onClick={(e: MouseEvent) => { - props.loadMore() + void props.loadMore() ;(e.currentTarget as HTMLButtonElement).blur() }} > @@ -454,7 +455,8 @@ export const LocalWorkspace = (props: { const sessions = createMemo(() => sortedRootSessions(workspace().store, props.sortNow())) const booted = createMemo((prev) => prev || workspace().store.status === "complete", false) const count = createMemo(() => sessions()?.length ?? 0) - const loading = createMemo(() => !booted() && count() === 0) + const query = useQuery(() => ({ ...loadSessionsQuery(props.project.worktree) })) + const loading = createMemo(() => query.isPending && count() === 0) const hasMore = createMemo(() => workspace().store.sessionTotal > count()) const loadMore = async () => { workspace().setStore("limit", (limit) => (limit ?? 0) + 5) @@ -471,7 +473,7 @@ export const LocalWorkspace = (props: { mobile={props.mobile} ctx={props.ctx} showNew={() => false} - loading={loading} + loading={() => query.isLoading} sessions={sessions} hasMore={hasMore} loadMore={loadMore} diff --git a/packages/app/src/pages/session.tsx b/packages/app/src/pages/session.tsx index eb6a49411..c4d642bf8 100644 --- a/packages/app/src/pages/session.tsx +++ b/packages/app/src/pages/session.tsx @@ -13,6 +13,7 @@ import { on, onMount, untrack, + createResource, } from "solid-js" import { makeEventListener } from "@solid-primitives/event-listener" import { createMediaQuery } from "@solid-primitives/media" @@ -27,7 +28,7 @@ import { createAutoScroll } from "@opencode-ai/ui/hooks" import { previewSelectedLines } from "@opencode-ai/ui/pierre/selection-bridge" import { Button } from "@opencode-ai/ui/button" import { showToast } from "@opencode-ai/ui/toast" -import { checksum } from "@opencode-ai/util/encode" +import { checksum } from "@opencode-ai/shared/util/encode" import { useSearchParams } from "@solidjs/router" import { NewSessionView, SessionHeader } from "@/components/session" import { useComments } from "@/context/comments" @@ -432,8 +433,6 @@ export default function Page() { const info = createMemo(() => (params.id ? sync.session.get(params.id) : undefined)) const isChildSession = createMemo(() => !!info()?.parentID) const diffs = createMemo(() => (params.id ? list(sync.data.session_diff[params.id]) : [])) - const sessionCount = createMemo(() => Math.max(info()?.summary?.files ?? 0, diffs().length)) - const hasSessionReview = createMemo(() => sessionCount() > 0) const canReview = createMemo(() => !!sync.project) const reviewTab = createMemo(() => isDesktop()) const tabState = createSessionTabs({ @@ -443,8 +442,6 @@ export default function Page() { review: reviewTab, hasReview: canReview, }) - const contextOpen = tabState.contextOpen - const openedTabs = tabState.openedTabs const activeTab = tabState.activeTab const activeFileTab = tabState.activeFileTab const revertMessageID = createMemo(() => info()?.revert?.messageID) @@ -487,7 +484,7 @@ export default function Page() { if (!tab) return const path = file.pathFromTab(tab) - if (path) file.load(path) + if (path) void file.load(path) }) createEffect( @@ -808,8 +805,9 @@ export default function Page() { const hasScrollGesture = () => Date.now() - ui.scrollGesture < scrollGestureWindowMs - createEffect( - on([() => sdk.directory, () => params.id] as const, ([, id]) => { + const [sessionSync] = createResource( + () => [sdk.directory, params.id] as const, + ([directory, id]) => { if (refreshFrame !== undefined) cancelAnimationFrame(refreshFrame) if (refreshTimer !== undefined) window.clearTimeout(refreshTimer) refreshFrame = undefined @@ -820,13 +818,10 @@ export default function Page() { const stale = !cached ? false : (() => { - const info = getSessionPrefetch(sdk.directory, id) + const info = getSessionPrefetch(directory, id) if (!info) return true return Date.now() - info.at > SESSION_PREFETCH_TTL })() - untrack(() => { - void sync.session.sync(id) - }) refreshFrame = requestAnimationFrame(() => { refreshFrame = undefined @@ -838,7 +833,9 @@ export default function Page() { }) }, 0) }) - }), + + return sync.session.sync(id) + }, ) createEffect( @@ -1885,6 +1882,7 @@ export default function Page() { return ( <div class="relative bg-background-base size-full overflow-hidden flex flex-col"> + {sessionSync() ?? ""} <SessionHeader /> <div class="flex-1 min-h-0 flex flex-col md:flex-row"> <Show when={!isDesktop() && !!params.id}> diff --git a/packages/app/src/pages/session/composer/session-composer-state.ts b/packages/app/src/pages/session/composer/session-composer-state.ts index eab210868..525766dcf 100644 --- a/packages/app/src/pages/session/composer/session-composer-state.ts +++ b/packages/app/src/pages/session/composer/session-composer-state.ts @@ -1,6 +1,5 @@ -import { createEffect, createMemo, on, onCleanup, onMount } from "solid-js" +import { createEffect, createMemo, on, onCleanup } from "solid-js" import { createStore } from "solid-js/store" -import { makeEventListener } from "@solid-primitives/event-listener" import type { PermissionRequest, QuestionRequest, Todo } from "@opencode-ai/sdk/v2" import { useParams } from "@solidjs/router" import { showToast } from "@opencode-ai/ui/toast" @@ -9,7 +8,6 @@ import { useLanguage } from "@/context/language" import { usePermission } from "@/context/permission" import { useSDK } from "@/context/sdk" import { useSync } from "@/context/sync" -import { composerDriver, composerEnabled, composerEvent } from "@/testing/session-composer" import { sessionPermissionRequest, sessionQuestionRequest } from "./session-request-tree" export const todoState = (input: { @@ -49,49 +47,7 @@ export function createSessionComposerState(options?: { closeMs?: number | (() => return !!permissionRequest() || !!questionRequest() }) - const [test, setTest] = createStore({ - on: false, - live: undefined as boolean | undefined, - todos: undefined as Todo[] | undefined, - }) - - const pull = () => { - const id = params.id - if (!id) { - setTest({ on: false, live: undefined, todos: undefined }) - return - } - - const next = composerDriver(id) - if (!next) { - setTest({ on: false, live: undefined, todos: undefined }) - return - } - - setTest({ - on: true, - live: next.live, - todos: next.todos?.map((todo) => ({ ...todo })), - }) - } - - onMount(() => { - if (!composerEnabled()) return - - pull() - createEffect(on(() => params.id, pull, { defer: true })) - - const onEvent = (event: Event) => { - const detail = (event as CustomEvent<{ sessionID?: string }>).detail - if (detail?.sessionID !== params.id) return - pull() - } - - makeEventListener(window, composerEvent, onEvent) - }) - const todos = createMemo((): Todo[] => { - if (test.on && test.todos !== undefined) return test.todos const id = params.id if (!id) return [] return globalSync.data.session_todo[id] ?? [] @@ -108,10 +64,7 @@ export function createSessionComposerState(options?: { closeMs?: number | (() => }) const busy = createMemo(() => status().type !== "idle") - const live = createMemo(() => { - if (test.on && test.live !== undefined) return test.live - return busy() || blocked() - }) + const live = createMemo(() => busy() || blocked()) const [store, setStore] = createStore({ responding: undefined as string | undefined, @@ -163,10 +116,6 @@ export function createSessionComposerState(options?: { closeMs?: number | (() => // Keep stale turn todos from reopening if the model never clears them. const clear = () => { - if (test.on && test.todos !== undefined) { - setTest("todos", []) - return - } const id = params.id if (!id) return globalSync.todo.set(id, []) diff --git a/packages/app/src/pages/session/composer/session-todo-dock.tsx b/packages/app/src/pages/session/composer/session-todo-dock.tsx index 2214248b1..fa8c17734 100644 --- a/packages/app/src/pages/session/composer/session-todo-dock.tsx +++ b/packages/app/src/pages/session/composer/session-todo-dock.tsx @@ -7,9 +7,8 @@ import { useSpring } from "@opencode-ai/ui/motion-spring" import { TextReveal } from "@opencode-ai/ui/text-reveal" import { TextStrikethrough } from "@opencode-ai/ui/text-strikethrough" import { createResizeObserver } from "@solid-primitives/resize-observer" -import { Index, createEffect, createMemo, onCleanup } from "solid-js" +import { Index, createEffect, createMemo } from "solid-js" import { createStore } from "solid-js/store" -import { composerEnabled, composerProbe } from "@/testing/session-composer" import { useLanguage } from "@/context/language" const doneToken = "\u0000done\u0000" @@ -81,8 +80,6 @@ export function SessionTodoDock(props: { const off = createMemo(() => hide() > 0.98) const turn = createMemo(() => Math.max(0, Math.min(1, value()))) const full = createMemo(() => Math.max(78, store.height)) - const e2e = composerEnabled() - const probe = composerProbe(props.sessionID) let contentRef: HTMLDivElement | undefined createEffect(() => { @@ -95,23 +92,6 @@ export function SessionTodoDock(props: { createResizeObserver(el, update) }) - createEffect(() => { - if (!e2e) return - - probe.set({ - mounted: true, - collapsed: store.collapsed, - hidden: store.collapsed || off(), - count: props.todos.length, - states: props.todos.map((todo) => todo.status), - }) - }) - - onCleanup(() => { - if (!e2e) return - probe.drop() - }) - return ( <DockTray data-component="session-todo-dock" diff --git a/packages/app/src/pages/session/file-tabs.tsx b/packages/app/src/pages/session/file-tabs.tsx index cb7617523..37bffcd2f 100644 --- a/packages/app/src/pages/session/file-tabs.tsx +++ b/packages/app/src/pages/session/file-tabs.tsx @@ -6,7 +6,7 @@ import type { FileSearchHandle } from "@opencode-ai/ui/file" import { useFileComponent } from "@opencode-ai/ui/context/file" import { cloneSelectedLineRange, previewSelectedLines } from "@opencode-ai/ui/pierre/selection-bridge" import { createLineCommentController } from "@opencode-ai/ui/line-comment-annotations" -import { sampledChecksum } from "@opencode-ai/util/encode" +import { sampledChecksum } from "@opencode-ai/shared/util/encode" import { DropdownMenu } from "@opencode-ai/ui/dropdown-menu" import { IconButton } from "@opencode-ai/ui/icon-button" import { Tabs } from "@opencode-ai/ui/tabs" @@ -378,12 +378,6 @@ export function FileTabContent(props: { tab: string }) { requestAnimationFrame(() => comments.clearFocus()) }) - const cancelCommenting = () => { - const p = path() - if (p) file.setSelectedLines(p, null) - setNote("commenting", null) - } - let prev = { loaded: false, ready: false, diff --git a/packages/app/src/pages/session/helpers.ts b/packages/app/src/pages/session/helpers.ts index f3215f685..e136ba999 100644 --- a/packages/app/src/pages/session/helpers.ts +++ b/packages/app/src/pages/session/helpers.ts @@ -117,7 +117,7 @@ export const createOpenReviewFile = (input: { input.openTab(tab) input.setActive(tab) } - if (maybePromise instanceof Promise) maybePromise.then(open) + if (maybePromise instanceof Promise) void maybePromise.then(open) else open() }) } diff --git a/packages/app/src/pages/session/message-timeline.tsx b/packages/app/src/pages/session/message-timeline.tsx index fe6447c2e..978f188b6 100644 --- a/packages/app/src/pages/session/message-timeline.tsx +++ b/packages/app/src/pages/session/message-timeline.tsx @@ -15,8 +15,8 @@ import { ScrollView } from "@opencode-ai/ui/scroll-view" import { TextField } from "@opencode-ai/ui/text-field" import type { AssistantMessage, Message as MessageType, Part, TextPart, UserMessage } from "@opencode-ai/sdk/v2" import { showToast } from "@opencode-ai/ui/toast" -import { Binary } from "@opencode-ai/util/binary" -import { getFilename } from "@opencode-ai/util/path" +import { Binary } from "@opencode-ai/shared/util/binary" +import { getFilename } from "@opencode-ai/shared/util/path" import { Popover as KobaltePopover } from "@kobalte/core/popover" import { shouldMarkBoundaryGesture, normalizeWheelDelta } from "@/pages/session/message-gesture" import { SessionContextUsage } from "@/components/session-context-usage" @@ -642,10 +642,10 @@ export function MessageTimeline(props: { onClick={props.onResumeScroll} > <div - class="flex items-center justify-center w-8 h-6 rounded-[6px] border border-[var(--gray-dark-7)] bg-[color-mix(in_srgb,var(--gray-dark-3)_80%,transparent)] backdrop-blur-[0.75px] transition-colors group-hover:border-[var(--gray-dark-8)] [--icon-base:var(--gray-dark-10)] group-hover:[--icon-base:var(--gray-dark-11)]" + class="flex items-center justify-center w-8 h-6 rounded-[6px] border border-border-weaker-base bg-[color-mix(in_srgb,var(--surface-raised-stronger-non-alpha)_80%,transparent)] backdrop-blur-[0.75px] transition-colors group-hover:border-[var(--border-weak-base)] group-hover:[--icon-base:var(--icon-hover)]" style={{ "box-shadow": - "0 51px 60px 0 rgba(0,0,0,0.13), 0 15.375px 18.088px 0 rgba(0,0,0,0.19), 0 6.386px 7.513px 0 rgba(0,0,0,0.25), 0 2.31px 2.717px 0 rgba(0,0,0,0.38)", + "0 51px 60px 0 rgba(0,0,0,0.10), 0 15px 18px 0 rgba(0,0,0,0.12), 0 6.386px 7.513px 0 rgba(0,0,0,0.12), 0 2.31px 2.717px 0 rgba(0,0,0,0.20)", }} > <Icon name="arrow-down-to-line" size="small" /> @@ -791,7 +791,7 @@ export function MessageTimeline(props: { data-slot="session-title-child" value={title.draft} disabled={titleMutation.isPending} - class="text-14-medium text-text-strong grow-1 min-w-0 rounded-[6px]" + class="text-14-medium text-text-strong grow-1 min-w-0 rounded-[6px] pl-1 -ml-1" style={{ "--inline-input-shadow": "var(--shadow-xs-border-select)" }} onInput={(event) => setTitle("draft", event.currentTarget.value)} onKeyDown={(event) => { diff --git a/packages/app/src/pages/session/review-tab.tsx b/packages/app/src/pages/session/review-tab.tsx index 71dfe375e..5719fce31 100644 --- a/packages/app/src/pages/session/review-tab.tsx +++ b/packages/app/src/pages/session/review-tab.tsx @@ -1,4 +1,4 @@ -import { createEffect, createSignal, onCleanup, type JSX } from "solid-js" +import { createEffect, onCleanup, type JSX } from "solid-js" import { makeEventListener } from "@solid-primitives/event-listener" import type { SnapshotFileDiff, VcsFileDiff } from "@opencode-ai/sdk/v2" import { SessionReview } from "@opencode-ai/ui/session-review" diff --git a/packages/app/src/pages/session/terminal-panel.tsx b/packages/app/src/pages/session/terminal-panel.tsx index 1161d565a..2c2d9817f 100644 --- a/packages/app/src/pages/session/terminal-panel.tsx +++ b/packages/app/src/pages/session/terminal-panel.tsx @@ -19,7 +19,6 @@ import { terminalTabLabel } from "@/pages/session/terminal-label" import { createSizing, focusTerminalById } from "@/pages/session/helpers" import { getTerminalHandoff, setTerminalHandoff } from "@/pages/session/handoff" import { useSessionLayout } from "@/pages/session/session-layout" -import { terminalProbe } from "@/testing/terminal" export function TerminalPanel() { const delays = [120, 240] @@ -78,12 +77,9 @@ export function TerminalPanel() { ) const focus = (id: string) => { - const probe = terminalProbe(id) - probe.focus(delays.length + 1) focusTerminalById(id) const frame = requestAnimationFrame(() => { - probe.step() if (!opened()) return if (terminal.active() !== id) return focusTerminalById(id) @@ -91,7 +87,6 @@ export function TerminalPanel() { const timers = delays.map((ms) => window.setTimeout(() => { - probe.step() if (!opened()) return if (terminal.active() !== id) return focusTerminalById(id) @@ -99,7 +94,6 @@ export function TerminalPanel() { ) return () => { - probe.focus(0) cancelAnimationFrame(frame) for (const timer of timers) clearTimeout(timer) } diff --git a/packages/app/src/pages/session/use-session-commands.tsx b/packages/app/src/pages/session/use-session-commands.tsx index 239795373..b5d254463 100644 --- a/packages/app/src/pages/session/use-session-commands.tsx +++ b/packages/app/src/pages/session/use-session-commands.tsx @@ -12,7 +12,7 @@ import { useSDK } from "@/context/sdk" import { useSync } from "@/context/sync" import { useTerminal } from "@/context/terminal" import { showToast } from "@opencode-ai/ui/toast" -import { findLast } from "@opencode-ai/util/array" +import { findLast } from "@opencode-ai/shared/util/array" import { createSessionTabs } from "@/pages/session/helpers" import { extractPromptFromParts } from "@/utils/prompt" import { UserMessage } from "@opencode-ai/sdk/v2" diff --git a/packages/app/src/testing/model-selection.ts b/packages/app/src/testing/model-selection.ts deleted file mode 100644 index d2770fe28..000000000 --- a/packages/app/src/testing/model-selection.ts +++ /dev/null @@ -1,109 +0,0 @@ -type ModelKey = { - providerID: string - modelID: string -} - -type ModelItem = ModelKey & { - name: string -} - -type AgentItem = { - name: string -} - -type State = { - agent?: string - model?: ModelKey | null - variant?: string | null -} - -export type ModelProbeState = { - dir?: string - sessionID?: string - last?: { - type: "agent" | "model" | "variant" - agent?: string - model?: ModelKey | null - variant?: string | null - } - agent?: string - model?: (ModelKey & { name?: string }) | undefined - variant?: string | null - selected?: string | null - configured?: string - pick?: State - base?: State - current?: string - variants?: string[] - models?: ModelItem[] - agents?: AgentItem[] -} - -export type ModelWindow = Window & { - __opencode_e2e?: { - model?: { - enabled?: boolean - current?: ModelProbeState - controls?: { - setAgent?: (name: string | undefined) => void - setModel?: (value: ModelKey | undefined) => void - setVariant?: (value: string | undefined) => void - } - } - } -} - -const clone = (state?: State) => { - if (!state) return undefined - return { - ...state, - model: state.model ? { ...state.model } : state.model, - } -} - -let active: symbol | undefined - -export const modelEnabled = () => { - if (typeof window === "undefined") return false - return (window as ModelWindow).__opencode_e2e?.model?.enabled === true -} - -const root = () => { - if (!modelEnabled()) return - return (window as ModelWindow).__opencode_e2e?.model -} - -export const modelProbe = { - bind(id: symbol, input: NonNullable<NonNullable<ModelWindow["__opencode_e2e"]>["model"]>["controls"]) { - const state = root() - if (!state) return - active = id - state.controls = input - }, - set(id: symbol, input: ModelProbeState) { - const state = root() - if (!state || active !== id) return - state.current = { - ...input, - model: input.model ? { ...input.model } : undefined, - last: input.last - ? { - ...input.last, - model: input.last.model ? { ...input.last.model } : input.last.model, - } - : undefined, - pick: clone(input.pick), - base: clone(input.base), - variants: input.variants?.slice(), - models: input.models?.map((item) => ({ ...item })), - agents: input.agents?.map((item) => ({ ...item })), - } - }, - clear(id: symbol) { - const state = root() - if (!state || active !== id) return - active = undefined - state.current = undefined - state.controls = undefined - }, -} diff --git a/packages/app/src/testing/prompt.ts b/packages/app/src/testing/prompt.ts deleted file mode 100644 index 5102ed825..000000000 --- a/packages/app/src/testing/prompt.ts +++ /dev/null @@ -1,83 +0,0 @@ -import type { E2EWindow } from "./terminal" - -export type PromptProbeState = { - popover: "at" | "slash" | null - slash: { - active: string | null - ids: string[] - } - selected: string | null - selects: number -} - -export type PromptSendState = { - started: number - count: number - sessionID?: string - directory?: string -} - -export const promptEnabled = () => { - if (typeof window === "undefined") return false - return (window as E2EWindow).__opencode_e2e?.prompt?.enabled === true -} - -const root = () => { - if (!promptEnabled()) return - return (window as E2EWindow).__opencode_e2e?.prompt -} - -export const promptProbe = { - set(input: Omit<PromptProbeState, "selected" | "selects">) { - const state = root() - if (!state) return - state.current = { - popover: input.popover, - slash: { - active: input.slash.active, - ids: [...input.slash.ids], - }, - selected: state.current?.selected ?? null, - selects: state.current?.selects ?? 0, - } - }, - select(id: string) { - const state = root() - if (!state) return - const prev = state.current - state.current = { - popover: prev?.popover ?? null, - slash: { - active: prev?.slash.active ?? null, - ids: [...(prev?.slash.ids ?? [])], - }, - selected: id, - selects: (prev?.selects ?? 0) + 1, - } - }, - clear() { - const state = root() - if (!state) return - state.current = undefined - }, - start() { - const state = root() - if (!state) return - state.sent = { - started: (state.sent?.started ?? 0) + 1, - count: state.sent?.count ?? 0, - sessionID: state.sent?.sessionID, - directory: state.sent?.directory, - } - }, - submit(input: { sessionID: string; directory: string }) { - const state = root() - if (!state) return - state.sent = { - started: state.sent?.started ?? 0, - count: (state.sent?.count ?? 0) + 1, - sessionID: input.sessionID, - directory: input.directory, - } - }, -} diff --git a/packages/app/src/testing/session-composer.ts b/packages/app/src/testing/session-composer.ts deleted file mode 100644 index 01c809e4c..000000000 --- a/packages/app/src/testing/session-composer.ts +++ /dev/null @@ -1,84 +0,0 @@ -import type { Todo } from "@opencode-ai/sdk/v2" - -export const composerEvent = "opencode:e2e:composer" - -export type ComposerDriverState = { - live?: boolean - todos?: Array<Pick<Todo, "content" | "status" | "priority">> -} - -export type ComposerProbeState = { - mounted: boolean - collapsed: boolean - hidden: boolean - count: number - states: Todo["status"][] -} - -type ComposerState = { - driver?: ComposerDriverState - probe?: ComposerProbeState -} - -export type ComposerWindow = Window & { - __opencode_e2e?: { - composer?: { - enabled?: boolean - sessions?: Record<string, ComposerState> - } - } -} - -const clone = (driver: ComposerDriverState) => ({ - live: driver.live, - todos: driver.todos?.map((todo) => ({ ...todo })), -}) - -export const composerEnabled = () => { - if (typeof window === "undefined") return false - return (window as ComposerWindow).__opencode_e2e?.composer?.enabled === true -} - -const root = () => { - if (!composerEnabled()) return - const state = (window as ComposerWindow).__opencode_e2e?.composer - if (!state) return - state.sessions ??= {} - return state.sessions -} - -export const composerDriver = (sessionID?: string) => { - if (!sessionID) return - const state = root()?.[sessionID]?.driver - if (!state) return - return clone(state) -} - -export const composerProbe = (sessionID?: string) => { - const set = (next: ComposerProbeState) => { - if (!sessionID) return - const sessions = root() - if (!sessions) return - const prev = sessions[sessionID] ?? {} - sessions[sessionID] = { - ...prev, - probe: { - ...next, - states: [...next.states], - }, - } - } - - return { - set, - drop() { - set({ - mounted: false, - collapsed: false, - hidden: true, - count: 0, - states: [], - }) - }, - } -} diff --git a/packages/app/src/testing/terminal.ts b/packages/app/src/testing/terminal.ts deleted file mode 100644 index db8001ddf..000000000 --- a/packages/app/src/testing/terminal.ts +++ /dev/null @@ -1,119 +0,0 @@ -import type { ModelProbeState } from "./model-selection" - -export const terminalAttr = "data-pty-id" - -export type TerminalProbeState = { - connected: boolean - connects: number - rendered: string - settled: number - focusing: number -} - -type TerminalProbeControl = { - disconnect?: VoidFunction -} - -export type E2EWindow = Window & { - __opencode_e2e?: { - model?: { - enabled?: boolean - current?: ModelProbeState - } - prompt?: { - enabled?: boolean - current?: import("./prompt").PromptProbeState - sent?: import("./prompt").PromptSendState - } - terminal?: { - enabled?: boolean - terminals?: Record<string, TerminalProbeState> - controls?: Record<string, TerminalProbeControl> - } - } -} - -const seed = (): TerminalProbeState => ({ - connected: false, - connects: 0, - rendered: "", - settled: 0, - focusing: 0, -}) - -const root = () => { - if (typeof window === "undefined") return - const state = (window as E2EWindow).__opencode_e2e?.terminal - if (!state?.enabled) return - return state -} - -const terms = () => { - const state = root() - if (!state) return - state.terminals ??= {} - return state.terminals -} - -const controls = () => { - const state = root() - if (!state) return - state.controls ??= {} - return state.controls -} - -export const terminalProbe = (id: string) => { - const set = (next: Partial<TerminalProbeState>) => { - const state = terms() - if (!state) return - state[id] = { ...(state[id] ?? seed()), ...next } - } - - return { - init() { - set(seed()) - }, - connect() { - const state = terms() - if (!state) return - const prev = state[id] ?? seed() - state[id] = { - ...prev, - connected: true, - connects: prev.connects + 1, - } - }, - render(data: string) { - const state = terms() - if (!state) return - const prev = state[id] ?? seed() - state[id] = { ...prev, rendered: prev.rendered + data } - }, - settle() { - const state = terms() - if (!state) return - const prev = state[id] ?? seed() - state[id] = { ...prev, settled: prev.settled + 1 } - }, - focus(count: number) { - set({ focusing: Math.max(0, count) }) - }, - step() { - const state = terms() - if (!state) return - const prev = state[id] ?? seed() - state[id] = { ...prev, focusing: Math.max(0, prev.focusing - 1) } - }, - control(next: Partial<TerminalProbeControl>) { - const state = controls() - if (!state) return - state[id] = { ...(state[id] ?? {}), ...next } - }, - drop() { - const state = terms() - if (state) delete state[id] - const control = controls() - if (control) delete control[id] - }, - } -} diff --git a/packages/app/src/utils/base64.ts b/packages/app/src/utils/base64.ts index c1f9d88c6..f60dff2b6 100644 --- a/packages/app/src/utils/base64.ts +++ b/packages/app/src/utils/base64.ts @@ -1,4 +1,4 @@ -import { base64Decode } from "@opencode-ai/util/encode" +import { base64Decode } from "@opencode-ai/shared/util/encode" export function decode64(value: string | undefined) { if (value === undefined) return diff --git a/packages/app/src/utils/persist.ts b/packages/app/src/utils/persist.ts index 3dcbeb7d3..dce0e94c3 100644 --- a/packages/app/src/utils/persist.ts +++ b/packages/app/src/utils/persist.ts @@ -1,6 +1,6 @@ import { Platform, usePlatform } from "@/context/platform" import { makePersisted, type AsyncStorage, type SyncStorage } from "@solid-primitives/storage" -import { checksum } from "@opencode-ai/util/encode" +import { checksum } from "@opencode-ai/shared/util/encode" import { createResource, type Accessor } from "solid-js" import type { SetStoreFunction, Store } from "solid-js/store" diff --git a/packages/app/src/utils/runtime-adapters.test.ts b/packages/app/src/utils/runtime-adapters.test.ts index 9f408b8eb..49552e179 100644 --- a/packages/app/src/utils/runtime-adapters.test.ts +++ b/packages/app/src/utils/runtime-adapters.test.ts @@ -46,7 +46,9 @@ describe("runtime adapters", () => { }) test("resolves speech recognition constructor with webkit precedence", () => { + // oxlint-disable-next-line no-extraneous-class class SpeechCtor {} + // oxlint-disable-next-line no-extraneous-class class WebkitCtor {} const ctor = getSpeechRecognitionCtor({ SpeechRecognition: SpeechCtor, diff --git a/packages/app/src/utils/server.ts b/packages/app/src/utils/server.ts index 17f4a3adc..ae849b71e 100644 --- a/packages/app/src/utils/server.ts +++ b/packages/app/src/utils/server.ts @@ -16,7 +16,10 @@ export function createSdkForServer({ return createOpencodeClient({ ...config, - headers: { ...config.headers, ...auth }, + headers: { + ...(config.headers instanceof Headers ? Object.fromEntries(config.headers.entries()) : config.headers), + ...auth, + }, baseUrl: server.url, }) } diff --git a/packages/app/test/e2e/mock.test.ts b/packages/app/test/e2e/mock.test.ts deleted file mode 100644 index 3bd80f34d..000000000 --- a/packages/app/test/e2e/mock.test.ts +++ /dev/null @@ -1,66 +0,0 @@ -import { describe, expect, test } from "bun:test" -import { bodyText, inputMatch, promptMatch } from "../../e2e/prompt/mock" - -function hit(body: Record<string, unknown>) { - return { body } -} - -describe("promptMatch", () => { - test("matches token in serialized body", () => { - const match = promptMatch("hello") - expect(match(hit({ messages: [{ role: "user", content: "say hello" }] }))).toBe(true) - expect(match(hit({ messages: [{ role: "user", content: "say goodbye" }] }))).toBe(false) - }) -}) - -describe("inputMatch", () => { - test("matches exact tool input in chat completions body", () => { - const input = { questions: [{ header: "Need input", question: "Pick one" }] } - const match = inputMatch(input) - - // The seed prompt embeds JSON.stringify(input) in the user message - const prompt = `Use this JSON input: ${JSON.stringify(input)}` - const body = { messages: [{ role: "user", content: prompt }] } - expect(match(hit(body))).toBe(true) - }) - - test("matches exact tool input in responses API body", () => { - const input = { questions: [{ header: "Need input", question: "Pick one" }] } - const match = inputMatch(input) - - const prompt = `Use this JSON input: ${JSON.stringify(input)}` - const body = { model: "test", input: [{ role: "user", content: [{ type: "input_text", text: prompt }] }] } - expect(match(hit(body))).toBe(true) - }) - - test("matches patchText with newlines", () => { - const patchText = "*** Begin Patch\n*** Add File: test.txt\n+line1\n*** End Patch" - const match = inputMatch({ patchText }) - - const prompt = `Use this JSON input: ${JSON.stringify({ patchText })}` - const body = { messages: [{ role: "user", content: prompt }] } - expect(match(hit(body))).toBe(true) - - // Also works in responses API format - const respBody = { model: "test", input: [{ role: "user", content: [{ type: "input_text", text: prompt }] }] } - expect(match(hit(respBody))).toBe(true) - }) - - test("does not match unrelated requests", () => { - const input = { questions: [{ header: "Need input" }] } - const match = inputMatch(input) - - expect(match(hit({ messages: [{ role: "user", content: "hello" }] }))).toBe(false) - expect(match(hit({ model: "test", input: [] }))).toBe(false) - }) - - test("does not match partial input", () => { - const input = { questions: [{ header: "Need input", question: "Pick one" }] } - const match = inputMatch(input) - - // Only header, missing question - const partial = `Use this JSON input: ${JSON.stringify({ questions: [{ header: "Need input" }] })}` - const body = { messages: [{ role: "user", content: partial }] } - expect(match(hit(body))).toBe(false) - }) -}) diff --git a/packages/app/test/e2e/no-real-llm.test.ts b/packages/app/test/e2e/no-real-llm.test.ts deleted file mode 100644 index c801df56f..000000000 --- a/packages/app/test/e2e/no-real-llm.test.ts +++ /dev/null @@ -1,27 +0,0 @@ -import { describe, expect, test } from "bun:test" -import path from "node:path" -import { fileURLToPath } from "node:url" - -const dir = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "../../e2e") - -function hasPrompt(src: string) { - if (!src.includes("withProject(")) return false - if (src.includes("withNoReplyPrompt(")) return false - if (src.includes("session.promptAsync({") && !src.includes("noReply: true")) return true - if (!src.includes("promptSelector")) return false - return src.includes('keyboard.press("Enter")') || src.includes('prompt.press("Enter")') -} - -describe("e2e llm guard", () => { - test("withProject specs do not submit prompt replies", async () => { - const bad: string[] = [] - - for await (const file of new Bun.Glob("**/*.spec.ts").scan({ cwd: dir, absolute: true })) { - const src = await Bun.file(file).text() - if (!hasPrompt(src)) continue - bad.push(path.relative(dir, file)) - } - - expect(bad).toEqual([]) - }) -}) |
