Merge branch 'dev' into sqlite2

packages/app/e2e/actions.ts

@@ -0,0 +1,271 @@
+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 { modKey, serverUrl } from "./utils"
+import {
+  sessionItemSelector,
+  dropdownMenuTriggerSelector,
+  dropdownMenuContentSelector,
+  titlebarRightSelector,
+  popoverBodySelector,
+  listItemSelector,
+  listItemKeySelector,
+  listItemKeyStartsWithSelector,
+} from "./selectors"
+import type { createSdk } from "./utils"
+
+export async function defocus(page: Page) {
+  await page.mouse.click(5, 5)
+}
+
+export async function openPalette(page: Page) {
+  await defocus(page)
+  await page.keyboard.press(`${modKey}+P`)
+
+  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)
+}
+
+export async function isSidebarClosed(page: Page) {
+  const main = page.locator("main")
+  const classes = (await main.getAttribute("class")) ?? ""
+  return classes.includes("xl:border-l")
+}
+
+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
+  await toggleSidebar(page)
+  await expect(page.locator("main")).not.toHaveClass(/xl:border-l/)
+}
+
+export async function closeSidebar(page: Page) {
+  if (await isSidebarClosed(page)) return
+  await toggleSidebar(page)
+  await expect(page.locator("main")).toHaveClass(/xl:border-l/)
+}
+
+export async function openSettings(page: Page) {
+  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 page.getByRole("button", { name: "Settings" }).first().click()
+  await expect(dialog).toBeVisible()
+  return dialog
+}
+
+export async function seedProjects(page: Page, input: { directory: string; extra?: string[] }) {
+  await page.addInitScript(
+    (args: { directory: string; serverUrl: string; extra: 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 nextProjects = { ...(projects as Record<string, unknown>) }
+
+      const add = (origin: string, directory: string) => {
+        const current = nextProjects[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
+        nextProjects[origin] = [{ worktree: directory, expanded: true }, ...existing]
+      }
+
+      const directories = [args.directory, ...args.extra]
+      for (const directory of directories) {
+        add("local", directory)
+        add(args.serverUrl, directory)
+      }
+
+      localStorage.setItem(
+        key,
+        JSON.stringify({
+          list,
+          projects: nextProjects,
+          lastProject,
+        }),
+      )
+    },
+    { directory: input.directory, serverUrl, extra: input.extra ?? [] },
+  )
+}
+
+export async function createTestProject() {
+  const root = await fs.mkdtemp(path.join(os.tmpdir(), "opencode-e2e-project-"))
+
+  await fs.writeFile(path.join(root, "README.md"), "# e2e\n")
+
+  execSync("git init", { cwd: root, stdio: "ignore" })
+  execSync("git add -A", { cwd: root, stdio: "ignore" })
+  execSync('git -c user.name="e2e" -c user.email="e2e@example.com" commit -m "init" --allow-empty', {
+    cwd: root,
+    stdio: "ignore",
+  })
+
+  return root
+}
+
+export async function cleanupTestProject(directory: string) {
+  await fs.rm(directory, { recursive: true, force: true }).catch(() => undefined)
+}
+
+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(sessionItemSelector(sessionID)).first()
+  await expect(sessionEl).toBeVisible()
+  await sessionEl.hover()
+  return sessionEl
+}
+
+export async function openSessionMoreMenu(page: Page, sessionID: string) {
+  const sessionEl = await hoverSessionItem(page, sessionID)
+
+  const menuTrigger = sessionEl.locator(dropdownMenuTriggerSelector).first()
+  await expect(menuTrigger).toBeVisible()
+  await menuTrigger.click()
+
+  const menu = page.locator(dropdownMenuContentSelector).first()
+  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 rightSection = page.locator(titlebarRightSelector)
+  const shareButton = rightSection.getByRole("button", { name: "Share" }).first()
+  await expect(shareButton).toBeVisible()
+
+  const popoverBody = page
+    .locator(popoverBodySelector)
+    .filter({ has: page.getByRole("button", { name: /^(Publish|Unpublish)$/ }) })
+    .first()
+
+  const opened = await popoverBody
+    .isVisible()
+    .then((x) => x)
+    .catch(() => false)
+
+  if (!opened) {
+    await shareButton.click()
+    await expect(popoverBody).toBeVisible()
+  }
+  return { rightSection, popoverBody }
+}
+
+export async function clickPopoverButton(page: Page, buttonName: string | RegExp) {
+  const button = page.getByRole("button").filter({ hasText: buttonName }).first()
+  await expect(button).toBeVisible()
+  await button.click()
+}
+
+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
+}
+
+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 sdk.session.delete({ sessionID: session.id }).catch(() => undefined)
+  }
+}

packages/app/e2e/app/home.spec.ts

@@ -1,5 +1,5 @@
-import { test, expect } from "./fixtures"
-import { serverName } from "./utils"
+import { test, expect } from "../fixtures"
+import { serverName } from "../utils"
 
 test("home renders and shows core entrypoints", async ({ page }) => {
   await page.goto("/")

packages/app/e2e/app/navigation.spec.ts

@@ -1,5 +1,6 @@
-import { test, expect } from "./fixtures"
-import { dirPath, promptSelector } from "./utils"
+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))

packages/app/e2e/app/palette.spec.ts

@@ -0,0 +1,11 @@
+import { test, expect } from "../fixtures"
+import { 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)
+})

packages/app/e2e/app/server-default.spec.ts

@@ -1,5 +1,6 @@
-import { test, expect } from "./fixtures"
-import { serverName, serverUrl } from "./utils"
+import { test, expect } from "../fixtures"
+import { serverName, serverUrl } from "../utils"
+import { clickListItem, closeDialog, clickMenuItem } from "../actions"
 
 const DEFAULT_SERVER_URL_KEY = "opencode.settings.dat:defaultServerUrl"
 
@@ -33,31 +34,18 @@ test("can set a default server on web", async ({ page, gotoSession }) => {
   const row = dialog.locator('[data-slot="list-item"]').filter({ hasText: serverName }).first()
   await expect(row).toBeVisible()
 
-  const menu = row.locator('[data-component="icon-button"]').last()
-  await menu.click()
-  await page.getByRole("menuitem", { name: "Set as default" }).click()
+  const menuTrigger = row.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(() => page.evaluate((key) => localStorage.getItem(key), DEFAULT_SERVER_URL_KEY)).toBe(serverUrl)
   await expect(row.getByText("Default", { exact: true })).toBeVisible()
 
-  await page.keyboard.press("Escape")
-  const closed = await dialog
-    .waitFor({ state: "detached", timeout: 1500 })
-    .then(() => true)
-    .catch(() => false)
-
-  if (!closed) {
-    await page.keyboard.press("Escape")
-    const closedSecond = await dialog
-      .waitFor({ state: "detached", timeout: 1500 })
-      .then(() => true)
-      .catch(() => false)
-
-    if (!closedSecond) {
-      await page.locator('[data-component="dialog-overlay"]').click({ position: { x: 5, y: 5 } })
-      await expect(dialog).toHaveCount(0)
-    }
-  }
+  await closeDialog(page, dialog)
 
   await ensurePopoverOpen()
 

packages/app/e2e/app/session.spec.ts

@@ -0,0 +1,16 @@
+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")
+  })
+})

packages/app/e2e/app/titlebar-history.spec.ts

@@ -0,0 +1,42 @@
+import { test, expect } from "../fixtures"
+import { openSidebar, withSession } from "../actions"
+import { promptSelector } from "../selectors"
+
+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.scrollIntoViewIfNeeded()
+      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()
+    })
+  })
+})

packages/app/e2e/files/file-open.spec.ts

@@ -1,20 +1,15 @@
-import { test, expect } from "./fixtures"
-import { modKey } from "./utils"
+import { test, expect } from "../fixtures"
+import { openPalette, clickListItem } from "../actions"
 
 test("can open a file tab from the search palette", async ({ page, gotoSession }) => {
   await gotoSession()
 
-  await page.keyboard.press(`${modKey}+P`)
-
-  const dialog = page.getByRole("dialog")
-  await expect(dialog).toBeVisible()
+  const dialog = await openPalette(page)
 
   const input = dialog.getByRole("textbox").first()
   await input.fill("package.json")
 
-  const fileItem = dialog.locator('[data-slot="list-item"][data-key^="file:"]').first()
-  await expect(fileItem).toBeVisible()
-  await fileItem.click()
+  await clickListItem(dialog, { keyStartsWith: "file:" })
 
   await expect(dialog).toHaveCount(0)
 

packages/app/e2e/files/file-tree.spec.ts

@@ -1,4 +1,4 @@
-import { test, expect } from "./fixtures"
+import { test, expect } from "../fixtures"
 
 test.skip("file tree can expand folders and open a file", async ({ page, gotoSession }) => {
   await gotoSession()

packages/app/e2e/files/file-viewer.spec.ts

@@ -1,5 +1,5 @@
-import { test, expect } from "./fixtures"
-import { modKey } from "./utils"
+import { test, expect } from "../fixtures"
+import { openPalette, clickListItem } from "../actions"
 
 test("smoke file viewer renders real file content", async ({ page, gotoSession }) => {
   await gotoSession()
@@ -7,21 +7,12 @@ test("smoke file viewer renders real file content", async ({ page, gotoSession }
   const sep = process.platform === "win32" ? "\\" : "/"
   const file = ["packages", "app", "package.json"].join(sep)
 
-  await page.keyboard.press(`${modKey}+P`)
-
-  const dialog = page.getByRole("dialog")
-  await expect(dialog).toBeVisible()
+  const dialog = await openPalette(page)
 
   const input = dialog.getByRole("textbox").first()
   await input.fill(file)
 
-  const fileItem = dialog
-    .locator(
-      '[data-slot="list-item"][data-key^="file:"][data-key*="packages"][data-key*="app"][data-key$="package.json"]',
-    )
-    .first()
-  await expect(fileItem).toBeVisible()
-  await fileItem.click()
+  await clickListItem(dialog, { text: /packages.*app.*package.json/ })
 
   await expect(dialog).toHaveCount(0)
 

packages/app/e2e/fixtures.ts

@@ -1,5 +1,7 @@
 import { test as base, expect } from "@playwright/test"
-import { createSdk, dirSlug, getWorktree, promptSelector, serverUrl, sessionPath } from "./utils"
+import { seedProjects } from "./actions"
+import { promptSelector } from "./selectors"
+import { createSdk, dirSlug, getWorktree, sessionPath } from "./utils"
 
 type TestFixtures = {
   sdk: ReturnType<typeof createSdk>
@@ -29,54 +31,17 @@ export const test = base.extend<TestFixtures, WorkerFixtures>({
     await use(createSdk(directory))
   },
   gotoSession: async ({ page, directory }, use) => {
-    await page.addInitScript(
-      (input: { directory: string; serverUrl: 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 nextProjects = { ...(projects as Record<string, unknown>) }
-
-        const add = (origin: string) => {
-          const current = nextProjects[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 === input.directory)) return
-          nextProjects[origin] = [{ worktree: input.directory, expanded: true }, ...existing]
-        }
-
-        add("local")
-        add(input.serverUrl)
-
-        localStorage.setItem(
-          key,
-          JSON.stringify({
-            list,
-            projects: nextProjects,
-            lastProject,
-          }),
-        )
-      },
-      { directory, serverUrl },
-    )
+    await seedProjects(page, { directory })
+    await page.addInitScript(() => {
+      localStorage.setItem(
+        "opencode.global.dat:model",
+        JSON.stringify({
+          recent: [{ providerID: "opencode", modelID: "big-pickle" }],
+          user: [],
+          variant: {},
+        }),
+      )
+    })
 
     const gotoSession = async (sessionID?: string) => {
       await page.goto(sessionPath(directory, sessionID))

packages/app/e2e/models/model-picker.spec.ts

@@ -1,5 +1,6 @@
-import { test, expect } from "./fixtures"
-import { promptSelector } from "./utils"
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { clickListItem } from "../actions"
 
 test("smoke model selection updates prompt footer", async ({ page, gotoSession }) => {
   await gotoSession()
@@ -32,9 +33,7 @@ test("smoke model selection updates prompt footer", async ({ page, gotoSession }
 
   await input.fill(model)
 
-  const item = dialog.locator(`[data-slot="list-item"][data-key="${key}"]`)
-  await expect(item).toBeVisible()
-  await item.click()
+  await clickListItem(dialog, { key })
 
   await expect(dialog).toHaveCount(0)
 

packages/app/e2e/models/models-visibility.spec.ts

@@ -1,5 +1,6 @@
-import { test, expect } from "./fixtures"
-import { modKey, promptSelector } from "./utils"
+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()
@@ -27,18 +28,7 @@ test("hiding a model removes it from the model picker", async ({ page, gotoSessi
   await page.keyboard.press("Escape")
   await expect(picker).toHaveCount(0)
 
-  const settings = page.getByRole("dialog")
-
-  await page.keyboard.press(`${modKey}+Comma`).catch(() => undefined)
-  const opened = await settings
-    .waitFor({ state: "visible", timeout: 3000 })
-    .then(() => true)
-    .catch(() => false)
-
-  if (!opened) {
-    await page.getByRole("button", { name: "Settings" }).first().click()
-    await expect(settings).toBeVisible()
-  }
+  const settings = await openSettings(page)
 
   await settings.getByRole("tab", { name: "Models" }).click()
   const search = settings.getByPlaceholder("Search models")
@@ -52,22 +42,7 @@ test("hiding a model removes it from the model picker", async ({ page, gotoSessi
   await toggle.locator('[data-slot="switch-control"]').click()
   await expect(input).toHaveAttribute("aria-checked", "false")
 
-  await page.keyboard.press("Escape")
-  const closed = await settings
-    .waitFor({ state: "detached", timeout: 1500 })
-    .then(() => true)
-    .catch(() => false)
-  if (!closed) {
-    await page.keyboard.press("Escape")
-    const closedSecond = await settings
-      .waitFor({ state: "detached", timeout: 1500 })
-      .then(() => true)
-      .catch(() => false)
-    if (!closedSecond) {
-      await page.locator('[data-component="dialog-overlay"]').click({ position: { x: 5, y: 5 } })
-      await expect(settings).toHaveCount(0)
-    }
-  }
+  await closeDialog(page, settings)
 
   await page.locator(promptSelector).click()
   await page.keyboard.type("/model")

packages/app/e2e/palette.spec.ts

@@ -1,15 +0,0 @@
-import { test, expect } from "./fixtures"
-import { modKey } from "./utils"
-
-test("search palette opens and closes", async ({ page, gotoSession }) => {
-  await gotoSession()
-
-  await page.keyboard.press(`${modKey}+P`)
-
-  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)
-})

packages/app/e2e/projects/project-edit.spec.ts

@@ -0,0 +1,52 @@
+import { test, expect } from "../fixtures"
+import { openSidebar } from "../actions"
+
+test("dialog edit project updates name and startup script", async ({ page, gotoSession }) => {
+  await gotoSession()
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  await openSidebar(page)
+
+  const open = async () => {
+    const header = page.locator(".group\\/project").first()
+    await header.hover()
+    const trigger = header.getByRole("button", { name: "More options" }).first()
+    await expect(trigger).toBeVisible()
+    await trigger.click({ force: true })
+
+    const menu = page.locator('[data-component="dropdown-menu-content"]').first()
+    await expect(menu).toBeVisible()
+
+    const editItem = menu.getByRole("menuitem", { name: "Edit" }).first()
+    await expect(editItem).toBeVisible()
+    await editItem.click({ 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)
+
+  const header = page.locator(".group\\/project").first()
+  await expect(header).toContainText(name)
+
+  const reopened = await open()
+  await expect(reopened.getByLabel("Name")).toHaveValue(name)
+  await expect(reopened.getByLabel("Workspace startup script")).toHaveValue(startup)
+  await reopened.getByRole("button", { name: "Cancel" }).click()
+  await expect(reopened).toHaveCount(0)
+})

packages/app/e2e/projects/projects-close.spec.ts

@@ -0,0 +1,70 @@
+import { test, expect } from "../fixtures"
+import { createTestProject, seedProjects, cleanupTestProject, openSidebar, clickMenuItem } from "../actions"
+import { projectCloseHoverSelector, projectCloseMenuSelector, projectSwitchSelector } from "../selectors"
+import { dirSlug } from "../utils"
+
+test("can close a project via hover card close button", async ({ page, directory, gotoSession }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const other = await createTestProject()
+  const otherSlug = dirSlug(other)
+  await seedProjects(page, { directory, extra: [other] })
+
+  try {
+    await gotoSession()
+
+    await openSidebar(page)
+
+    const otherButton = page.locator(projectSwitchSelector(otherSlug)).first()
+    await expect(otherButton).toBeVisible()
+    await otherButton.hover()
+
+    const close = page.locator(projectCloseHoverSelector(otherSlug)).first()
+    await expect(close).toBeVisible()
+    await close.click()
+
+    await expect(otherButton).toHaveCount(0)
+  } finally {
+    await cleanupTestProject(other)
+  }
+})
+
+test("can close a project via project header more options menu", async ({ page, directory, gotoSession }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const other = await createTestProject()
+  const otherName = other.split("/").pop() ?? other
+  const otherSlug = dirSlug(other)
+  await seedProjects(page, { directory, extra: [other] })
+
+  try {
+    await gotoSession()
+
+    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 header = page
+      .locator(".group\\/project")
+      .filter({ has: page.locator(`[data-action="project-menu"][data-project="${otherSlug}"]`) })
+      .first()
+    await expect(header).toContainText(otherName)
+
+    const trigger = header.locator(`[data-action="project-menu"][data-project="${otherSlug}"]`).first()
+    await expect(trigger).toHaveCount(1)
+    await trigger.focus()
+    await page.keyboard.press("Enter")
+
+    const menu = page.locator('[data-component="dropdown-menu-content"]').first()
+    await expect(menu).toBeVisible({ timeout: 10_000 })
+
+    await clickMenuItem(menu, /^Close$/i, { force: true })
+    await expect(otherButton).toHaveCount(0)
+  } finally {
+    await cleanupTestProject(other)
+  }
+})

packages/app/e2e/projects/projects-switch.spec.ts

@@ -0,0 +1,34 @@
+import { test, expect } from "../fixtures"
+import { defocus, createTestProject, seedProjects, cleanupTestProject } from "../actions"
+import { projectSwitchSelector } from "../selectors"
+import { dirSlug } from "../utils"
+
+test("can switch between projects from sidebar", async ({ page, directory, gotoSession }) => {
+  await page.setViewportSize({ width: 1400, height: 800 })
+
+  const other = await createTestProject()
+  const otherSlug = dirSlug(other)
+
+  await seedProjects(page, { directory, extra: [other] })
+
+  try {
+    await gotoSession()
+
+    await defocus(page)
+
+    const currentSlug = dirSlug(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)
+  }
+})

packages/app/e2e/prompt/context.spec.ts

@@ -1,16 +1,13 @@
-import { test, expect } from "./fixtures"
-import { promptSelector } from "./utils"
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { withSession } from "../actions"
 
 test("context panel can be opened from the prompt", async ({ page, sdk, gotoSession }) => {
   const title = `e2e smoke context ${Date.now()}`
-  const created = await sdk.session.create({ title }).then((r) => r.data)
 
-  if (!created?.id) throw new Error("Session create did not return an id")
-  const sessionID = created.id
-
-  try {
+  await withSession(sdk, title, async (session) => {
     await sdk.session.promptAsync({
-      sessionID,
+      sessionID: session.id,
       noReply: true,
       parts: [
         {
@@ -22,12 +19,12 @@ test("context panel can be opened from the prompt", async ({ page, sdk, gotoSess
 
     await expect
       .poll(async () => {
-        const messages = await sdk.session.messages({ sessionID, limit: 1 }).then((r) => r.data ?? [])
+        const messages = await sdk.session.messages({ sessionID: session.id, limit: 1 }).then((r) => r.data ?? [])
         return messages.length
       })
       .toBeGreaterThan(0)
 
-    await gotoSession(sessionID)
+    await gotoSession(session.id)
 
     const contextButton = page
       .locator('[data-component="button"]')
@@ -39,7 +36,5 @@ test("context panel can be opened from the prompt", async ({ page, sdk, gotoSess
 
     const tabs = page.locator('[data-component="tabs"][data-variant="normal"]')
     await expect(tabs.getByRole("tab", { name: "Context" })).toBeVisible()
-  } finally {
-    await sdk.session.delete({ sessionID }).catch(() => undefined)
-  }
+  })
 })

packages/app/e2e/prompt/prompt-mention.spec.ts

@@ -1,5 +1,5 @@
-import { test, expect } from "./fixtures"
-import { promptSelector } from "./utils"
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
 
 test("smoke @mention inserts file pill token", async ({ page, gotoSession }) => {
   await gotoSession()

packages/app/e2e/prompt/prompt-slash-open.spec.ts

@@ -1,5 +1,5 @@
-import { test, expect } from "./fixtures"
-import { promptSelector } from "./utils"
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
 
 test("smoke /open opens file picker dialog", async ({ page, gotoSession }) => {
   await gotoSession()

packages/app/e2e/prompt/prompt.spec.ts

@@ -1,10 +1,6 @@
-import { test, expect } from "./fixtures"
-import { promptSelector } from "./utils"
-
-function sessionIDFromUrl(url: string) {
-  const match = /\/session\/([^/?#]+)/.exec(url)
-  return match?.[1]
-}
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { sessionIDFromUrl, withSession } from "../actions"
 
 test("can send a prompt and receive a reply", async ({ page, sdk, gotoSession }) => {
   test.setTimeout(120_000)

packages/app/e2e/selectors.ts

@@ -0,0 +1,35 @@
+export const promptSelector = '[data-component="prompt-input"]'
+export const terminalSelector = '[data-component="terminal"]'
+
+export const modelVariantCycleSelector = '[data-action="model-variant-cycle"]'
+export const settingsLanguageSelectSelector = '[data-action="settings-language"]'
+
+export const sidebarNavSelector = '[data-component="sidebar-nav-desktop"]'
+
+export const projectSwitchSelector = (slug: string) =>
+  `${sidebarNavSelector} [data-action="project-switch"][data-project="${slug}"]`
+
+export const projectCloseHoverSelector = (slug: string) => `[data-action="project-close-hover"][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 titlebarRightSelector = "#opencode-titlebar-right"
+
+export const popoverBodySelector = '[data-slot="popover-body"]'
+
+export const dropdownMenuTriggerSelector = '[data-slot="dropdown-menu-trigger"]'
+
+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 listItemSelector = '[data-slot="list-item"]'
+
+export const listItemKeyStartsWithSelector = (prefix: string) => `${listItemSelector}[data-key^="${prefix}"]`
+
+export const listItemKeySelector = (key: string) => `${listItemSelector}[data-key="${key}"]`

packages/app/e2e/session.spec.ts

@@ -1,21 +0,0 @@
-import { test, expect } from "./fixtures"
-import { promptSelector } from "./utils"
-
-test("can open an existing session and type into the prompt", async ({ page, sdk, gotoSession }) => {
-  const title = `e2e smoke ${Date.now()}`
-  const created = await sdk.session.create({ title }).then((r) => r.data)
-
-  if (!created?.id) throw new Error("Session create did not return an id")
-  const sessionID = created.id
-
-  try {
-    await gotoSession(sessionID)
-
-    const prompt = page.locator(promptSelector)
-    await prompt.click()
-    await page.keyboard.type("hello from e2e")
-    await expect(prompt).toContainText("hello from e2e")
-  } finally {
-    await sdk.session.delete({ sessionID }).catch(() => undefined)
-  }
-})

packages/app/e2e/session/session.spec.ts

@@ -0,0 +1,115 @@
+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"
+
+test("sidebar session can be renamed", async ({ page, sdk, gotoSession }) => {
+  const stamp = Date.now()
+  const originalTitle = `e2e rename test ${stamp}`
+  const newTitle = `e2e renamed ${stamp}`
+
+  await withSession(sdk, originalTitle, async (session) => {
+    await gotoSession(session.id)
+    await openSidebar(page)
+
+    const menu = await openSessionMoreMenu(page, session.id)
+    await clickMenuItem(menu, /rename/i)
+
+    const input = page.locator(sessionItemSelector(session.id)).locator(inlineInputSelector).first()
+    await expect(input).toBeVisible()
+    await input.fill(newTitle)
+    await input.press("Enter")
+
+    await expect(page.locator(sessionItemSelector(session.id)).locator("a").first()).toContainText(newTitle)
+  })
+})
+
+test("sidebar session can be archived", async ({ page, sdk, gotoSession }) => {
+  const stamp = Date.now()
+  const title = `e2e archive test ${stamp}`
+
+  await withSession(sdk, title, async (session) => {
+    await gotoSession(session.id)
+    await openSidebar(page)
+
+    const sessionEl = page.locator(sessionItemSelector(session.id))
+    const menu = await openSessionMoreMenu(page, session.id)
+    await clickMenuItem(menu, /archive/i)
+
+    await expect(sessionEl).not.toBeVisible()
+  })
+})
+
+test("sidebar session can be deleted", async ({ page, sdk, gotoSession }) => {
+  const stamp = Date.now()
+  const title = `e2e delete test ${stamp}`
+
+  await withSession(sdk, title, async (session) => {
+    await gotoSession(session.id)
+    await openSidebar(page)
+
+    const sessionEl = page.locator(sessionItemSelector(session.id))
+    const menu = await openSessionMoreMenu(page, session.id)
+    await clickMenuItem(menu, /delete/i)
+    await confirmDialog(page, /delete/i)
+
+    await expect(sessionEl).not.toBeVisible()
+  })
+})
+
+test("session can be shared and unshared via header button", async ({ page, sdk, gotoSession }) => {
+  test.skip(shareDisabled, "Share is disabled in this environment (OPENCODE_DISABLE_SHARE).")
+
+  const stamp = Date.now()
+  const title = `e2e share test ${stamp}`
+
+  await withSession(sdk, title, async (session) => {
+    await gotoSession(session.id)
+
+    const { rightSection, popoverBody } = await openSharePopover(page)
+    await popoverBody.getByRole("button", { name: "Publish" }).first().click()
+
+    await expect
+      .poll(
+        async () => {
+          const data = await sdk.session.get({ sessionID: session.id }).then((r) => r.data)
+          return data?.share?.url || undefined
+        },
+        { timeout: 30_000 },
+      )
+      .not.toBeUndefined()
+
+    const copyButton = rightSection.locator('button[aria-label="Copy link"]').first()
+    await expect(copyButton).toBeVisible({ timeout: 30_000 })
+
+    const sharedPopover = await openSharePopover(page)
+    const unpublish = sharedPopover.popoverBody.getByRole("button", { name: "Unpublish" }).first()
+    await expect(unpublish).toBeVisible({ timeout: 30_000 })
+    await unpublish.click()
+
+    await expect
+      .poll(
+        async () => {
+          const data = await sdk.session.get({ sessionID: session.id }).then((r) => r.data)
+          return data?.share?.url || undefined
+        },
+        { timeout: 30_000 },
+      )
+      .toBeUndefined()
+
+    await expect(copyButton).not.toBeVisible({ timeout: 30_000 })
+
+    const unsharedPopover = await openSharePopover(page)
+    await expect(unsharedPopover.popoverBody.getByRole("button", { name: "Publish" }).first()).toBeVisible({
+      timeout: 30_000,
+    })
+  })
+})

packages/app/e2e/settings.spec.ts

@@ -1,44 +0,0 @@
-import { test, expect } from "./fixtures"
-import { modKey } from "./utils"
-
-test("smoke settings dialog opens, switches tabs, closes", async ({ page, gotoSession }) => {
-  await gotoSession()
-
-  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) {
-    await page.getByRole("button", { name: "Settings" }).first().click()
-    await expect(dialog).toBeVisible()
-  }
-
-  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 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)
-})

packages/app/e2e/settings/settings-language.spec.ts

@@ -0,0 +1,28 @@
+import { test, expect } from "../fixtures"
+import { settingsLanguageSelectSelector } from "../selectors"
+import { openSettings } from "../actions"
+
+test("smoke 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")
+})

packages/app/e2e/settings/settings-providers.spec.ts

@@ -1,22 +1,11 @@
-import { test, expect } from "./fixtures"
-import { modKey, promptSelector } from "./utils"
+import { test, expect } from "../fixtures"
+import { promptSelector } from "../selectors"
+import { closeDialog, openSettings, clickListItem } from "../actions"
 
 test("smoke providers settings opens provider selector", async ({ page, gotoSession }) => {
   await gotoSession()
 
-  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) {
-    await page.getByRole("button", { name: "Settings" }).first().click()
-    await expect(dialog).toBeVisible()
-  }
+  const dialog = await openSettings(page)
 
   await dialog.getByRole("tab", { name: "Providers" }).click()
   await expect(dialog.getByText("Connected providers", { exact: true })).toBeVisible()
@@ -37,20 +26,5 @@ test("smoke providers settings opens provider selector", async ({ page, gotoSess
   const stillOpen = await dialog.isVisible().catch(() => false)
   if (!stillOpen) return
 
-  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)
+  await closeDialog(page, dialog)
 })

packages/app/e2e/settings/settings.spec.ts

@@ -0,0 +1,14 @@
+import { test, expect } from "../fixtures"
+import { closeDialog, openSettings } from "../actions"
+
+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)
+})

packages/app/e2e/sidebar.spec.ts

@@ -1,21 +0,0 @@
-import { test, expect } from "./fixtures"
-import { modKey } from "./utils"
-
-test("sidebar can be collapsed and expanded", async ({ page, gotoSession }) => {
-  await gotoSession()
-
-  const main = page.locator("main")
-  const closedClass = /xl:border-l/
-  const isClosed = await main.evaluate((node) => node.className.includes("xl:border-l"))
-
-  if (isClosed) {
-    await page.keyboard.press(`${modKey}+B`)
-    await expect(main).not.toHaveClass(closedClass)
-  }
-
-  await page.keyboard.press(`${modKey}+B`)
-  await expect(main).toHaveClass(closedClass)
-
-  await page.keyboard.press(`${modKey}+B`)
-  await expect(main).not.toHaveClass(closedClass)
-})

packages/app/e2e/sidebar/sidebar-session-links.spec.ts

@@ -1,33 +1,8 @@
-import { test, expect } from "./fixtures"
-import { modKey, promptSelector } from "./utils"
+import { test, expect } from "../fixtures"
+import { openSidebar, withSession } from "../actions"
+import { promptSelector } from "../selectors"
 
-type Locator = {
-  first: () => Locator
-  getAttribute: (name: string) => Promise<string | null>
-  scrollIntoViewIfNeeded: () => Promise<void>
-  click: () => Promise<void>
-}
-
-type Page = {
-  locator: (selector: string) => Locator
-  keyboard: {
-    press: (key: string) => Promise<void>
-  }
-}
-
-type Fixtures = {
-  page: Page
-  slug: string
-  sdk: {
-    session: {
-      create: (input: { title: string }) => Promise<{ data?: { id?: string } }>
-      delete: (input: { sessionID: string }) => Promise<unknown>
-    }
-  }
-  gotoSession: (sessionID?: string) => Promise<void>
-}
-
-test("sidebar session links navigate to the selected session", async ({ page, slug, sdk, gotoSession }: Fixtures) => {
+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)
@@ -39,12 +14,7 @@ test("sidebar session links navigate to the selected session", async ({ page, sl
   try {
     await gotoSession(one.id)
 
-    const main = page.locator("main")
-    const collapsed = ((await main.getAttribute("class")) ?? "").includes("xl:border-l")
-    if (collapsed) {
-      await page.keyboard.press(`${modKey}+B`)
-      await expect(main).not.toHaveClass(/xl:border-l/)
-    }
+    await openSidebar(page)
 
     const target = page.locator(`[data-session-id="${two.id}"] a`).first()
     await expect(target).toBeVisible()

packages/app/e2e/sidebar/sidebar.spec.ts

@@ -0,0 +1,14 @@
+import { test, expect } from "../fixtures"
+import { openSidebar, toggleSidebar } from "../actions"
+
+test("sidebar can be collapsed and expanded", async ({ page, gotoSession }) => {
+  await gotoSession()
+
+  await openSidebar(page)
+
+  await toggleSidebar(page)
+  await expect(page.locator("main")).toHaveClass(/xl:border-l/)
+
+  await toggleSidebar(page)
+  await expect(page.locator("main")).not.toHaveClass(/xl:border-l/)
+})

packages/app/e2e/terminal/terminal-init.spec.ts

@@ -1,5 +1,6 @@
-import { test, expect } from "./fixtures"
-import { promptSelector, terminalSelector, terminalToggleKey } from "./utils"
+import { test, expect } from "../fixtures"
+import { promptSelector, terminalSelector } from "../selectors"
+import { terminalToggleKey } from "../utils"
 
 test("smoke terminal mounts and can create a second tab", async ({ page, gotoSession }) => {
   await gotoSession()

packages/app/e2e/terminal/terminal.spec.ts

@@ -1,5 +1,6 @@
-import { test, expect } from "./fixtures"
-import { terminalSelector, terminalToggleKey } from "./utils"
+import { test, expect } from "../fixtures"
+import { terminalSelector } from "../selectors"
+import { terminalToggleKey } from "../utils"
 
 test("terminal panel can be toggled", async ({ page, gotoSession }) => {
   await gotoSession()

packages/app/e2e/thinking-level.spec.ts

@@ -1,5 +1,5 @@
 import { test, expect } from "./fixtures"
-import { modelVariantCycleSelector } from "./utils"
+import { modelVariantCycleSelector } from "./selectors"
 
 test("smoke model variant cycle updates label", async ({ page, gotoSession }) => {
   await gotoSession()

packages/app/e2e/titlebar-history.spec.ts

@@ -1,52 +0,0 @@
-import { test, expect } from "./fixtures"
-import { modKey, promptSelector } 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()
-  const one = await sdk.session.create({ title: `e2e titlebar history 1 ${stamp}` }).then((r) => r.data)
-  const two = await sdk.session.create({ title: `e2e titlebar history 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)
-
-    const main = page.locator("main")
-    const collapsed = ((await main.getAttribute("class")) ?? "").includes("xl:border-l")
-    if (collapsed) {
-      await page.keyboard.press(`${modKey}+B`)
-      await expect(main).not.toHaveClass(/xl:border-l/)
-    }
-
-    const link = page.locator(`[data-session-id="${two.id}"] a`).first()
-    await expect(link).toBeVisible()
-    await link.scrollIntoViewIfNeeded()
-    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()
-  } finally {
-    await sdk.session.delete({ sessionID: one.id }).catch(() => undefined)
-    await sdk.session.delete({ sessionID: two.id }).catch(() => undefined)
-  }
-})

packages/app/e2e/tsconfig.json

@@ -2,7 +2,7 @@
   "extends": "../tsconfig.json",
   "compilerOptions": {
     "noEmit": true,
-    "types": ["node"]
+    "types": ["node", "bun"]
   },
   "include": ["./**/*.ts"]
 }

packages/app/e2e/utils.ts

@@ -10,10 +10,6 @@ export const serverName = `${serverHost}:${serverPort}`
 export const modKey = process.platform === "darwin" ? "Meta" : "Control"
 export const terminalToggleKey = "Control+Backquote"
 
-export const promptSelector = '[data-component="prompt-input"]'
-export const terminalSelector = '[data-component="terminal"]'
-export const modelVariantCycleSelector = '[data-action="model-variant-cycle"]'
-
 export function createSdk(directory?: string) {
   return createOpencodeClient({ baseUrl: serverUrl, directory, throwOnError: true })
 }

packages/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencode-ai/app",
-  "version": "1.1.45",
+  "version": "1.1.48",
   "description": "",
   "type": "module",
   "exports": {

packages/app/script/e2e-local.ts

@@ -58,7 +58,7 @@ const sandbox = await fs.mkdtemp(path.join(os.tmpdir(), "opencode-e2e-"))
 
 const serverEnv = {
   ...process.env,
-  OPENCODE_DISABLE_SHARE: "true",
+  OPENCODE_DISABLE_SHARE: process.env.OPENCODE_DISABLE_SHARE ?? "true",
   OPENCODE_DISABLE_LSP_DOWNLOAD: "true",
   OPENCODE_DISABLE_DEFAULT_PLUGINS: "true",
   OPENCODE_EXPERIMENTAL_DISABLE_FILEWATCHER: "true",

packages/app/src/components/session/session-header.tsx

@@ -167,7 +167,7 @@ export function SessionHeader() {
                     triggerAs={Button}
                     triggerProps={{
                       variant: "secondary",
-                      class: "rounded-sm w-[60px] h-[24px]",
+                      class: "rounded-sm h-[24px] px-3",
                       classList: { "rounded-r-none": shareUrl() !== undefined },
                       style: { scale: 1 },
                     }}

packages/app/src/components/settings-general.tsx

@@ -148,6 +148,7 @@ export const SettingsGeneral: Component = () => {
               description={language.t("settings.general.row.language.description")}
             >
               <Select
+                data-action="settings-language"
                 options={languageOptions()}
                 current={languageOptions().find((o) => o.value === language.locale())}
                 value={(o) => o.value}

packages/app/src/pages/layout.tsx

@@ -2285,6 +2285,8 @@ export default function Layout(props: ParentProps) {
       <button
         type="button"
         aria-label={projectName()}
+        data-action="project-switch"
+        data-project={base64Encode(props.project.worktree)}
         classList={{
           "flex items-center justify-center size-10 p-1 rounded-lg overflow-hidden transition-colors cursor-default": true,
           "bg-transparent border-2 border-icon-strong-base hover:bg-surface-base-hover": selected(),
@@ -2335,6 +2337,8 @@ export default function Layout(props: ParentProps) {
                     icon="circle-x"
                     variant="ghost"
                     class="shrink-0"
+                    data-action="project-close-hover"
+                    data-project={base64Encode(props.project.worktree)}
                     aria-label={language.t("common.close")}
                     onClick={(event) => {
                       event.stopPropagation()
@@ -2577,6 +2581,8 @@ export default function Layout(props: ParentProps) {
                       as={IconButton}
                       icon="dot-grid"
                       variant="ghost"
+                      data-action="project-menu"
+                      data-project={base64Encode(p.worktree)}
                       class="shrink-0 size-6 rounded-md opacity-0 group-hover/project:opacity-100 data-[expanded]:opacity-100 data-[expanded]:bg-surface-base-active"
                       aria-label={language.t("common.moreOptions")}
                     />
@@ -2604,7 +2610,11 @@ export default function Layout(props: ParentProps) {
                           </DropdownMenu.ItemLabel>
                         </DropdownMenu.Item>
                         <DropdownMenu.Separator />
-                        <DropdownMenu.Item onSelect={() => closeProject(p.worktree)}>
+                        <DropdownMenu.Item
+                          data-action="project-close-menu"
+                          data-project={base64Encode(p.worktree)}
+                          onSelect={() => closeProject(p.worktree)}
+                        >
                           <DropdownMenu.ItemLabel>{language.t("common.close")}</DropdownMenu.ItemLabel>
                         </DropdownMenu.Item>
                       </DropdownMenu.Content>
@@ -2814,6 +2824,7 @@ export default function Layout(props: ParentProps) {
       <div class="flex-1 min-h-0 flex">
         <nav
           aria-label={language.t("sidebar.nav.projectsAndSessions")}
+          data-component="sidebar-nav-desktop"
           classList={{
             "hidden xl:block": true,
             "relative shrink-0": true,
@@ -2873,6 +2884,7 @@ export default function Layout(props: ParentProps) {
           />
           <nav
             aria-label={language.t("sidebar.nav.projectsAndSessions")}
+            data-component="sidebar-nav-mobile"
             classList={{
               "@container fixed top-10 bottom-0 left-0 z-50 w-72 bg-background-base transition-transform duration-200 ease-out": true,
               "translate-x-0": layout.mobileSidebar.opened(),