Merge origin/master: session projection base, command channel, composer seats

Resolution follows the reattachment plan: the #587 wire layer (planMode/
setPlanMode RPC, prompt.planMode, client Session projection fences) is
dropped in favor of the session-projection base now on master; master
structure wins in all shared files. Kept from the PR side: the approval-only
pending filter in ChatView (questions render solely through the composer
takeover) and the auto-merged QuestionComposer improvements. The deleted
host/runtime package and retired test carriers are removed with master.

apps/web/tests/code-mode-fixture.snapshot.ts

@@ -0,0 +1,259 @@
+// @vitest-environment jsdom
+// Code Mode fixture snapshot over the BUILT client graph (the workspace-flow
+// idiom: real bundles via AppWebEntry, keyless FixtureApiClient transport).
+// Opens the fixture history session and pins the run_code turn's rendering:
+// the code-variant parent row titled by the model-authored description, its
+// three always-visible nested sub-rows (bash through the sample registration,
+// read through GenericToolCard, the failing read wearing the error state),
+// the expanded program body, inert bash / file-link sub-row gestures, and
+// the trajectory/waterfall tabs' sub-call cells and timing lanes.
+import { readFileSync } from 'node:fs'
+import { join } from 'node:path'
+import { act, cleanup, fireEvent, screen, waitFor, within } from '@testing-library/react'
+import { afterEach, beforeEach, expect, it, vi } from 'vitest'
+import type { WebBootEntry } from '@deepseek-ai/dsh-client-modules/client'
+import { AppWebEntry } from '@deepseek-ai/dsh-client-web'
+
+const PLUGINS: readonly (WebBootEntry & { dir: string })[] = [
+  { id: '@deepseek-ai/dsh-client-connection', dir: 'connection', url: '/plugins/connection.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-runtime', dir: 'runtime', url: '/plugins/runtime.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-connection'], immediately: true },
+  { id: '@deepseek-ai/dsh-client-ui-theme', dir: 'ui-theme', url: '/plugins/ui-theme.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-locale', dir: 'locale', url: '/plugins/locale.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-ui-layout', dir: 'ui-layout', url: '/plugins/ui-layout.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-runtime'] },
+  { id: '@deepseek-ai/dsh-client-ui-sidebar', dir: 'ui-sidebar', url: '/plugins/ui-sidebar.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout'] },
+  { id: '@deepseek-ai/dsh-client-ui-conversation', dir: 'ui-conversation', url: '/plugins/ui-conversation.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout'] },
+  {
+    id: '@deepseek-ai/dsh-client-ui-workspace',
+    dir: 'ui-workspace',
+    url: '/plugins/ui-workspace.js',
+    rev: 'fx',
+    inject: [
+      '@deepseek-ai/dsh-client-runtime',
+      '@deepseek-ai/dsh-client-ui-conversation',
+      '@deepseek-ai/dsh-client-ui-sidebar',
+    ],
+  },
+  { id: '@deepseek-ai/dsh-client-ui-trajectory', dir: 'ui-trajectory', url: '/plugins/ui-trajectory.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-conversation'] },
+]
+
+const bundles = new Map(PLUGINS.map(plugin => [
+  plugin.url,
+  readFileSync(join(process.cwd(), 'packages/client', plugin.dir, 'lib/client.js'), 'utf8'),
+]))
+
+interface FixtureWindow extends Window {
+  __DSH_BOOT__?: { rev: string; entries: WebBootEntry[] }
+  __ModuleLoader__?: unknown
+}
+
+class ResizeObserverStub {
+  observe(): void {}
+  disconnect(): void {}
+  unobserve(): void {}
+}
+
+const win = window as FixtureWindow
+let unmount: (() => void) | undefined
+
+beforeEach(() => {
+  localStorage.clear()
+  document.title = 'DeepSeek Harness'
+  vi.stubGlobal('ResizeObserver', ResizeObserverStub)
+  vi.stubGlobal('requestAnimationFrame', (callback: FrameRequestCallback) =>
+    setTimeout(() => { callback(0) }, 0) as unknown as number)
+  vi.stubGlobal('cancelAnimationFrame', (id: number) => { clearTimeout(id) })
+})
+
+afterEach(() => {
+  act(() => { unmount?.() })
+  unmount = undefined
+  cleanup()
+  delete win.__DSH_BOOT__
+  delete win.__ModuleLoader__
+  delete (globalThis as Record<string, unknown>).__fxTiming
+  document.body.innerHTML = ''
+  document.head.querySelectorAll('style[data-plugin]').forEach((style) => { style.remove() })
+  document.title = ''
+  history.replaceState(null, '', '/')
+  vi.unstubAllGlobals()
+})
+
+/** Boot the complete built client graph against the populated fixture branch. */
+function boot(): void {
+  history.replaceState(null, '', '/?fixture')
+  const root = document.createElement('div')
+  root.id = 'root'
+  document.body.appendChild(root)
+  win.__DSH_BOOT__ = { rev: 'fx', entries: PLUGINS.map(({ dir: _dir, ...plugin }) => plugin) }
+  act(() => {
+    const entry = new AppWebEntry(root, {
+      fetchBundle: (url) => {
+        const code = bundles.get(url)
+        return code === undefined ? Promise.reject(new Error(`missing built bundle ${url}`)) : Promise.resolve(code)
+      },
+      executeBundle: (code) => { (0, eval)(code) },
+    })
+    void entry.run()
+    unmount = () => { entry.dispose() }
+  })
+}
+
+/** Collapse decorative whitespace while preserving the text a user sees. */
+function visibleText(element: Element): string {
+  return (element.textContent ?? '').replace(/\s+/g, ' ').trim()
+}
+
+/** Open the fixture history session (the alpha log carrying the run_code turn) and scroll to its tail. */
+async function openFixtureSession(): Promise<void> {
+  const tree = await screen.findByRole('tree', { name: 'Sessions' }, { timeout: 10_000 })
+  const group = within(tree).getByText('4 sessions').closest<HTMLElement>('[role="treeitem"]')
+  if (group === null) throw new Error('fixture Workspace group missing')
+  if (group.getAttribute('aria-expanded') === 'false') {
+    fireEvent.click(within(group).getByText('fixture'))
+    await waitFor(() => {
+      expect(within(tree).getByText('4 sessions').closest('[role="treeitem"]')?.getAttribute('aria-expanded')).toBe('true')
+    })
+  }
+  const session = await within(tree).findByText('Fixture 历史会话')
+  fireEvent.click(session)
+  await waitFor(() => {
+    expect(document.querySelector('[data-variant="code"]')).not.toBeNull()
+  }, { timeout: 10_000 })
+}
+
+it('renders the fixture run_code turn: code parent row, nested sub-rows, error state', async () => {
+  boot()
+  await openFixtureSession()
+
+  const codeRoot = document.querySelector('[data-variant="code"]')
+  if (codeRoot === null) throw new Error('code-variant row missing')
+  const nest = codeRoot.closest('[class*="callRow"]')?.querySelector('[data-subcalls]')
+  if (nest === undefined || nest === null) throw new Error('sub-call nest missing under the code row')
+
+  expect({
+    parentRow: visibleText(codeRoot),
+    // The three sub-rows in dispatch order: bash rides the sample plugin's
+    // keyed registration (the same one a native top-level bash row uses),
+    // both reads ride GenericToolCard.
+    bashSample: nest.querySelector('[data-sample="bash-global"]') !== null,
+    subRows: [...nest.querySelectorAll(':scope > *')].map(visibleText),
+    errorSubRow: nest.querySelector('[data-state="error"]') !== null,
+  }).toMatchInlineSnapshot(`
+    {
+      "bashSample": true,
+      "errorSubRow": true,
+      "parentRow": "CodeRead the notes files and summarize",
+      "subRows": [
+        "BashList notes",
+        "Readnotes/demo.txt",
+        "Readnotes/missing.txt",
+      ],
+    }
+  `)
+})
+
+it('expands the code row into the program body; sub-row clicks do not open details', async () => {
+  boot()
+  await openFixtureSession()
+
+  // Expand: the leading control reveals the program (shiki-tokenized: the
+  // text splits into styled spans inside one <pre class="shiki"> tree).
+  const codeRoot = document.querySelector('[data-variant="code"]')
+  if (codeRoot === null) throw new Error('code-variant row missing')
+  const toggle = codeRoot.querySelector('button[aria-expanded]')
+  if (toggle === null) throw new Error('code row expand control missing')
+  fireEvent.click(toggle)
+  await waitFor(() => {
+    // Scope to THIS row: the markdown fixture turn also renders shiki pres.
+    const pre = codeRoot.querySelector('pre.shiki')
+    if (pre === null || !(pre.textContent ?? '').includes('const listing = await tools.bash')) {
+      throw new Error('highlighted program body missing under the code row')
+    }
+  })
+
+  // Tool rows no longer drive the details panel: bash is inert, file paths
+  // are host-open links (fixture openPath is a no-op success).
+  const nest = document.querySelector('[data-subcalls]')
+  if (nest === null) throw new Error('sub-call nest missing')
+  const bashRow = nest.querySelector('[data-sample="bash-global"]')
+  if (bashRow === null) throw new Error('bash sample sub-row missing')
+  const fileLink = nest.querySelector('button')
+  if (fileLink === null) throw new Error('file-path summary link missing on a read sub-row')
+  const frame = document.querySelector('[data-details-collapsed]')
+  if (frame === null) throw new Error('app frame missing')
+  expect(frame.getAttribute('data-details-collapsed')).toBe('true')
+  fireEvent.click(bashRow)
+  expect(frame.getAttribute('data-details-collapsed')).toBe('true')
+  fireEvent.click(fileLink)
+  expect(frame.getAttribute('data-details-collapsed')).toBe('true')
+  expect({
+    fileLink: visibleText(fileLink),
+    detailsCollapsed: frame.getAttribute('data-details-collapsed'),
+  }).toMatchInlineSnapshot(`
+    {
+      "detailsCollapsed": "true",
+      "fileLink": "notes/demo.txt",
+    }
+  `)
+})
+
+it('trajectory and waterfall surface the run_code sub-calls with real timing', async () => {
+  boot()
+  await openFixtureSession()
+
+  // Switch to the trajectory tab (same slot ring the chat view registers in).
+  fireEvent.click(await screen.findByRole('tab', { name: 'Trajectory' }))
+  await waitFor(() => {
+    expect(document.querySelector('[data-kind="subtool"]')).not.toBeNull()
+  }, { timeout: 10_000 })
+  const subCells = [...document.querySelectorAll('[data-kind="subtool"]')]
+  expect({
+    // Three Sub cells nested under the run_code Tool cell, in dispatch order,
+    // each with a real +N.Ns own-duration off the start/settle pair (the
+    // fixture spaces every event 800ms apart — never the em dash).
+    subCells: subCells.map(cell => visibleText(cell)),
+  }).toMatchInlineSnapshot(`
+    {
+      "subCells": [
+        "#51Subbash · {"command":"ls notes","description":"List notes"}+0.8s",
+        "#52Subread · {"path":"notes/demo.txt"}+0.8s",
+        "#53Subread · {"path":"notes/missing.txt"}+0.8s",
+      ],
+    }
+  `)
+
+  // Waterfall: each sub-call draws a measured lane scaled into the parent
+  // turn's dispatch window.
+  fireEvent.click(screen.getByRole('tab', { name: 'Waterfall' }))
+  await waitFor(() => {
+    expect(document.querySelector('[data-subspan]')).not.toBeNull()
+  }, { timeout: 10_000 })
+  const lanes = [...document.querySelectorAll('[data-subspan]')]
+  expect({
+    lanes: lanes.map(lane => ({
+      label: visibleText(lane.querySelector('[class*="subTag"]') ?? lane),
+      title: lane.querySelector('[data-timing]')?.getAttribute('title'),
+      timing: lane.querySelector('[data-timing]')?.getAttribute('data-timing'),
+    })),
+  }).toMatchInlineSnapshot(`
+    {
+      "lanes": [
+        {
+          "label": "bash",
+          "timing": "measured",
+          "title": "bash · 0.80s",
+        },
+        {
+          "label": "read",
+          "timing": "measured",
+          "title": "read · 0.80s",
+        },
+        {
+          "label": "read",
+          "timing": "measured",
+          "title": "read · 0.80s",
+        },
+      ],
+    }
+  `)
+})

apps/web/tests/code-mode-round.e2e.ts

@@ -0,0 +1,141 @@
+// Web e2e scenario: a Code Mode round trip. The scaffold boots the SAME
+// shipped tree with the tools row patched to mode: code (the run_code-only
+// wire), a real chromium sends a prompt engineered to elicit one run_code
+// program with several sub-calls, and the UI must render the code-variant
+// parent row with its always-visible nested sub-rows — each sub-row the same
+// component a native call renders through — plus details-panel resolution for
+// a clicked sub-row. Drive steps wait only on generic completion
+// (whenTurnSettled); assertion steps run in replay/refresh only.
+// Record: DSH_SNAPSHOT=record rewrites session.jsonl, then a keyless
+// DSH_SNAPSHOT=refresh regenerates ui.expected.md.
+import { readFile } from 'node:fs/promises'
+import { fileURLToPath } from 'node:url'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
+import type { SessionEvent } from '@deepseek-ai/dsh-session'
+import {
+  captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
+  launchWebScaffold, recordFixture, watchConsole, webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { connectFreshWorkspace, saveFailureShot } from './support.ts'
+
+const FIXTURE = fileURLToPath(new URL('./snapshots/code-mode-round/session.jsonl', import.meta.url))
+const UI_EXPECTED = fileURLToPath(new URL('./snapshots/code-mode-round/ui.expected.md', import.meta.url))
+const MODE = webSnapshotMode()
+
+// The scenario's one drive prompt: elicits one program with a bash sub-call
+// and a failing read the program tolerates — the sub-row set the assertions
+// (and the PR gif) need. Never asserted against model prose.
+const PROMPT = 'Using ONE run_code program: run bash `echo CODE_ROUND_OK`, then read the file missing.txt '
+  + 'catching its error in the program. Return an object with both outcomes. Then reply DONE and stop.'
+
+describe('web e2e: Code Mode round renders nested sub-calls', () => {
+  let scaffold: WebScaffold
+  let browser: Browser
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+  const sessionEvents: SessionEvent[] = []
+
+  beforeAll(async () => {
+    scaffold = await launchWebScaffold({
+      toolsMode: 'code',
+      ...(MODE === 'record' ? {} : { replayFixture: FIXTURE, paceMs: 15 }),
+    })
+    scaffold.ctx.on('session/event', (_session, event: SessionEvent) => { sessionEvents.push(event) })
+    browser = await chromium.launch()
+    page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    // Fresh world: connect a Workspace so the composer scenarios start live.
+    await connectFreshWorkspace(page)
+  }, 120_000)
+
+  afterAll(async () => {
+    await browser?.close()
+    await scaffold?.close()
+  })
+
+  it('drives the recorded prompt to a settled turn (all modes)', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-code-mode-drive'))
+    if (MODE !== 'record') {
+      // Drift guard: the committed fixture must carry exactly the drive prompt.
+      expect(fixtureUserPrompts(await readFile(FIXTURE, 'utf8'))).toEqual([PROMPT])
+    }
+    const input = page.locator('textarea').first()
+    await input.waitFor({ timeout: 10_000 })
+    const settled = scaffold.whenTurnSettled()
+    await input.fill(PROMPT)
+    await input.press('Enter')
+    const sessionId = await settled
+    if (MODE === 'record') {
+      await recordFixture(scaffold, sessionId, FIXTURE)
+    }
+  }, 200_000)
+
+  it.skipIf(MODE === 'record')('the durable log carries run_code with full-content sub-dispatches', () => {
+    // Wire discipline: code mode collapsed the call surface to run_code.
+    const calls = sessionEvents.filter(event => event.type === 'tool/call')
+    expect(calls.length).toBeGreaterThanOrEqual(1)
+    expect(new Set(calls.map(call => (call.data as { name: string }).name))).toEqual(new Set(['run_code']))
+    // Sub-dispatches logged with the complete tool/result vocabulary.
+    const dispatches = sessionEvents.filter(event => (event.type as string) === 'tool/code-dispatch')
+    expect(dispatches.length).toBeGreaterThanOrEqual(2)
+    for (const dispatch of dispatches) {
+      const data = dispatch.data as unknown as {
+        parentCallId: string
+        subCallId: string
+        name: string
+        isError: boolean
+        content: { type: string }[]
+      }
+      expect(data.subCallId.startsWith(`${data.parentCallId}:code:`)).toBe(true)
+      expect(Array.isArray(data.content)).toBe(true)
+      expect(typeof data.isError).toBe('boolean')
+    }
+    const bash = dispatches.find(dispatch => (dispatch.data as { name: string }).name === 'bash')
+    expect(bash).toBeDefined()
+    const bashContent = (bash!.data as { content: { type: string; text?: string }[] }).content
+    expect(bashContent.filter(block => block.type === 'text').map(block => block.text).join('')).toContain('CODE_ROUND_OK')
+  })
+
+  it.skipIf(MODE === 'record')('renders the code parent row with always-visible nested sub-rows', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-code-mode-rows'))
+    await expect.poll(() => page.getByText('DONE', { exact: true }).count(), { timeout: 15_000 }).toBeGreaterThanOrEqual(1)
+    // The parent run_code row wears the code variant with the model-authored
+    // description as its summary (the PR1 presentCall contract).
+    const codeRow = page.locator('[data-variant="code"]').first()
+    await codeRow.waitFor({ timeout: 10_000 })
+    // Nested rows are visible WITHOUT any expand interaction, inside the
+    // sub-call nest, each rendered by the same components as native rows:
+    // the bash sub-call landed in the bash sample registration.
+    const nest = page.locator('[data-subcalls]').first()
+    await nest.waitFor({ timeout: 10_000 })
+    expect(await nest.locator('[data-sample="bash-global"]').count()).toBeGreaterThanOrEqual(1)
+    // The failing read sub-call wears the same error state a native failed
+    // row wears (the recorded program tolerates a read of missing.txt).
+    expect(await nest.locator('[data-state="error"]').count()).toBeGreaterThanOrEqual(1)
+  }, 60_000)
+
+  it.skipIf(MODE === 'record')('a bash sub-row click leaves the details panel collapsed', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-code-mode-details'))
+    const nest = page.locator('[data-subcalls]').first()
+    const frame = page.locator('[data-details-collapsed], [class*="frame"]').first()
+    expect(await frame.getAttribute('data-details-collapsed')).not.toBeNull()
+    await nest.locator('[data-sample="bash-global"]').first().click()
+    // Tool rows no longer open details; the column stays width 0.
+    await expect.poll(() => frame.getAttribute('data-details-collapsed'), { timeout: 5_000 }).not.toBeNull()
+  })
+
+  it.skipIf(MODE === 'record')('matches the conversation aria golden with stable anchors', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-code-mode-aria'))
+    const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd)
+    await compareOrRefreshGolden(UI_EXPECTED, snapshot, MODE)
+  })
+
+  it.skipIf(MODE === 'record')('stayed clean: no page errors, no reconnect churn', () => {
+    expect(tripwire.pageErrors).toEqual([])
+    expect(tripwire.warnings).toEqual([])
+  })
+})

apps/web/tests/cordis-tool-round.e2e.ts

@@ -0,0 +1,130 @@
+// Web e2e scenario for the opt-in Cordis tools. Record mode drives a real
+// model through inspect, mount, and unmount; replay pins the same shipped Web
+// composition, durable calls, generic rows, highlighted Plugin source, and
+// conversation accessibility tree.
+import { readFile } from 'node:fs/promises'
+import { fileURLToPath } from 'node:url'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
+import type { SessionEvent } from '@deepseek-ai/dsh-session'
+import {
+  captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
+  launchWebScaffold, recordFixture, watchConsole, webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { connectFreshWorkspace, saveFailureShot } from './support.ts'
+
+const FIXTURE = fileURLToPath(new URL('./snapshots/cordis-tool-round/session.jsonl', import.meta.url))
+const UI_EXPECTED = fileURLToPath(new URL('./snapshots/cordis-tool-round/ui.expected.md', import.meta.url))
+const MODE = webSnapshotMode()
+const CORDIS_TOOLS = ['cordis_inspect', 'cordis_mount', 'cordis_unmount'] as const
+const MOUNT_CODE = 'return { name: "snapshot-noop", apply(ctx) {} }'
+const PROMPT = 'Use only Cordis tools. First call cordis_inspect with what "temporary". '
+  + `Then call cordis_mount with this exact code: ${JSON.stringify(MOUNT_CODE)}. `
+  + 'Read its returned id and call cordis_unmount with that exact id. '
+  + 'After all three calls succeed, reply exactly CORDIS_UI_DONE and stop.'
+
+function assertCompleteCordisLifecycle(events: readonly SessionEvent[]): void {
+  const turnEnd = events.findLast(
+    (event): event is Extract<SessionEvent, { type: 'turn/end' }> => event.type === 'turn/end',
+  )
+  const reason = turnEnd?.data.reason
+  const reasonSummary = reason?.kind === 'error'
+    ? { kind: reason.kind, code: reason.failure?.code, status: reason.failure?.status }
+    : { kind: reason?.kind }
+  expect(reasonSummary).toEqual({ kind: 'completed' })
+
+  const calls = events.filter(
+    (event): event is Extract<SessionEvent, { type: 'tool/call' }> => event.type === 'tool/call',
+  )
+  expect(calls.map(event => event.data.name)).toEqual(CORDIS_TOOLS)
+
+  const callIds = new Set(calls.map(event => String(event.data.callId)))
+  const results = events.filter(
+    (event): event is Extract<SessionEvent, { type: 'tool/result' }> =>
+      event.type === 'tool/result' && callIds.has(String(event.data.message.source.callId)),
+  )
+  expect(results).toHaveLength(CORDIS_TOOLS.length)
+  expect(results.every(event => !event.data.message.content[0].isError)).toBe(true)
+}
+
+describe('web e2e: Cordis tools use the generic row variants', () => {
+  let scaffold: WebScaffold
+  let browser: Browser
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+  const sessionEvents: SessionEvent[] = []
+
+  beforeAll(async () => {
+    scaffold = await launchWebScaffold({
+      cordisTools: true,
+      ...(MODE === 'record' ? {} : { replayFixture: FIXTURE, paceMs: 15 }),
+    })
+    scaffold.ctx.on('session/event', (_session, event: SessionEvent) => { sessionEvents.push(event) })
+    browser = await chromium.launch()
+    page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    await connectFreshWorkspace(page)
+  }, 120_000)
+
+  afterAll(async () => {
+    await browser?.close()
+    await scaffold?.close()
+  })
+
+  it('drives the recorded Cordis lifecycle to a settled turn (all modes)', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-cordis-drive'))
+    if (MODE !== 'record') {
+      expect(fixtureUserPrompts(await readFile(FIXTURE, 'utf8'))).toEqual([PROMPT])
+    }
+    const input = page.locator('textarea').first()
+    await input.waitFor({ timeout: 10_000 })
+    const settled = scaffold.whenTurnSettled()
+    await input.fill(PROMPT)
+    await input.press('Enter')
+    const sessionId = await settled
+    if (MODE === 'record') {
+      assertCompleteCordisLifecycle(sessionEvents)
+      await expect.poll(() => page.getByText('CORDIS_UI_DONE', { exact: true }).count(), { timeout: 15_000 })
+        .toBeGreaterThanOrEqual(1)
+      await recordFixture(scaffold, sessionId, FIXTURE)
+    }
+  }, 200_000)
+
+  it.skipIf(MODE === 'record')('the durable log carries one complete Cordis lifecycle', () => {
+    assertCompleteCordisLifecycle(sessionEvents)
+  })
+
+  it.skipIf(MODE === 'record')('renders Cordis lifecycle titles over the generic row mechanics', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-cordis-rows'))
+    await expect.poll(() => page.getByText('CORDIS_UI_DONE', { exact: true }).count(), { timeout: 15_000 })
+      .toBeGreaterThanOrEqual(1)
+
+    const inspectRow = page.locator('[data-tool="cordis_inspect"]').filter({ hasText: 'Inspect' }).first()
+    await inspectRow.waitFor({ timeout: 10_000 })
+
+    const mountRow = page.locator('[data-tool="cordis_mount"]').filter({ hasText: 'Mount temporary Plugin' }).first()
+    await mountRow.waitFor({ timeout: 10_000 })
+    await mountRow.locator('button[aria-expanded]').click()
+    await expect.poll(() => mountRow.locator('pre.shiki').textContent(), { timeout: 10_000 })
+      .toContain(MOUNT_CODE)
+
+    const unmountRow = page.locator('[data-tool="cordis_unmount"]').filter({ hasText: 'Unmount temporary Plugin' }).first()
+    await unmountRow.waitFor({ timeout: 10_000 })
+    await expect.poll(() => unmountRow.textContent()).toContain('dyn-')
+    await expect(unmountRow.getAttribute('data-state')).resolves.toBe('ok')
+  })
+
+  it.skipIf(MODE === 'record')('matches the conversation aria golden', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-cordis-aria'))
+    const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd)
+    await compareOrRefreshGolden(UI_EXPECTED, snapshot, MODE)
+  })
+
+  it.skipIf(MODE === 'record')('stayed clean: no page errors or reconnect churn', () => {
+    expect(tripwire.pageErrors).toEqual([])
+    expect(tripwire.warnings).toEqual([])
+  })
+})

apps/web/tests/lifecycle-chrome.e2e.ts

@@ -0,0 +1,165 @@
+// Web e2e scenarios: lifecycle & chrome — the workspace-aware first-send
+// flow over the real wire, reload recovery, and the dark-mode token cascade.
+// One tiny recorded turn (text-only) drives the whole spec: the empty-state
+// hero materializes a real Workspace + Session on first send (the jsdom
+// workspace-flow suite pins the object-layer state machine over the fixture
+// client; THIS spec pins the same flow through HTTP RPC + SSE + the host
+// gateway), reload replays everything from the log (zero further model
+// calls), and the theme scenario proves the shipped dark palette actually
+// cascades: attribute -> alias token flip -> painted surface change. Per the
+// lane's scope ruling there is no theme/layout golden (aria is color-blind);
+// the hero's waiting state gets the one golden here.
+import { readFile } from 'node:fs/promises'
+import { fileURLToPath } from 'node:url'
+import { join } from 'node:path'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
+import type { SessionEvent } from '@deepseek-ai/dsh-session'
+import {
+  acknowledgeReloadConnectionLoss, assertFixtureInventory, captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
+  launchWebScaffold, recordFixture, watchConsole, webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { connectFreshWorkspace, saveFailureShot } from './support.ts'
+
+const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/lifecycle-chrome', import.meta.url))
+const FIXTURE = join(SNAPSHOT_DIR, 'session.jsonl')
+const HERO_EXPECTED = join(SNAPSHOT_DIR, 'hero.expected.md')
+// Post-reload golden: the same settled conversation rebuilt purely from
+// persistence + history — byte-equal rendering is exactly the recovery claim.
+const RELOADED_EXPECTED = join(SNAPSHOT_DIR, 'reloaded.expected.md')
+const MODE = webSnapshotMode()
+
+const PROMPT = 'Reply with the single word LIGHTHOUSE and stop.'
+
+describe('web e2e: lifecycle & chrome (workspace flow / reload / dark mode)', () => {
+  let scaffold: WebScaffold
+  let browser: Browser
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+  const sessionEvents: SessionEvent[] = []
+
+  beforeAll(async () => {
+    scaffold = await launchWebScaffold(MODE === 'record' ? {} : { replayFixture: FIXTURE, paceMs: 15 })
+    scaffold.ctx.on('session/event', (_session, event: SessionEvent) => { sessionEvents.push(event) })
+    browser = await chromium.launch()
+    page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    // Fresh world: connect a Workspace so the composer scenarios start live.
+    await connectFreshWorkspace(page)
+  }, 120_000)
+
+  afterAll(async () => {
+    await browser?.close()
+    await scaffold?.close()
+  })
+
+  it('sends the first prompt from the empty-state hero (all modes)', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-lifecycle-send'))
+    if (MODE !== 'record') {
+      expect(fixtureUserPrompts(await readFile(FIXTURE, 'utf8'))).toEqual([PROMPT])
+    }
+    // The blank frame renders the hero, not the resident composer: the
+    // headline plus the guidance placeholder are the empty state's anchors.
+    await expect.poll(() => page.getByText("Let's start building", { exact: false }).count(), { timeout: 15_000 }).toBe(1)
+    const input = page.locator('textarea').first()
+    await input.waitFor({ timeout: 10_000 })
+    if (MODE !== 'record') {
+      // Golden of the hero's stable waiting state (captured before any send;
+      // the conversation-region goldens belong to the other scenarios).
+      const snapshot = await captureStableAria(page, '[class*="frame"]', scaffold.workspaceCwd)
+      await compareOrRefreshGolden(HERO_EXPECTED, snapshot, MODE)
+    }
+    const settled = scaffold.whenTurnSettled()
+    await input.fill(PROMPT)
+    await input.press('Enter')
+    const sessionId = await settled
+    if (MODE === 'record') {
+      await recordFixture(scaffold, sessionId, FIXTURE)
+    }
+  }, 200_000)
+
+  it.skipIf(MODE === 'record')('materialized a real Workspace and Session over the wire', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-lifecycle-materialize'))
+    // Browser: the sidebar tree now carries the auto-created workspace group
+    // with its one session, and the opened session is the selected row.
+    await expect.poll(() => page.getByText('1 session', { exact: true }).count(), { timeout: 15_000 }).toBeGreaterThanOrEqual(1)
+    await expect.poll(() => page.locator('[role="treeitem"][aria-selected="true"]').count(), { timeout: 10_000 }).toBe(1)
+    await expect.poll(() => page.getByText('LIGHTHOUSE', { exact: true }).count(), { timeout: 15_000 }).toBeGreaterThanOrEqual(1)
+    // Host: the session's durable header cwd is the workspace flow's
+    // create-by-name target (<workspaceRoot>/workspace, the composer's
+    // default draft name) — the proof the send went through workspace
+    // materialization rather than a bare default-cwd session.
+    const cwds = scaffold.ctx.sessions.list().map(session => session.header.cwd)
+    expect(cwds).toEqual([join(scaffold.workspaceCwd, 'workspace')])
+    const turnEnds = sessionEvents.filter(e => e.type === 'turn/end')
+    expect(turnEnds).toHaveLength(1)
+    expect((turnEnds[0] as SessionEvent & { data: { reason: { kind: string } } }).data.reason.kind).toBe('completed')
+  }, 60_000)
+
+  it.skipIf(MODE === 'record')('recovers the whole surface across a reload from the log alone', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-lifecycle-reload'))
+    // Fold a layout preference into the same reload: collapse the sidebar
+    // (persisted under dsh.layout.panels) before reloading.
+    await page.getByRole('button', { name: 'Collapse sidebar' }).click()
+    await expect.poll(() => page.getByRole('button', { name: 'Open sidebar' }).count(), { timeout: 10_000 }).toBe(1)
+    const warningStart = tripwire.warnings.length
+    await page.reload({ waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    acknowledgeReloadConnectionLoss(tripwire, warningStart)
+    // Layout persisted: the sidebar comes back collapsed.
+    await expect.poll(() => page.getByRole('button', { name: 'Open sidebar' }).count(), { timeout: 10_000 }).toBe(1)
+    // Selection persisted (dsh.sessions.current) and history replayed: the
+    // recorded turn re-renders from session.history with zero model calls —
+    // the replay cursor was fully consumed before the reload, so any stray
+    // request would fail the scenario loudly at close().
+    await expect.poll(() => page.getByText('LIGHTHOUSE', { exact: true }).count(), { timeout: 15_000 }).toBeGreaterThanOrEqual(1)
+    // Expand back and confirm the tree still lists the materialized session.
+    await page.getByRole('button', { name: 'Open sidebar' }).click()
+    await expect.poll(() => page.locator('[role="treeitem"][aria-selected="true"]').count(), { timeout: 10_000 }).toBe(1)
+    // Golden of the recovered conversation region: rebuilt from the log, it
+    // must render the same settled transcript the live turn produced.
+    const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd)
+    await compareOrRefreshGolden(RELOADED_EXPECTED, snapshot, MODE)
+    expect(tripwire.pageErrors).toEqual([])
+  }, 90_000)
+
+  it.skipIf(MODE === 'record')('cascades the dark theme from the body attribute to painted surfaces', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-lifecycle-dark'))
+    // This scenario pins the ThemeService's DOM contract seam directly (the
+    // body[data-ds-dark-theme] attribute -> stylesheet cascade); the REAL
+    // user gesture above it (Settings -> Appearance cubes) is owned by
+    // settings-chrome.e2e.ts. Driving the attribute here keeps the cascade
+    // pinned independently of the settings surface's own lifecycle.
+    const sample = async (): Promise<{ token: string; sidebarBg: string; bodyBg: string }> =>
+      await page.evaluate(() => {
+        const sidebar = document.querySelector('[class*="sidebar"], [class*="rail"]') ?? document.body
+        return {
+          token: getComputedStyle(document.body).getPropertyValue('--dsw-alias-bg-base').trim(),
+          sidebarBg: getComputedStyle(sidebar).backgroundColor,
+          bodyBg: getComputedStyle(document.body).backgroundColor,
+        }
+      })
+    const light = await sample()
+    await page.evaluate(() => { document.body.setAttribute('data-ds-dark-theme', '') })
+    const dark = await sample()
+    // The alias token itself must flip — the cascade's root fact.
+    expect(dark.token).not.toBe(light.token)
+    // And a real painted surface must consume it (not just variables in a
+    // void): at least one of the sampled backgrounds repaints.
+    expect(dark.sidebarBg !== light.sidebarBg || dark.bodyBg !== light.bodyBg).toBe(true)
+    // Removing the attribute restores the light values exactly (the palettes
+    // live in one stylesheet; activation is attribute-only by design).
+    await page.evaluate(() => { document.body.removeAttribute('data-ds-dark-theme') })
+    const restored = await sample()
+    expect(restored).toEqual(light)
+    expect(tripwire.pageErrors).toEqual([])
+  }, 60_000)
+
+  it.skipIf(MODE === 'record')('keeps the fixture inventory closed', async () => {
+    expect(tripwire.warnings).toEqual([])
+    await assertFixtureInventory(SNAPSHOT_DIR, ['session.jsonl', 'hero.expected.md', 'reloaded.expected.md'])
+  })
+})

apps/web/tests/live-interactions.e2e.ts

@@ -0,0 +1,211 @@
+// Web e2e scenarios: live-turn interactions — cancellation, error surfacing,
+// and transient-retry recovery, all through the real composition and wire.
+// The model seam is dsh-llm-replay with override sidecars: `hang` (+ a
+// readyFile marker) makes mid-stream cancel deterministic by construction,
+// `throw` entries express provider failures by stable code, and `{ patches }`
+// augmentation injects a transient throw before the recorded success so
+// llm-retry's recovery is proven end-to-end in the browser. Sidecar CONTENT
+// is authored here (single-sourced against the fixture via deriveReplayScript
+// — no committed copy of recorded chunks); the file is a per-run artifact in
+// the temp workspace. One recorded base fixture serves all three scenarios.
+import { mkdtemp, readFile, rm, writeFile } from 'node:fs/promises'
+import { existsSync } from 'node:fs'
+import { tmpdir } from 'node:os'
+import { fileURLToPath } from 'node:url'
+import { join } from 'node:path'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterEach, describe, expect, it, onTestFailed } from 'vitest'
+import { deriveReplayScript, parseSessionLog } from '@deepseek-ai/dsh-llm-replay'
+import type { ReplayOverrideDoc } from '@deepseek-ai/dsh-llm-replay'
+import type { SessionEvent } from '@deepseek-ai/dsh-session'
+import {
+  assertFixtureInventory, captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
+  launchWebScaffold, recordFixture, watchConsole, webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { connectFreshWorkspace, saveFailureShot } from './support.ts'
+
+const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/live-interactions', import.meta.url))
+const FIXTURE = join(SNAPSHOT_DIR, 'session.jsonl')
+// One golden per interactive end-state: what the user is left looking at
+// after cancel, after a non-retryable failure (pins the FIXME(web-error-surface)
+// gap as a reviewable artifact: NO error copy in the tree), and after retry
+// recovery — three genuinely different terminal surfaces of one fixture.
+const CANCEL_EXPECTED = join(SNAPSHOT_DIR, 'cancel.expected.md')
+const ERROR_EXPECTED = join(SNAPSHOT_DIR, 'error-auth.expected.md')
+const RETRY_EXPECTED = join(SNAPSHOT_DIR, 'retry.expected.md')
+const MODE = webSnapshotMode()
+
+// The recorded base: one text-only turn whose derived script the sidecars
+// patch. Kept deliberately tool-free so the derived script is exactly one
+// model call.
+const PROMPT = 'Reply with a one-sentence description of event sourcing, then stop.'
+
+/** turn/end reasons observed, in order. */
+function turnEndReasons(events: SessionEvent[]): string[] {
+  return events
+    .filter(e => e.type === 'turn/end')
+    .map(e => (e as SessionEvent & { data: { reason: { kind: string } } }).data.reason.kind)
+}
+
+describe('web e2e: live-turn interactions (cancel / error / retry)', () => {
+  let scaffold: WebScaffold | undefined
+  let browser: Browser | undefined
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+  let sessionEvents: SessionEvent[]
+  let sidecarDir: string | undefined
+
+  afterEach(async () => {
+    // scaffold.close() failures MUST fail the scenario: assertConsumed() is
+    // the fixture-drift tripwire and cleanup problems are real defects. Run
+    // every teardown step regardless, then rethrow what failed.
+    const failures: unknown[] = []
+    await browser?.close().catch((error: unknown) => failures.push(error))
+    browser = undefined
+    const closing = scaffold
+    scaffold = undefined
+    await closing?.close().catch((error: unknown) => failures.push(error))
+    if (sidecarDir !== undefined) await rm(sidecarDir, { recursive: true, force: true }).catch((error: unknown) => failures.push(error))
+    sidecarDir = undefined
+    if (failures.length === 1) throw failures[0]
+    if (failures.length > 1) throw new AggregateError(failures, 'live-interactions teardown failed')
+  })
+
+  /** Boot scaffold + page with an optional override doc materialized per run. */
+  async function launch(buildOverride?: (sidecarHome: string) => ReplayOverrideDoc): Promise<void> {
+    sessionEvents = []
+    let overridePath: string | undefined
+    if (buildOverride !== undefined) {
+      // The sidecar CONTENT is authored in this spec; the file is a per-run
+      // artifact minted in a spec-owned temp dir. It must exist BEFORE the
+      // scaffold boots — installLlmReplay resolves the script at install.
+      sidecarDir = await mkdtemp(join(tmpdir(), 'dsh-web-e2e-sidecar-'))
+      overridePath = join(sidecarDir, 'replay.override.json')
+      await writeFile(overridePath, JSON.stringify(buildOverride(sidecarDir)))
+    }
+    scaffold = await launchWebScaffold({
+      replayFixture: FIXTURE,
+      ...(overridePath === undefined ? {} : { replayOverride: overridePath }),
+    })
+    scaffold.ctx.on('session/event', (_session, event: SessionEvent) => { sessionEvents.push(event) })
+    browser = await chromium.launch()
+    page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    // Fresh world: connect a Workspace so the composer scenarios start live.
+    await connectFreshWorkspace(page)
+  }
+
+  /**
+   * Type the recorded prompt and send, with the settled barrier pre-armed.
+   * Returned WRAPPED ({ settled }) — a bare returned promise would be
+   * flattened by the caller's await, blocking on turn/end before the caller
+   * can act mid-turn (the cancel scenario's whole point).
+   */
+  async function sendPrompt(timeoutMs?: number): Promise<{ settled: ReturnType<WebScaffold['whenTurnSettled']> }> {
+    const input = page.locator('textarea').first()
+    await input.waitFor({ timeout: 10_000 })
+    const settled = scaffold!.whenTurnSettled(timeoutMs)
+    await input.fill(PROMPT)
+    await input.press('Enter')
+    return { settled }
+  }
+
+  it.skipIf(MODE !== 'record')('records the base fixture live through the composer', async () => {
+    await launch()
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-interactions-record'))
+    const { settled } = await sendPrompt(180_000)
+    const sessionId = await settled
+    await recordFixture(scaffold!, sessionId, FIXTURE)
+  }, 200_000)
+
+  it.skipIf(MODE === 'record')('cancels a hung stream deterministically via the readyFile marker', async () => {
+    expect(fixtureUserPrompts(await readFile(FIXTURE, 'utf8'))).toEqual([PROMPT])
+    let marker = ''
+    await launch((sidecarHome) => {
+      marker = join(sidecarHome, '.hang-ready')
+      return { patches: [{ at: 0, entry: { kind: 'hang', readyFile: marker } }] }
+    })
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-cancel'))
+    const { settled } = await sendPrompt()
+    // The marker IS the synchronization: the stream is provably parked in the
+    // hang (prefix chunks delivered to the loop) before the stop click.
+    await expect.poll(() => existsSync(marker), { timeout: 15_000 }).toBe(true)
+    await page.getByRole('button', { name: 'Stop generating' }).click()
+    await settled
+    expect(turnEndReasons(sessionEvents).at(-1)).toBe('aborted')
+    // Composer recovered; no streaming node lingers. The host settled first
+    // (awaited above), but the abort frame reaches the browser over SSE — the
+    // frozen-partial swap is eventually consistent, so poll rather than count.
+    await expect.poll(() => page.locator('textarea').first().isEnabled(), { timeout: 10_000 }).toBe(true)
+    await expect.poll(() => page.locator('[data-streaming="true"]').count(), { timeout: 10_000 }).toBe(0)
+    // Golden of the aborted end-state: the prompt bubble plus the frozen
+    // partial ('partial' is the hang entry's replayed prefix) and no more.
+    const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold!.workspaceCwd)
+    await compareOrRefreshGolden(CANCEL_EXPECTED, snapshot, MODE)
+    expect(tripwire.pageErrors).toEqual([])
+    expect(tripwire.warnings).toEqual([])
+  }, 120_000)
+
+  it.skipIf(MODE === 'record')('surfaces a non-retryable AUTH failure without retrying', async () => {
+    await launch(() => ({
+      patches: [{ at: 0, entry: { kind: 'throw', chunks: [], message: 'invalid api key', code: 'AUTH' } }],
+    }))
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-error-auth'))
+    const { settled } = await sendPrompt()
+    await settled
+    expect(turnEndReasons(sessionEvents).at(-1)).toBe('error')
+    // AUTH is outside llm-retry's retryable set: no retry record.
+    expect(sessionEvents.filter(e => e.type === 'llm/retry').length).toBe(0)
+    // Product gap found by this lane, pinned as-is: the client consumes no
+    // agent/error frames and a pre-chunk failure freezes no partial, so THIS
+    // failure renders no error copy anywhere — the user sees the send simply
+    // stop. FIXME(web-error-surface): assert visible error text here once the
+    // web UI grows an error rendering; until then the pinned contract is
+    // "no crash, composer recovers, turn logged as error".
+    await expect.poll(() => page.locator('textarea').first().isEnabled(), { timeout: 10_000 }).toBe(true)
+    expect(await page.locator('[data-streaming="true"]').count()).toBe(0)
+    // Golden of the same gap: the prompt bubble alone, no error copy in the
+    // tree — the diff that changes when web-error-surface lands.
+    const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold!.workspaceCwd)
+    await compareOrRefreshGolden(ERROR_EXPECTED, snapshot, MODE)
+    expect(tripwire.pageErrors).toEqual([])
+    expect(tripwire.warnings).toEqual([])
+  }, 120_000)
+
+  it.skipIf(MODE === 'record')('recovers a transient SERVER failure through llm-retry and completes', async () => {
+    const derived = deriveReplayScript(parseSessionLog(await readFile(FIXTURE, 'utf8')))
+    expect(derived).toHaveLength(1)
+    await launch(() => ({
+      patches: [
+        { at: 0, entry: { kind: 'throw', chunks: [], message: 'upstream 503', code: 'SERVER' } },
+        // Append the fixture's own success as the retry attempt — single-
+        // sourced from the recording, never copied into a committed sidecar.
+        { at: 1, entry: derived[0]! },
+      ],
+    }))
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-retry'))
+    // llm-retry backs off ~500ms before the second attempt.
+    const { settled } = await sendPrompt(60_000)
+    await settled
+    expect(turnEndReasons(sessionEvents).at(-1)).toBe('completed')
+    // The durable retry record proves the second attempt (request/header logs
+    // only on change, so attempt count is invisible there).
+    expect(sessionEvents.filter(e => e.type === 'llm/retry').length).toBeGreaterThanOrEqual(1)
+    await expect.poll(() => page.getByText('event sourcing', { exact: false }).count(), { timeout: 10_000 }).toBeGreaterThan(0)
+    // Golden of the recovered end-state: indistinguishable from a clean
+    // completion — retries are deliberately invisible in the transcript.
+    const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold!.workspaceCwd)
+    await compareOrRefreshGolden(RETRY_EXPECTED, snapshot, MODE)
+    expect(tripwire.pageErrors).toEqual([])
+    expect(tripwire.warnings).toEqual([])
+  }, 120_000)
+
+  it.skipIf(MODE === 'record')('keeps the fixture inventory closed', async () => {
+    await assertFixtureInventory(SNAPSHOT_DIR, [
+      'session.jsonl', 'cancel.expected.md', 'error-auth.expected.md', 'retry.expected.md',
+    ])
+  })
+})

apps/web/tests/navigation-panes.e2e.ts

@@ -0,0 +1,179 @@
+// Web e2e scenarios: navigation & panes — the view tabs (Trajectory /
+// Waterfall) and sidebar search, all over ONE rich two-turn seeded fixture
+// rendered purely from the log (the seeded-history pattern: zero model calls
+// in replay, so every surface here is the client fold + host history RPC,
+// not replay binding). The seed is recorded live under the standard
+// discipline: turn 1 produces a bash call plus two parallel reads in one
+// assistant message (tool-call density for the trajectory/waterfall lanes),
+// turn 2 a markdown-rich reply (a second turn so the waterfall has two lanes).
+import { mkdir, readFile, writeFile } from 'node:fs/promises'
+import { fileURLToPath } from 'node:url'
+import { join } from 'node:path'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
+import { parseSessionLog } from '@deepseek-ai/dsh-llm-replay'
+import type { SessionEvent } from '@deepseek-ai/dsh-session'
+import {
+  assertFixtureInventory, captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
+  launchWebScaffold, recordFixture, seedSession, watchConsole, webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { saveFailureShot } from './support.ts'
+
+const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/navigation-panes', import.meta.url))
+const SEED = join(SNAPSHOT_DIR, 'seed.jsonl')
+const TRAJECTORY_EXPECTED = join(SNAPSHOT_DIR, 'trajectory.expected.md')
+const WATERFALL_EXPECTED = join(SNAPSHOT_DIR, 'waterfall.expected.md')
+const MODE = webSnapshotMode()
+const SEED_ID = 'navigation-panes-web-e2e'
+
+// Turn 1 leads with a distinctive word: the session-title fallback takes the
+// first words of the first message, so the sidebar-search scenario has a
+// known-matching query ('navscenario') without depending on a live title call.
+const PROMPT_TURN1 = 'NavScenario: first run bash to print exactly NAVIGATION_OK, then read nav-a.md and nav-b.md using two read calls in ONE assistant message, then reply with the single word FIRST_DONE and stop.'
+const PROMPT_TURN2 = 'Reply in markdown with: a level-2 heading "Navigation Summary", a bulleted list of exactly two items, and a fenced code block containing echo WATERFALL. Then stop.'
+
+describe('web e2e: navigation & panes over a rich seeded session', () => {
+  let scaffold: WebScaffold
+  let browser: Browser
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+
+  beforeAll(async () => {
+    scaffold = await launchWebScaffold({})
+    // The workspace-aware flow runs sessions in <workspaceRoot>/workspace;
+    // the read targets must live in that session cwd (pre-creation is safe:
+    // create-by-name adopts an existing directory).
+    const sessionCwd = join(scaffold.workspaceCwd, 'workspace')
+    await mkdir(sessionCwd, { recursive: true })
+    await writeFile(join(sessionCwd, 'nav-a.md'), '# alpha nav\n')
+    await writeFile(join(sessionCwd, 'nav-b.md'), '# beta nav\n')
+    if (MODE !== 'record') {
+      const raw = await readFile(SEED, 'utf8')
+      expect(fixtureUserPrompts(raw), 'seed fixture must carry exactly the two drive prompts')
+        .toEqual([PROMPT_TURN1, PROMPT_TURN2])
+      await seedSession(scaffold, raw, SEED_ID)
+    }
+    browser = await chromium.launch()
+    page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+  }, 120_000)
+
+  afterAll(async () => {
+    await browser?.close()
+    await scaffold?.close()
+  })
+
+  it.skipIf(MODE !== 'record')('records the two-turn seed live through the composer', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-navigation-record'))
+    const input = page.locator('textarea').first()
+    await input.waitFor({ timeout: 10_000 })
+    let sessionId: Awaited<ReturnType<WebScaffold['whenTurnSettled']>> | undefined
+    for (const prompt of [PROMPT_TURN1, PROMPT_TURN2]) {
+      const settled = scaffold.whenTurnSettled()
+      // Turn 2 types into the same composer once turn 1 unlocks it.
+      await expect.poll(() => input.isEnabled(), { timeout: 15_000 }).toBe(true)
+      await input.fill(prompt)
+      await input.press('Enter')
+      sessionId = await settled
+    }
+    await recordFixture(scaffold, sessionId!, SEED)
+    // Fixture honesty: the recording must carry the shape the replay
+    // scenarios assert on — three calls in turn 1 and two closed turns.
+    const recorded = parseSessionLog(await readFile(SEED, 'utf8'))
+    expect(recorded.filter(e => e.type === 'turn/end')).toHaveLength(2)
+    const calls = recorded.filter((e): e is SessionEvent & { data: { name: string } } => e.type === 'tool/call')
+    expect(calls.map(e => e.data.name).sort()).toEqual(['bash', 'read', 'read'])
+  }, 400_000)
+
+  it.skipIf(MODE === 'record')('opens the seeded session and renders both turns from the log', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-navigation-open'))
+    // Expand the collapsed group row, then open the revealed session row.
+    const groupRow = page.locator('[role="treeitem"]').first()
+    await groupRow.waitFor({ timeout: 15_000 })
+    await groupRow.click()
+    const sessionRow = page.locator('[role="treeitem"]').nth(1)
+    await sessionRow.waitFor({ timeout: 10_000 })
+    await sessionRow.click()
+    await expect.poll(() => page.getByText('FIRST_DONE', { exact: true }).count(), { timeout: 15_000 }).toBeGreaterThanOrEqual(1)
+    await expect.poll(() => page.getByRole('heading', { name: 'Navigation Summary' }).count(), { timeout: 15_000 }).toBe(1)
+  }, 90_000)
+
+  it.skipIf(MODE === 'record')('filters the sidebar tree by title through the search box', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-navigation-search'))
+    // Runs after the session is open: a cold summary carries no title (the
+    // sidebar shows the cwd basename), and the durable title lands with the
+    // attach subscription's baseline — which is itself worth pinning: search
+    // matches the title the user sees, not a hidden cold field.
+    const search = page.getByPlaceholder('Search name, keywords', { exact: false })
+    await expect.poll(() => page.getByText('NavScenario', { exact: false }).count(), { timeout: 15_000 }).toBeGreaterThanOrEqual(1)
+    // Negative: a garbage query empties the tree (group rows hide too).
+    await search.fill('zzzqx-no-such-session')
+    await expect.poll(() => page.locator('[role="treeitem"]').count(), { timeout: 10_000 }).toBe(0)
+    // Positive: a title word narrows to the matched session + its group,
+    // force-expanded by search mode (case-insensitive client-side filter).
+    await search.fill('navscenario')
+    await expect.poll(() => page.locator('[role="treeitem"]').count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(2)
+    // Clear restores the unfiltered tree.
+    await page.getByRole('button', { name: 'Clear search' }).click()
+    await expect.poll(() => search.inputValue(), { timeout: 5_000 }).toBe('')
+    await expect.poll(() => page.locator('[role="treeitem"]').count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(1)
+  }, 60_000)
+
+  it.skipIf(MODE === 'record')('renders the trajectory tab with turn sections and step cells', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-navigation-trajectory'))
+    await page.getByRole('tab', { name: 'Trajectory' }).click()
+    // Two sticky turn sections; turn 1's step group summarizes its tool mix
+    // (bash + the two parallel reads collapse to 'bash read×2').
+    await expect.poll(() => page.getByText('Turn 1', { exact: true }).count(), { timeout: 15_000 }).toBe(1)
+    await expect.poll(() => page.getByText('Turn 2', { exact: true }).count(), { timeout: 10_000 }).toBe(1)
+    await expect.poll(() => page.getByText('bash read×2', { exact: false }).count(), { timeout: 10_000 }).toBe(1)
+    const snapshot = (await captureStableAria(page, '[class*="viewArea"]', scaffold.workspaceCwd))
+      .split(SEED_ID).join('{{seededId}}')
+    await compareOrRefreshGolden(TRAJECTORY_EXPECTED, snapshot, MODE)
+  }, 60_000)
+
+  it.skipIf(MODE === 'record')('renders the waterfall tab with span stats and one lane per span', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-navigation-waterfall'))
+    await page.getByRole('tab', { name: 'Waterfall' }).click()
+    // The stats header rides the waterfall body. The span fold counts THREE
+    // spans for this two-turn log: only assistant/steering nodes carry a turn
+    // number, so the first user message lands in a turn-0 prologue span (a
+    // P-I placeholder shape — pinned as-is; real spans are deferred to
+    // P-III per the view's deviation ledger). Calls: bash + two reads.
+    await expect.poll(() => page.getByText(/3 turns · \d+ steps · 3 tool calls/).count(), { timeout: 15_000 }).toBe(1)
+    // One lane per span, tagged by turn number, prologue included.
+    for (const tag of ['turn 0', 'turn 1', 'turn 2']) {
+      await expect.poll(() => page.getByText(tag, { exact: true }).count(), { timeout: 10_000 }).toBe(1)
+    }
+    const snapshot = (await captureStableAria(page, '[class*="viewArea"]', scaffold.workspaceCwd))
+      .split(SEED_ID).join('{{seededId}}')
+    await compareOrRefreshGolden(WATERFALL_EXPECTED, snapshot, MODE)
+  }, 60_000)
+
+  it.skipIf(MODE === 'record')('bash and file-path rows leave the details column collapsed', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-navigation-details'))
+    await page.getByRole('tab', { name: 'Chat' }).click()
+    const bashRow = page.locator('[data-sample="bash-global"]').first()
+    await bashRow.waitFor({ timeout: 15_000 })
+    const frame = page.locator('[data-details-collapsed], [class*="frame"]').first()
+    expect(await frame.getAttribute('data-details-collapsed')).not.toBeNull()
+    await bashRow.click()
+    await expect.poll(() => frame.getAttribute('data-details-collapsed'), { timeout: 5_000 }).not.toBeNull()
+    // Read summaries are host-open file links; they also must not open details.
+    const fileLink = page.locator('[data-variant="read"] button').first()
+    await fileLink.waitFor({ timeout: 10_000 })
+    await fileLink.click()
+    await expect.poll(() => frame.getAttribute('data-details-collapsed'), { timeout: 5_000 }).not.toBeNull()
+  }, 60_000)
+
+  it.skipIf(MODE === 'record')('issued zero model calls and stayed clean', async () => {
+    expect(tripwire.pageErrors).toEqual([])
+    expect(tripwire.warnings).toEqual([])
+    await assertFixtureInventory(SNAPSHOT_DIR, [
+      'seed.jsonl', 'trajectory.expected.md', 'waterfall.expected.md',
+    ])
+  })
+})

apps/web/tests/question-composer.e2e.ts

@@ -0,0 +1,154 @@
+// Web e2e scenario: the resident question composer. The shipped composition
+// already exposes ask_user_question (the ui-question row's node half mounts
+// the tool), so a recorded turn where the model asks blocks mid-turn on the
+// real userInteraction seam: the composer renders in the browser, the test
+// answers through it, and the turn completes with the answer in the log.
+// Replay is fully deterministic — the question content arrives from replayed
+// chunks, the composer wait is real, and the answer click is the test's own
+// gesture (the ONE place a drive step legitimately reacts to model content:
+// the turn cannot complete without it, in record and replay alike).
+import { readFile } from 'node:fs/promises'
+import { fileURLToPath } from 'node:url'
+import { join } from 'node:path'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
+import type { SessionEvent } from '@deepseek-ai/dsh-session'
+import {
+  assertFixtureInventory, captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
+  launchWebScaffold, recordFixture, watchConsole, webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { connectFreshWorkspace, saveFailureShot } from './support.ts'
+
+const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/question-composer', import.meta.url))
+const FIXTURE = join(SNAPSHOT_DIR, 'session.jsonl')
+const UI_EXPECTED = join(SNAPSHOT_DIR, 'ui.expected.md')
+// Second golden: the answered transcript — the question resolved into its
+// tool round trip and the final reply, the state the waiting golden cannot see.
+const ANSWERED_EXPECTED = join(SNAPSHOT_DIR, 'answered.expected.md')
+const MODE = webSnapshotMode()
+
+// The options carry long descriptions on purpose: the squeeze assertion below
+// needs option copy that WRAPS, which is the only shape that reproduces a
+// collapsed row painting its copy outside its own box.
+const PROMPT = 'Use the ask_user_question tool to ask me exactly one question with id "color", question "Which color do you prefer?", header "Pick one", and two options: label "Blue" with description "A cool recessive hue that reads as calm and trustworthy in long reading sessions and dense dashboards.", and label "Green" with description "A restful mid-spectrum hue with the highest perceived brightness, easiest on the eye over long sessions." After I answer, reply with the single word DONE and stop.'
+
+describe('web e2e: resident question composer round trip', () => {
+  let scaffold: WebScaffold
+  let browser: Browser
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+  const sessionEvents: SessionEvent[] = []
+
+  beforeAll(async () => {
+    scaffold = await launchWebScaffold(MODE === 'record' ? {} : { replayFixture: FIXTURE, paceMs: 15 })
+    scaffold.ctx.on('session/event', (_session, event: SessionEvent) => { sessionEvents.push(event) })
+    browser = await chromium.launch()
+    page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    // Fresh world: connect a Workspace so the composer scenarios start live.
+    await connectFreshWorkspace(page)
+  }, 120_000)
+
+  afterAll(async () => {
+    await browser?.close()
+    await scaffold?.close()
+  })
+
+  it('asks through the composer, answers, and completes with the answer logged', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-question'))
+    if (MODE !== 'record') {
+      expect(fixtureUserPrompts(await readFile(FIXTURE, 'utf8'))).toEqual([PROMPT])
+    }
+    const input = page.locator('textarea').first()
+    await input.waitFor({ timeout: 10_000 })
+    const settled = scaffold.whenTurnSettled(MODE === 'record' ? 180_000 : 30_000)
+    await input.fill(PROMPT)
+    await input.press('Enter')
+
+    // The composer takes over the input area while the tool blocks. Its
+    // presence is a STABLE waiting state (not a transient): it stays until
+    // answered, so a plain waitFor is race-free.
+    const composer = page.locator('[data-question-key]')
+    await composer.waitFor({ timeout: MODE === 'record' ? 120_000 : 30_000 })
+    await expect.poll(() => composer.getByText('Which color do you prefer?').count(), { timeout: 10_000 }).toBeGreaterThan(0)
+
+    if (MODE !== 'record') {
+      // This golden owns the stable question surface; the answered-state
+      // golden below owns the resulting transcript.
+      const snapshot = await captureStableAria(page, '[data-question-key]', scaffold.workspaceCwd)
+      await compareOrRefreshGolden(UI_EXPECTED, snapshot, MODE)
+    }
+
+    // Squeezed card: the option rows are the capped card's scroll content, so
+    // shrinking the seat must push overflow into the option list, never
+    // collapse a row below the height its own copy needs — a collapsed row
+    // paints its centered copy outside the row box, over the title and the
+    // neighbouring rows. Measured on the live composer at seat heights that
+    // force the cap, then restored for the answer gesture below. Replay only:
+    // record mode must reach the recording write below, not abort on layout.
+    if (MODE !== 'record') {
+      const original = page.viewportSize() ?? { width: 1680, height: 1000 }
+      for (const height of [520, 440, 380]) {
+        await page.setViewportSize({ width: 900, height })
+        const squeeze = await composer.evaluate((card) => {
+          // Role/ARIA selectors, not the CSS-module class names: the built
+          // client hashes those.
+          const rows = [...card.querySelectorAll<HTMLElement>(
+            '[role="radio"], [role="checkbox"], [aria-expanded]',
+          )]
+          const spill = rows.map(row => Math.max(...[...row.children].map((child) => {
+            const box = row.getBoundingClientRect()
+            const inner = child.getBoundingClientRect()
+            return Math.max(box.top - inner.top, inner.bottom - box.bottom)
+          })))
+          const list = rows[0]?.parentElement ?? null
+          return {
+            rows: rows.length,
+            spill: Math.max(...spill),
+            // Wrapped copy is the shape that overflows a collapsed row, and a
+            // scrolling list proves the seat is genuinely capped. Without both,
+            // the spill assertion would hold vacuously.
+            wrappedRows: rows.filter(row => row.getBoundingClientRect().height > 42).length,
+            scrolls: list === null ? false : list.scrollHeight > list.clientHeight,
+          }
+        })
+        expect(squeeze.rows).toBeGreaterThan(0)
+        expect(squeeze.wrappedRows).toBeGreaterThan(0)
+        expect(squeeze.scrolls).toBe(true)
+        // Sub-pixel tolerance: every row's copy stays inside its border box.
+        expect(squeeze.spill).toBeLessThan(0.6)
+      }
+      await page.setViewportSize(original)
+    }
+
+    await composer.getByRole('radio', { name: 'Blue' }).click()
+    // Submit: Enter on the focused option (the composer's documented submit).
+    await composer.getByRole('radio', { name: 'Blue' }).press('Enter')
+
+    const sessionId = await settled
+    if (MODE === 'record') {
+      await recordFixture(scaffold, sessionId, FIXTURE)
+      return
+    }
+    // World state: the tool result carries the chosen answer, and DONE lands.
+    const results = sessionEvents.filter(e => e.type === 'tool/result')
+    expect(JSON.stringify(results.at(-1))).toContain('Blue')
+    await expect.poll(() => page.getByText('DONE', { exact: true }).count(), { timeout: 15_000 }).toBeGreaterThanOrEqual(1)
+    // Composer gone; regular input restored.
+    expect(await page.locator('[data-question-key]').count()).toBe(0)
+    await expect.poll(() => page.locator('textarea').first().isEnabled(), { timeout: 10_000 }).toBe(true)
+    // Golden of the answered transcript: the ask_user_question round trip
+    // rendered as history (question tool row + DONE), composer takeover gone.
+    const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd)
+    await compareOrRefreshGolden(ANSWERED_EXPECTED, snapshot, MODE)
+    expect(tripwire.pageErrors).toEqual([])
+    expect(tripwire.warnings).toEqual([])
+  }, 200_000)
+
+  it.skipIf(MODE === 'record')('keeps the fixture inventory closed', async () => {
+    await assertFixtureInventory(SNAPSHOT_DIR, ['session.jsonl', 'ui.expected.md', 'answered.expected.md'])
+  })
+})

apps/web/tests/replay-round-trip.e2e.ts

@@ -0,0 +1,134 @@
+// Web e2e scenario: fresh round trip. A real chromium types a prompt into the
+// real composer; the wire, apiproxy, agent loop, and the REAL bash tool (echo
+// in the temp workspace) all run; the model seam is dsh-llm-replay (keyless)
+// or the live adapter (record). Drive steps run in every mode and wait only
+// on generic completion (whenTurnSettled — never model-content selectors, so
+// record cannot hang on a live model answering differently); assertion steps
+// run in replay/refresh only. Settled states only — streaming incrementality
+// is asserted from the persisted assistant/chunk events, not transient DOM.
+// Record: DSH_SNAPSHOT=record rewrites session.jsonl, then a keyless
+// DSH_SNAPSHOT=refresh regenerates ui.expected.md.
+import { readFile } from 'node:fs/promises'
+import { fileURLToPath } from 'node:url'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
+import type { SessionEvent } from '@deepseek-ai/dsh-session'
+import {
+  assertFixtureInventory, captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
+  launchWebScaffold, recordFixture, watchConsole, webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { connectFreshWorkspace, saveFailureShot } from './support.ts'
+
+const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/fresh-round-trip', import.meta.url))
+const FIXTURE = fileURLToPath(new URL('./snapshots/fresh-round-trip/session.jsonl', import.meta.url))
+const UI_EXPECTED = fileURLToPath(new URL('./snapshots/fresh-round-trip/ui.expected.md', import.meta.url))
+const MODE = webSnapshotMode()
+
+// The scenario's one drive prompt. Record sends it; replay asserts the
+// committed fixture recorded exactly it, so drive script and fixture cannot
+// drift apart.
+const PROMPT = 'Use the bash tool to run exactly: echo WEB_E2E_OK. Then reply with the single word DONE and stop.'
+
+describe('web e2e: fresh round trip through the real assembly', () => {
+  let scaffold: WebScaffold
+  let browser: Browser
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+  const sessionEvents: SessionEvent[] = []
+
+  beforeAll(async () => {
+    scaffold = await launchWebScaffold({
+      ...(MODE === 'record' ? {} : { replayFixture: FIXTURE, paceMs: 15 }),
+    })
+    scaffold.ctx.on('session/event', (_session, event: SessionEvent) => { sessionEvents.push(event) })
+    browser = await chromium.launch()
+    page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    // Fresh world: connect a Workspace so the composer scenarios start live.
+    await connectFreshWorkspace(page)
+  }, 120_000)
+
+  afterAll(async () => {
+    await browser?.close()
+    await scaffold?.close()
+  })
+
+  it('drives the recorded prompt to a settled turn (all modes)', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-round-trip'))
+    if (MODE !== 'record') {
+      // Drift guard: the committed fixture must carry exactly the drive prompt.
+      expect(fixtureUserPrompts(await readFile(FIXTURE, 'utf8'))).toEqual([PROMPT])
+    }
+    const input = page.locator('textarea').first()
+    await input.waitFor({ timeout: 10_000 })
+    // Arm the host-side settled barrier BEFORE the send click.
+    const settled = scaffold.whenTurnSettled()
+    await input.fill(PROMPT)
+    await input.press('Enter')
+    const sessionId = await settled
+    if (MODE === 'record') {
+      await recordFixture(scaffold, sessionId, FIXTURE)
+    }
+  }, 200_000)
+
+  it.skipIf(MODE === 'record')('rendered the settled turn: markdown, tool row, composer restore', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-round-trip-settled'))
+    // Browser settled-poll after host completion (host strictly precedes render).
+    await page.locator('[data-streaming="true"]').waitFor({ state: 'detached', timeout: 15_000 }).catch(() => {
+      // Chunks may coalesce into one commit; a never-mounted streaming node is
+      // legal — the chunk-event assertions below carry incrementality.
+    })
+    await expect.poll(() => page.getByText('DONE', { exact: true }).count(), { timeout: 15_000 }).toBeGreaterThanOrEqual(1)
+    // World state, not self-report: the real bash executor returned the exact
+    // command output, and the turn closed cleanly.
+    const bashCall = sessionEvents.find(event => event.type === 'tool/call' && event.data.name === 'bash')
+    if (bashCall?.type !== 'tool/call') throw new Error('the replayed turn did not call the bash tool')
+    const bashResult = sessionEvents.find(event =>
+      event.type === 'tool/result' && event.data.message.source.callId === bashCall.data.callId)
+    if (bashResult?.type !== 'tool/result') throw new Error('the bash tool call produced no durable result')
+    expect(bashResult.data.message.content[0].isError).toBe(false)
+    expect(bashResult.data.message.content[0].content.filter(block => block.type === 'text').map(block => block.text).join(''))
+      .toBe('WEB_E2E_OK\n')
+    const turnEnds = sessionEvents.filter(e => e.type === 'turn/end')
+    expect(turnEnds.length).toBe(1)
+    expect((turnEnds[0] as SessionEvent & { data: { reason: { kind: string } } }).data.reason.kind).toBe('completed')
+    // The persisted chunk events are the authoritative incrementality proof.
+    expect(sessionEvents.filter(e => e.type === 'assistant/chunk').length).toBeGreaterThan(10)
+  }, 60_000)
+
+  it.skipIf(MODE === 'record')('matches the conversation aria golden with stable anchors', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-round-trip-aria'))
+    // Anchor assertions survive a semantics-preserving component rewrite even
+    // while the whole-region golden churns.
+    await expect(page.getByRole('textbox').first().isVisible()).resolves.toBe(true)
+    expect(await page.getByText('WEB_E2E_OK', { exact: false }).count()).toBeGreaterThanOrEqual(1)
+    await page.getByRole('button', {
+      name: '选择模型，当前 DeepSeek-V4-Flash',
+    }).waitFor({ timeout: 10_000 })
+    const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd)
+    await compareOrRefreshGolden(UI_EXPECTED, snapshot, MODE)
+  })
+
+  it.skipIf(MODE === 'record')('expands and collapses the reasoning fold from its click target', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-round-trip-think'))
+    // Interaction over the REAL wire-delivered transcript (the fixture-client
+    // tier pins the same gesture against FixtureApiClient; this one runs on
+    // mux-frame-fed state). Runs after the golden capture so the committed
+    // aria surface stays the untouched settled state.
+    const think = page.getByRole('button', { name: /^Think/ }).first()
+    expect(await think.getAttribute('aria-expanded')).toBe('false')
+    await think.click()
+    await expect.poll(() => think.getAttribute('aria-expanded'), { timeout: 5_000 }).toBe('true')
+    await think.click()
+    await expect.poll(() => think.getAttribute('aria-expanded'), { timeout: 5_000 }).toBe('false')
+  })
+
+  it.skipIf(MODE === 'record')('stayed clean: no pageerrors, no reconnect self-healing, no server errors', async () => {
+    expect(tripwire.pageErrors).toEqual([])
+    expect(tripwire.warnings).toEqual([])
+    await assertFixtureInventory(SNAPSHOT_DIR, ['session.jsonl', 'ui.expected.md'])
+  })
+})

apps/web/tests/scaffold.ts

@@ -0,0 +1,482 @@
+// Shared scaffold for the keyless browser e2e lane (Agent Note:
+// .agents/notes/implemented/testing/2026-07-24-web-gui-browser-e2e-lane.md).
+// Boots the REAL web composition — the shipped apps/cli/cordis.yml through
+// the vendored Loader (the same include boot AppCLIEntry drives), patched the
+// snapshot way — so a real chromium exercises the real HTTP/SSE wire, the
+// api-gateway, agent loop, tools, and persistence. Modes ride $DSH_SNAPSHOT:
+// replay (default, keyless: llm-deepseek row disabled, dsh-llm-replay row
+// inserted in providers mode), record (real adapter + key, harvests fixtures
+// from live session memory), refresh (keyless replay that rewrites goldens).
+//
+// Composition divergences from `dsh web`, all deliberate, all via include
+// patches over the SAME tree (never a second yml): temp persistenceRoot;
+// workspace-context disabled (recorded fixtures must not embed this repo's
+// AGENTS.md); session-title-llm disabled (its fire-and-forget title call
+// would race the loop for the session's replay cursor); webserver pinned to
+// port 0 with the built dist; keyless modes disable llm-deepseek and fill
+// the open llm seam post-boot with installLlmReplay on the settled root ctx
+// (the plugin-row path discards the ReplayHandle; the direct install keeps
+// assertConsumed for the teardown fixture-consumption check).
+import { existsSync } from 'node:fs'
+import { mkdtemp, readFile, readdir, realpath, rm, utimes, writeFile } from 'node:fs/promises'
+import { tmpdir } from 'node:os'
+import { join, resolve } from 'node:path'
+import { pathToFileURL } from 'node:url'
+import type { Page } from 'playwright'
+import { expect } from 'vitest'
+import { Context } from 'cordis'
+import Loader from '@cordisjs/plugin-loader'
+import Include, { type PatchOptions } from '@cordisjs/plugin-include'
+import { scrubRequestHeaders } from '@deepseek-ai/dsh-acp-snapshot'
+import { assertEntriesLoaded } from '@deepseek-ai/dsh-app-boot'
+import type { ReplayHandle } from '@deepseek-ai/dsh-llm-replay'
+import { installLlmReplay, parseSessionLog } from '@deepseek-ai/dsh-llm-replay'
+import SessionStore, {
+  packChunkRuns,
+  SESSION_FORMAT_VERSION,
+  SessionId,
+  type Session,
+  type SessionEvent,
+  type SessionHeader,
+} from '@deepseek-ai/dsh-session'
+import SessionPersistenceJsonl from '@deepseek-ai/dsh-session-persistence-jsonl'
+import * as ToolCordis from '@deepseek-ai/dsh-tool-cordis'
+// Empty type imports carry the httpServer/agents/sessionPersistence Context merges.
+import type {} from '@deepseek-ai/dsh-host-webserver'
+import type {} from '@deepseek-ai/dsh-agent'
+import { DIST_INDEX, REPO_ROOT, requireDist } from './support.ts'
+
+/** Snapshot mode for the lane, from $DSH_SNAPSHOT (same vocabulary as the ACP/TUI suites). */
+export type WebSnapshotMode = 'replay' | 'record' | 'refresh'
+
+/**
+ * Resolve and validate the lane's snapshot mode.
+ * @returns the active mode; unset/empty selects replay.
+ */
+export function webSnapshotMode(): WebSnapshotMode {
+  const value = process.env.DSH_SNAPSHOT
+  if (value === undefined || value === '' || value === 'replay') return 'replay'
+  if (value === 'record' || value === 'refresh') return value
+  throw new Error(`DSH_SNAPSHOT must be replay, record, or refresh; got ${JSON.stringify(value)}`)
+}
+
+/** The shipped composition under test: apps/cli's config tree. */
+const CONFIG_PATH = join(REPO_ROOT, 'apps/cli/cordis.yml')
+
+// Replay publishes the provider catalog the gateway routes to (providers
+// mode, never catch-all: with llm-deepseek disabled no adapter exists, so a
+// catch-all would leave resolveModelInfo unroutable and compact-basic's
+// post-step pressure check would warn every step). The published
+// contextWindow keeps that pressure path provably inert for small fixtures.
+const REPLAY_PROVIDERS = [{
+  id: 'deepseek',
+  name: 'DeepSeek',
+  models: [{ id: 'deepseek-v4-flash', name: 'DeepSeek-V4-Flash', contextWindow: 128_000 }],
+}]
+
+/** A booted web scaffold: real composition, mode-selected model backend, temp world. */
+export interface WebScaffold {
+  /** The active snapshot mode this scaffold booted under. */
+  mode: WebSnapshotMode
+  /** Browser-facing origin (http://127.0.0.1:<bound port>). */
+  baseUrl: string
+  /** Settled root context (the in-process barrier seam; headless event subscription is its sanctioned use). */
+  ctx: Context
+  /** Temp project directory sessions run in (bash/fs tool cwd). */
+  workspaceCwd: string
+  /** Temp persistence root (seeded sessions land here through the real API). */
+  persistenceRoot: string
+  /** Await a settled turn end: in-process turn/end, then the agent's idle flip (which follows the persistence flush). */
+  whenTurnSettled(timeoutMs?: number): Promise<SessionId>
+  /** Tear everything down; asserts the replay fixture was fully consumed first (replay/refresh). */
+  close(): Promise<void>
+}
+
+/** Options for {@link launchWebScaffold}. */
+export interface LaunchOptions {
+  /**
+   * Replay fixture (session.jsonl) served by the inserted dsh-llm-replay row
+   * in replay/refresh modes; ignored in record mode (the real adapter
+   * answers). Omit for scenarios issuing no model calls — a stray stream then
+   * fails loud with NO_ADAPTER (llm-deepseek is disabled and no replay row
+   * mounts).
+   */
+  replayFixture?: string
+  /**
+   * Optional replay.override.json sidecar (whole-script replacement or
+   * `{ patches }` augmentation) for throw/hang scenarios not expressible as
+   * recorded chunks; replay/refresh only.
+   */
+  replayOverride?: string
+  /** Per-chunk replay pacing (ms) so the browser observes genuinely incremental SSE; replay/refresh only. */
+  paceMs?: number
+  /**
+   * Tool presentation mode patched onto the shipped `tools` row (`code`
+   * collapses the wire to run_code + the SDK prompt section). Omit for the
+   * yml default. The code runtime row is always in the tree, so no extra
+   * insertion is needed.
+   */
+  toolsMode?: 'native' | 'code' | 'both'
+  /**
+   * Insert the opt-in self-referential Cordis tools into the shipped tree.
+   * Record and replay use the same tool surface, so captured request headers
+   * remain reconstructable without making the tools a product default.
+   */
+  cordisTools?: boolean
+}
+
+/** Dispose the booted tree and remove both owned temp roots, reporting every independent cleanup failure. */
+async function cleanupScaffoldWorld(ctx: Context, workspaceCwd: string, persistenceRoot: string): Promise<unknown[]> {
+  const failures: unknown[] = []
+  await Promise.resolve(ctx.fiber.dispose()).catch((error: unknown) => failures.push(error))
+  await rm(workspaceCwd, { recursive: true, force: true }).catch((error: unknown) => failures.push(error))
+  await rm(persistenceRoot, { recursive: true, force: true }).catch((error: unknown) => failures.push(error))
+  return failures
+}
+
+/**
+ * Boot the real web composition under the current snapshot mode.
+ * @param options - replay fixture selection and pacing.
+ * @returns the running scaffold.
+ */
+export async function launchWebScaffold(options: LaunchOptions = {}): Promise<WebScaffold> {
+  requireDist()
+  const mode = webSnapshotMode()
+  if (mode === 'record') {
+    // Both owning vitest configs (web unconditionally, snapshot in record
+    // mode) load the repo-root .env before this file runs.
+    if (process.env.DEEPSEEK_API_KEY === undefined || process.env.DEEPSEEK_API_KEY.length === 0) {
+      throw new Error('web e2e record mode needs DEEPSEEK_API_KEY (env or repo-root .env)')
+    }
+  }
+  const workspaceCwd = await realpath(await mkdtemp(join(tmpdir(), 'dsh-web-e2e-ws-')))
+  let persistenceRoot: string
+  try {
+    persistenceRoot = await mkdtemp(join(tmpdir(), 'dsh-web-e2e-sessions-'))
+  } catch (error) {
+    const failures: unknown[] = [error]
+    await rm(workspaceCwd, { recursive: true, force: true }).catch((cleanupError: unknown) => failures.push(cleanupError))
+    if (failures.length > 1) throw new AggregateError(failures, 'web scaffold temp-root setup failed')
+    throw error
+  }
+
+  // The include patch set — the same mechanism AppCLIEntry and the ACP
+  // snapshot overlay use, applied over the SAME shipped tree (a patch id that
+  // stops matching a row fails the boot sweep loudly instead of drifting).
+  const patches: PatchOptions[] = [
+    { id: 'session-persistence-jsonl', config: { root: persistenceRoot } },
+    // storage-json's './.storages' yml default is cwd-relative and resolves
+    // per write; the scaffold restores the original cwd after boot, so the
+    // row gets an absolute temp root (removed with the workspace at close).
+    { id: 'storage-json', config: { root: join(workspaceCwd, '.dsh-storages') } },
+    // fs/bash cwd default to process.cwd(); the gateway injects the same
+    // value into session.cwd — chdir below anchors all three to the temp
+    // workspace, keeping the composition untouched.
+    { id: 'workspace-context', disabled: true },
+    { id: 'session-title-llm', disabled: true },
+    { id: 'webserver', config: { host: '127.0.0.1', port: 0, distIndex: DIST_INDEX } },
+    ...options.toolsMode === undefined ? [] : [{ id: 'tools', config: { mode: options.toolsMode } }],
+    ...options.cordisTools === true
+      ? [{ insert: [{ id: 'tool-cordis', name: 'cordis:tool-cordis' }] }]
+      : [],
+    ...mode === 'record' ? [] : [{ id: 'llm-deepseek', disabled: true }],
+  ]
+
+  // Sessions inherit the gateway's process.cwd() default; run the boot from
+  // the temp workspace so tool cwd, session cwd, and fixtures agree.
+  const originalCwd = process.cwd()
+  const ctx = new Context()
+  let port = 0
+  let replayHandle: ReplayHandle | undefined
+  try {
+    process.chdir(workspaceCwd)
+    ctx.baseUrl = pathToFileURL(join(resolve(CONFIG_PATH), '..')).href + '/'
+    await ctx.plugin(Loader)
+    ctx.loader.builtins.include = Include
+    // The shipped CLI deliberately has no dependency on this opt-in package.
+    // Keep the Loader row real without broadening the product installation.
+    if (options.cordisTools === true) ctx.loader.builtins['tool-cordis'] = ToolCordis
+    await ctx.loader.create({
+      name: 'cordis:include',
+      config: { path: pathToFileURL(resolve(CONFIG_PATH)).href, patches },
+    })
+    await ctx.loader.await()
+    assertEntriesLoaded(ctx, 'web e2e scaffold')
+    const boundPort = ctx.get('httpServer')?.port
+    if (boundPort === undefined) {
+      throw new Error('web e2e scaffold: httpServer service missing after settled boot')
+    }
+    port = boundPort
+
+    // Fill the open llm seam on the settled root ctx (llm-deepseek is disabled
+    // in keyless modes; a scenario with no fixture leaves the seam empty so a
+    // stray stream fails loud with NO_ADAPTER). The direct install, unlike the
+    // plugin row, returns the ReplayHandle for the teardown consumption check.
+    if (mode !== 'record' && options.replayFixture !== undefined) {
+      replayHandle = installLlmReplay(ctx, {
+        file: options.replayFixture,
+        providers: REPLAY_PROVIDERS,
+        ...(options.replayOverride === undefined ? {} : { overrideFile: options.replayOverride }),
+        ...(options.paceMs === undefined ? {} : { paceMs: options.paceMs }),
+      })
+    }
+  } catch (error) {
+    if (process.cwd() !== originalCwd) process.chdir(originalCwd)
+    const cleanupFailures = await cleanupScaffoldWorld(ctx, workspaceCwd, persistenceRoot)
+    if (cleanupFailures.length > 0) {
+      throw new AggregateError([error, ...cleanupFailures], 'web scaffold setup failed and cleanup was incomplete')
+    }
+    throw error
+  } finally {
+    if (process.cwd() !== originalCwd) process.chdir(originalCwd)
+  }
+
+  return {
+    mode,
+    baseUrl: `http://127.0.0.1:${port}`,
+    ctx,
+    workspaceCwd,
+    persistenceRoot,
+    // Barrier stack: the in-process turn/end identifies the session, then
+    // agent.whenIdle() covers the persistence flush (the idle flip follows
+    // the flush), and the caller's browser settled-poll comes last because
+    // host completion strictly precedes render.
+    whenTurnSettled(timeoutMs = mode === 'record' ? 180_000 : 30_000): Promise<SessionId> {
+      return new Promise<SessionId>((resolveSettled, reject) => {
+        const timer = setTimeout(() => {
+          off()
+          reject(new Error(`no turn/end within ${timeoutMs}ms`))
+        }, timeoutMs)
+        const off = ctx.on('session/event', (session: { id: SessionId }, event: SessionEvent) => {
+          if (event.type !== 'turn/end') return
+          clearTimeout(timer)
+          off()
+          const agent = ctx.agents.get(session.id)
+          if (agent === undefined) {
+            reject(new Error(`turn/end for ${session.id} but no live agent`))
+            return
+          }
+          agent.whenIdle().then(() => { resolveSettled(session.id) }, reject)
+        })
+      })
+    },
+    async close(): Promise<void> {
+      const failures: unknown[] = []
+      // Fixture-consumption check first, while the run's binding state is
+      // still authoritative — a scenario that drove fewer model calls than
+      // recorded fails here instead of drifting green.
+      try {
+        replayHandle?.assertConsumed()
+      } catch (error) {
+        failures.push(error)
+      }
+      failures.push(...await cleanupScaffoldWorld(ctx, workspaceCwd, persistenceRoot))
+      if (failures.length > 0) throw new AggregateError(failures, 'web scaffold teardown failed')
+    },
+  }
+}
+
+/**
+ * Serialize a live session to the canonical raw session-JSONL layout — the
+ * in-memory record-mode harvest, so the on-disk zstd default never matters.
+ */
+function rawSessionLog(session: Session): string {
+  return [
+    JSON.stringify({ type: 'session', ...session.header }),
+    ...packChunkRuns(session.events).map(record => JSON.stringify(record)),
+    '',
+  ].join('\n')
+}
+
+/**
+ * Record-mode fixture write-back: harvest the live session, scrub request
+ * headers to {{system}}/{{tools}} (TODO(web-header-pin): the web lane pins no
+ * header class — a deliberate deviation logged in the Agent Note's deferred
+ * work), tokenize the run-local session id, cwd, and browser RPC id
+ * ({{sessionId}}/{{cwd}}/{{rpcId}}, the committed fixture convention —
+ * re-records then diff only on real content), and write the fixture.
+ * @param scaffold - the record-mode scaffold.
+ * @param sessionId - the driven session.
+ * @param fixturePath - the committed session.jsonl / seed.jsonl target.
+ */
+export async function recordFixture(scaffold: WebScaffold, sessionId: SessionId, fixturePath: string): Promise<void> {
+  const agent = scaffold.ctx.agents.get(sessionId)
+  if (agent === undefined) throw new Error(`record harvest: no live agent for ${sessionId}`)
+  const tokenized = scrubRequestHeaders(rawSessionLog(agent.session))
+    .split(sessionId).join('{{sessionId}}')
+    .split(scaffold.workspaceCwd).join('{{cwd}}')
+    .replace(/"rpcId":"[^"]+"/g, '"rpcId":"{{rpcId}}"')
+  await writeFile(fixturePath, tokenized)
+}
+
+/**
+ * The user prompts recorded in a fixture, in order — the single source tying
+ * spec drive steps to recorded reality so script and fixture cannot drift.
+ * @param fixtureText - raw session.jsonl contents.
+ * @returns the recorded user prompt texts.
+ */
+export function fixtureUserPrompts(fixtureText: string): string[] {
+  return parseSessionLog(fixtureText).flatMap((event) => {
+    if (event.type !== 'user/message' || event.data.source.kind !== 'user') return []
+    const text = event.data.content.filter(block => block.type === 'text').map(block => block.text).join('')
+    return text.length > 0 ? [text] : []
+  })
+}
+
+/**
+ * Seed a recorded session fixture into the scaffold's persistence root
+ * through the REAL backend API (throwaway Context + SessionStore + JSONL
+ * plugin — the semantic-checkpoint precedent), never raw file writes: no
+ * knowledge of bucket hashing, filename encoding, or compression, and
+ * malformed shapes fail loud at seed time. The fixture's tokenized identity
+ * ({{sessionId}}/{{cwd}}) is realized for this world before parsing.
+ * @param scaffold - the target scaffold.
+ * @param fixtureText - raw recorded session.jsonl contents.
+ * @param id - the seeded session id (stable for deterministic goldens).
+ * @returns the seeded id.
+ */
+export async function seedSession(scaffold: WebScaffold, fixtureText: string, id: string): Promise<SessionId> {
+  const realized = fixtureText
+    .split('{{sessionId}}').join(id)
+    .split('{{cwd}}').join(scaffold.workspaceCwd)
+  const fixtureCwd = (JSON.parse(realized.split('\n', 1)[0]!) as { cwd?: string }).cwd
+  const rewritten = fixtureCwd === undefined
+    ? realized
+    : realized.split(fixtureCwd).join(scaffold.workspaceCwd)
+  const events = parseSessionLog(rewritten)
+  if (events.length === 0) throw new Error('seed fixture has no events')
+  const last = events[events.length - 1]!
+  // An open final turn would be mutated by resume's crash repair on first
+  // open; a committed seed must be a closed recording.
+  if (last.type !== 'turn/end') throw new Error(`seed fixture must end in turn/end, got ${last.type}`)
+  const meta: SessionHeader = {
+    version: SESSION_FORMAT_VERSION,
+    id: SessionId(id),
+    createdAt: Date.now() - 60_000,
+    cwd: scaffold.workspaceCwd,
+    delegationDepth: 0,
+  }
+  const seeder = new Context()
+  try {
+    await seeder.plugin(SessionStore)
+    // Same root as the booted tree with the plugin's own default compression,
+    // so the host's directory-scan list() sees one consistent encoding.
+    await seeder.plugin(SessionPersistenceJsonl, { root: scaffold.persistenceRoot })
+    await seeder.sessionPersistence.create(meta)
+    await seeder.sessionPersistence.append(meta.id, events)
+    // Deterministic sidebar order: cold summaries take updatedAt from mtime.
+    const located = seeder.sessionPersistence.locate(meta)
+    if (located !== undefined) {
+      const backdated = new Date(meta.createdAt)
+      await utimes(located.path, backdated, backdated)
+    }
+  } finally {
+    await seeder.fiber.dispose()
+  }
+  return meta.id
+}
+
+/**
+ * Normalize an aria snapshot: uuid, cwd, workspace-basename, and duration
+ * volatility collapse to stable tokens.
+ */
+function normalizeAria(snapshot: string, workspaceCwd: string): string {
+  // The header breadcrumb renders the workspace's basename, not the full
+  // path, so both spellings must collapse to the token.
+  const base = workspaceCwd.split('/').pop()!
+  return snapshot
+    .split(workspaceCwd).join('{{cwd}}')
+    .split(base).join('{{workspace}}')
+    .replace(/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}/gi, '{{uuid}}')
+    .replace(/\b\d+(?:\.\d+)?(?:ms|s|秒)\b/g, '{{duration}}')
+}
+
+/**
+ * Capture the region's aria snapshot at a settled milestone: poll until two
+ * consecutive normalized captures are equal — a single-shot capture races the
+ * last React commits.
+ * @param page - the page under test.
+ * @param selector - the region locator selector.
+ * @param workspaceCwd - normalization input.
+ * @returns the stable normalized snapshot.
+ */
+export async function captureStableAria(page: Page, selector: string, workspaceCwd: string): Promise<string> {
+  const region = page.locator(selector).first()
+  let previous = normalizeAria(await region.ariaSnapshot(), workspaceCwd)
+  await expect.poll(async () => {
+    const current = normalizeAria(await region.ariaSnapshot(), workspaceCwd)
+    const stable = current === previous
+    previous = current
+    return stable
+  }, { timeout: 5_000, message: 'aria snapshot did not stabilize' }).toBe(true)
+  return previous
+}
+
+/**
+ * Compare a normalized golden, or rewrite it under refresh. Refresh is the
+ * ONLY writer: a missing golden in replay mode fails with the healing command
+ * instead of silently self-bootstrapping.
+ * @param goldenPath - the committed ui.expected.md path.
+ * @param actual - the stable normalized snapshot.
+ * @param mode - the active snapshot mode.
+ */
+export async function compareOrRefreshGolden(goldenPath: string, actual: string, mode: WebSnapshotMode): Promise<void> {
+  const payload = `${actual}\n`
+  if (mode === 'refresh') {
+    await writeFile(goldenPath, payload)
+    return
+  }
+  if (!existsSync(goldenPath)) {
+    throw new Error(`missing golden ${goldenPath} — run DSH_SNAPSHOT=refresh pnpm run test:web to generate it`)
+  }
+  expect(payload).toBe(await readFile(goldenPath, 'utf8'))
+}
+
+/**
+ * Fixture-inventory guard (the TUI afterAll shape): the scenario directory
+ * holds exactly the expected files and every committed JSONL is a scrub
+ * fixed-point without a run-local browser RPC id.
+ * @param dir - the scenario snapshot directory.
+ * @param expected - the exact expected file inventory.
+ */
+export async function assertFixtureInventory(dir: string, expected: string[]): Promise<void> {
+  const entries = (await readdir(dir)).sort()
+  expect(entries).toEqual([...expected].sort())
+  for (const entry of entries.filter(name => name.endsWith('.jsonl'))) {
+    const content = await readFile(join(dir, entry), 'utf8')
+    expect(scrubRequestHeaders(content), `${dir}/${entry} carries request-header bulk`).toBe(content)
+    expect(content, `${dir}/${entry} carries a run-local rpcId`)
+      .not.toMatch(/"rpcId":"(?!\{\{rpcId\}\})[^"]+"/)
+  }
+}
+
+/**
+ * Console tripwires: reconnect/gap-repair self-healing or a pageerror must
+ * fail the scenario, not mask a dead wire behind eventual consistency.
+ * @param page - the page under test.
+ * @returns live warning/pageerror collectors to assert empty at scenario end.
+ */
+export function watchConsole(page: Page): { warnings: string[]; pageErrors: string[] } {
+  const warnings: string[] = []
+  const pageErrors: string[] = []
+  page.on('console', (message) => {
+    const text = message.text()
+    if (/connection lost|gap repair|discontinuous/i.test(text)) warnings.push(text)
+  })
+  page.on('pageerror', (error) => { pageErrors.push(String(error)) })
+  return { warnings, pageErrors }
+}
+
+/**
+ * Remove only connection-loss warnings emitted after an intentional reload.
+ * Earlier warnings and all gap-repair/discontinuity warnings remain fatal.
+ * @param tripwire - the live console-warning collector.
+ * @param warningStart - warning count captured immediately before reloading.
+ */
+export function acknowledgeReloadConnectionLoss(
+  tripwire: ReturnType<typeof watchConsole>,
+  warningStart: number,
+): void {
+  const reloadWarnings = tripwire.warnings.splice(warningStart)
+  tripwire.warnings.push(...reloadWarnings.filter(text => !/connection lost/i.test(text)))
+}

apps/web/tests/seeded-history.e2e.ts

@@ -0,0 +1,157 @@
+// Web e2e scenario: seeded history. A recorded session seeded cold through
+// the REAL persistence API renders purely from the log — the surface nothing
+// else covers: sidebar cold listing, the implicit resume/attach inside the
+// history RPC, history-page tool views, and the client fold of historical
+// events — with ZERO model calls in replay (no replay fixture; a stray stream
+// fails loud on the open llm seam). The seed is a recorded fixture under the
+// same record discipline as every other: DSH_SNAPSHOT=record drives the turn
+// live through the composer (real read tool against seeded workspace files)
+// and harvests seed.jsonl; replay/refresh seed it cold and only render.
+import { readFile, writeFile, mkdir } from 'node:fs/promises'
+import { fileURLToPath } from 'node:url'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
+import { join } from 'node:path'
+import {
+  assertFixtureInventory, captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
+  launchWebScaffold, recordFixture, seedSession, watchConsole, webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { saveFailureShot } from './support.ts'
+
+const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/seeded-history', import.meta.url))
+const SEED = fileURLToPath(new URL('./snapshots/seeded-history/seed.jsonl', import.meta.url))
+const UI_EXPECTED = fileURLToPath(new URL('./snapshots/seeded-history/ui.expected.md', import.meta.url))
+const MODE = webSnapshotMode()
+const SEED_ID = 'seeded-history-web-e2e'
+
+const PROMPT = 'Use the read tool twice in one assistant message: read a.txt and b.txt. Then reply with the single word DONE and stop.'
+
+describe('web e2e: seeded history renders through cold resume', () => {
+  let scaffold: WebScaffold
+  let browser: Browser
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+
+  beforeAll(async () => {
+    scaffold = await launchWebScaffold({})
+    // The workspace-aware flow runs sessions in <workspaceRoot>/workspace
+    // (the composer's default draft name); the read-tool targets must live in
+    // that session cwd. Pre-creating the directory is safe: create-by-name
+    // adopts an existing directory.
+    const sessionCwd = join(scaffold.workspaceCwd, 'workspace')
+    await mkdir(sessionCwd, { recursive: true })
+    await writeFile(join(sessionCwd, 'a.txt'), 'alpha\n')
+    await writeFile(join(sessionCwd, 'b.txt'), 'beta\n')
+    if (MODE !== 'record') {
+      const raw = await readFile(SEED, 'utf8')
+      expect(fixtureUserPrompts(raw), 'seed fixture must carry exactly the drive prompt').toEqual([PROMPT])
+      await seedSession(scaffold, raw, SEED_ID)
+    }
+    browser = await chromium.launch()
+    page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+  }, 120_000)
+
+  afterAll(async () => {
+    await browser?.close()
+    await scaffold?.close()
+  })
+
+  it.skipIf(MODE !== 'record')('records the seed turn live through the composer', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-seeded-record'))
+    const input = page.locator('textarea').first()
+    await input.waitFor({ timeout: 10_000 })
+    const settled = scaffold.whenTurnSettled()
+    await input.fill(PROMPT)
+    await input.press('Enter')
+    const sessionId = await settled
+    await recordFixture(scaffold, sessionId, SEED)
+  }, 200_000)
+
+  it.skipIf(MODE === 'record')('serves the projections baseline on the real composition tail page', async () => {
+    // Composition regression tripwire: the projection registry must be a row
+    // in the SHIPPED cordis.yml — with it absent every domain unit's optional
+    // injection stays silent and this block disappears (no titles/todos on
+    // the web), while fixture-level suites stay green. Assert through the
+    // real HTTP wire against the booted real host.
+    const response = await fetch(`${scaffold.baseUrl}/api/session.history`, {
+      method: 'POST',
+      headers: { 'content-type': 'application/json' },
+      body: JSON.stringify({
+        type: 'client-request', rpcId: 'seeded-projections', method: 'session.history',
+        payload: { sessionId: SEED_ID },
+      }),
+    })
+    expect(response.ok).toBe(true)
+    const body = await response.json() as {
+      result: { ok: boolean; value?: { projections?: { asOfSeq: number; values: Record<string, unknown> } } }
+    }
+    expect(body.result.ok).toBe(true)
+    const projections = body.result.value?.projections
+    expect(projections).toBeDefined()
+    expect(projections?.asOfSeq).toBeGreaterThanOrEqual(0)
+    // The seed carries a session/title event: the title unit must serve it.
+    expect(typeof projections?.values.title).toBe('string')
+    // tool-todo is composed but the seed has no todo/write: whole-value null,
+    // key PRESENT (absence would mean the unit never registered).
+    expect(projections?.values).toHaveProperty('todos', null)
+  })
+
+  it.skipIf(MODE === 'record')('lists the seeded session cold and renders its history from the log', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-seeded-history'))
+    // The sidebar tree collapses workspace groups by default: click the group
+    // row (treeitem 0) to expand, then the revealed session row.
+    const groupRow = page.locator('[role="treeitem"]').first()
+    await groupRow.waitFor({ timeout: 15_000 })
+    await groupRow.click()
+    const sessionRow = page.locator('[role="treeitem"]').nth(1)
+    await sessionRow.waitFor({ timeout: 10_000 })
+    await sessionRow.click()
+    // Settled barrier for history: the recorded final assistant text renders.
+    await expect.poll(() => page.getByText('DONE', { exact: true }).count(), { timeout: 15_000 }).toBe(1)
+    // Tool cards render from logged tool/call + tool/result alone (views are
+    // host-recomputed per page; the generic card is the documented default).
+    const toolRows = page.locator('[data-variant], [data-sample]')
+    await expect.poll(() => toolRows.count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(2)
+    expect(await page.getByText('a.txt', { exact: false }).count()).toBeGreaterThan(0)
+  }, 60_000)
+
+  it.skipIf(MODE === 'record')('matches the historical conversation aria golden', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-seeded-aria'))
+    await page.getByRole('button', {
+      // This scenario deliberately leaves the LLM seam open to prove zero
+      // model calls. History still restores the selected id, but no catalog
+      // adapter exists to provide its presentation name.
+      name: '选择模型，当前 deepseek-v4-flash',
+    }).waitFor({ timeout: 10_000 })
+    const snapshot = (await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd))
+      .split(SEED_ID).join('{{seededId}}')
+    await compareOrRefreshGolden(UI_EXPECTED, snapshot, MODE)
+  })
+
+  it.skipIf(MODE === 'record')('file-path tool rows rebuilt from the cold log stay details-inert', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-seeded-toolrow'))
+    // Interaction over cold-resumed history: read summaries are host-open
+    // file links (not expand-in-place / not details). Runs after the golden
+    // capture; still zero model calls.
+    const fileLink = page.locator('[data-variant="read"] button').first()
+    await fileLink.waitFor({ timeout: 10_000 })
+    const frame = page.locator('[data-details-collapsed], [class*="frame"]').first()
+    expect(await frame.getAttribute('data-details-collapsed')).not.toBeNull()
+    await fileLink.click()
+    await expect.poll(() => frame.getAttribute('data-details-collapsed'), { timeout: 5_000 }).not.toBeNull()
+    // Path label survives from the recorded args (a.txt).
+    await expect.poll(() => page.getByText('a.txt', { exact: false }).count(), { timeout: 5_000 }).toBeGreaterThan(0)
+  })
+
+  it.skipIf(MODE === 'record')('issued zero model calls and stayed clean', async () => {
+    // No replay fixture was installed and the llm seam is open — any stray
+    // stream would have failed the turn loudly. Cleanliness pins the wire.
+    expect(tripwire.pageErrors).toEqual([])
+    expect(tripwire.warnings).toEqual([])
+    await assertFixtureInventory(SNAPSHOT_DIR, ['seed.jsonl', 'ui.expected.md'])
+  })
+})

apps/web/tests/session-title.snapshot.ts

@@ -3,18 +3,24 @@ import { readFileSync } from 'node:fs'
 import { join } from 'node:path'
 import { act, cleanup, fireEvent, screen, waitFor, within } from '@testing-library/react'
 import { afterEach, beforeEach, expect, it, vi } from 'vitest'
-import type { WebBootEntry } from '@deepseek-ai/dsh-client-modules'
-import { bootWebShell } from '@deepseek-ai/dsh-client-web'
+import type { WebBootEntry } from '@deepseek-ai/dsh-client-modules/client'
+import { AppWebEntry } from '@deepseek-ai/dsh-client-web'
 
 const PLUGINS: readonly (WebBootEntry & { dir: string })[] = [
   { id: '@deepseek-ai/dsh-client-connection', dir: 'connection', url: '/plugins/connection.js', rev: 'fx', inject: [], immediately: true },
   { id: '@deepseek-ai/dsh-client-runtime', dir: 'runtime', url: '/plugins/runtime.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-connection'], immediately: true },
   { id: '@deepseek-ai/dsh-client-ui-theme', dir: 'ui-theme', url: '/plugins/ui-theme.js', rev: 'fx', inject: [], immediately: true },
-  { id: '@deepseek-ai/dsh-client-i18n', dir: 'i18n', url: '/plugins/i18n.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-locale', dir: 'locale', url: '/plugins/locale.js', rev: 'fx', inject: [], immediately: true },
   { id: '@deepseek-ai/dsh-client-ui-layout', dir: 'ui-layout', url: '/plugins/ui-layout.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-runtime'] },
   { id: '@deepseek-ai/dsh-client-ui-sidebar', dir: 'ui-sidebar', url: '/plugins/ui-sidebar.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout'] },
+  { id: '@deepseek-ai/dsh-client-ui-settings', dir: 'ui-settings', url: '/plugins/ui-settings.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-sidebar'] },
+  { id: '@deepseek-ai/dsh-client-ui-settings-general', dir: 'ui-settings-general', url: '/plugins/ui-settings-general.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-settings', '@deepseek-ai/dsh-client-locale'] },
+  { id: '@deepseek-ai/dsh-client-ui-models', dir: 'ui-models', url: '/plugins/ui-models.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-settings'] },
   { id: '@deepseek-ai/dsh-client-ui-conversation', dir: 'ui-conversation', url: '/plugins/ui-conversation.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout'] },
-  { id: '@deepseek-ai/dsh-client-ui-plan', dir: 'ui-plan', url: '/plugins/ui-plan.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-conversation'] },
+  { id: '@deepseek-ai/dsh-client-ui-slash', dir: 'ui-slash', url: '/plugins/ui-slash.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-runtime', '@deepseek-ai/dsh-client-ui-conversation'] },
+  { id: '@deepseek-ai/dsh-client-ui-command', dir: 'ui-command', url: '/plugins/ui-command.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-slash', '@deepseek-ai/dsh-client-ui-conversation'] },
+  { id: '@deepseek-ai/dsh-client-ui-model', dir: 'ui-model', url: '/plugins/ui-model.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-runtime', '@deepseek-ai/dsh-client-ui-command'] },
+  { id: '@deepseek-ai/dsh-client-ui-workspace', dir: 'ui-workspace', url: '/plugins/ui-workspace.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-runtime', '@deepseek-ai/dsh-client-ui-conversation', '@deepseek-ai/dsh-client-ui-sidebar'] },
   { id: '@deepseek-ai/dsh-client-ui-trajectory', dir: 'ui-trajectory', url: '/plugins/ui-trajectory.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-conversation'] },
 ]
 
@@ -73,32 +79,31 @@ afterEach(() => {
 function titleSurfaces(label: string): { sidebar: string; breadcrumb: string; documentTitle: string } {
   const tree = screen.getByRole('tree', { name: 'Sessions' })
   const sidebar = within(tree).getByText(label).textContent ?? ''
-  const breadcrumb = within(screen.getByRole('navigation', { name: '会话层级' }))
+  const breadcrumb = within(screen.getByRole('navigation', { name: 'Session hierarchy' }))
     .getByRole('button', { name: label }).textContent ?? ''
   return { sidebar, breadcrumb, documentTitle: document.title }
 }
 
-/** Boot the built fixture graph into the per-test root. */
-function bootFixtureApp(): void {
+it('projects titles and routes the next turn through the selected model in the built fixture app', async () => {
   const root = document.querySelector<HTMLElement>('#root')
   if (root === null) throw new Error('snapshot root missing')
   act(() => {
-    unmount = bootWebShell(root, {
+    const entry = new AppWebEntry(root, {
       fetchBundle: (url) => {
         const code = bundles.get(url)
         return code === undefined ? Promise.reject(new Error(`missing built bundle ${url}`)) : Promise.resolve(code)
       },
       executeBundle: (code) => { (0, eval)(code) },
     })
+    void entry.run()
+    unmount = () => { entry.dispose() }
   })
-}
 
-it('projects initial and revised durable titles through the built nine-plugin fixture app', async () => {
-  bootFixtureApp()
-  const projectLabel = await screen.findByText('fixture', {}, { timeout: 10_000 })
-  const projectRow = projectLabel.closest<HTMLElement>('[role="treeitem"]')
-  if (projectRow === null) throw new Error('fixture project row missing')
-  fireEvent.click(projectRow)
+  const tree = await screen.findByRole('tree', { name: 'Sessions' }, { timeout: 10_000 })
+  // The fixture Intent selects the workspace, so the current-group effect
+  // already expanded it; clicking the header would now collapse (the twist
+  // stays live since intent stopped forcing expansion).
+  await within(tree).findByText('4 sessions')
 
   const initialLabel = 'Fixture 历史会话'
   const initialRowLabel = await screen.findByText(initialLabel)
@@ -114,56 +119,31 @@ it('projects initial and revised durable titles through the built nine-plugin fi
   await waitFor(() => { expect(document.title).toBe(`${revisedLabel} — DeepSeek Harness`) })
   const revised = titleSurfaces(revisedLabel)
 
+  const modelTrigger = await screen.findByRole('button', {
+    name: '选择模型，当前 DeepSeek-V4-Flash，推理等级 High',
+  })
+  fireEvent.click(modelTrigger)
+  fireEvent.click(screen.getByRole('menuitem', { name: /Model/ }))
+  fireEvent.click(screen.getByRole('menuitemradio', { name: /GPT-5/ }))
+  await waitFor(() => {
+    expect(modelTrigger.getAttribute('aria-label')).toBe('选择模型，当前 GPT-5，推理等级 Medium')
+  })
+  fireEvent.click(modelTrigger)
+  fireEvent.click(screen.getByRole('menuitem', { name: /Effort/ }))
+  fireEvent.click(screen.getByRole('menuitemradio', { name: 'Max' }))
+  await waitFor(() => {
+    expect(modelTrigger.getAttribute('aria-label')).toBe('选择模型，当前 GPT-5，推理等级 Max')
+  })
+
+  // fx-alpha starts in the running state. Selecting above is intentionally
+  // allowed for the next turn; stop the fixture's resident run before sending
+  // the route-report prompt.
+  fireEvent.click(screen.getByRole('button', { name: 'Stop generating' }))
+  const composer = await screen.findByPlaceholderText('Message the agent')
+  fireEvent.change(composer, { target: { value: 'report model' } })
+  fireEvent.keyDown(composer, { key: 'Enter' })
+  await screen.findByText('当前模型：openai/gpt-5 · 推理等级：max', {}, { timeout: 10_000 })
+
   await expect(`${JSON.stringify({ initial, revised }, null, 2)}\n`)
     .toMatchFileSnapshot('./snapshots/session-title.json')
 })
-
-it('snapshots pending and committed plan targets without implicit turn cancellation', async () => {
-  bootFixtureApp()
-  await screen.findByText('fixture', {}, { timeout: 10_000 })
-  fireEvent.click(screen.getByRole('button', { name: 'New session' }))
-  const select: HTMLSelectElement = await screen.findByRole('combobox', { name: '协作模式' }, { timeout: 10_000 })
-  const capture = (stage: string) => {
-    const chip = select.parentElement?.querySelector('span')?.textContent ?? ''
-    return {
-      stage,
-      label: chip,
-      value: select.value,
-      title: select.parentElement?.getAttribute('title') ?? '',
-      primary: screen.getByRole('button', { name: /^(发送|停止)$/ }).getAttribute('aria-label'),
-    }
-  }
-
-  const initial = capture('initial')
-  fireEvent.change(select, { target: { value: 'plan' } })
-  await screen.findByTitle(/计划模式将在下一次模型请求时生效/)
-  const planPending = capture('plan-pending')
-
-  const input = screen.getByPlaceholderText(/输入消息/)
-  fireEvent.change(input, { target: { value: 'commit plan' } })
-  fireEvent.click(screen.getByRole('button', { name: '发送' }))
-  await screen.findByTitle('当前为计划模式')
-  const planCommitted = capture('plan-committed')
-
-  fireEvent.change(select, { target: { value: 'default' } })
-  await screen.findByTitle(/默认模式将在下一次模型请求时生效/)
-  const defaultPendingWhileRunning = capture('default-pending-running')
-  fireEvent.click(screen.getByRole('button', { name: '停止' }))
-  await waitFor(() => { expect(screen.getByRole('button', { name: '发送' })).toBeTruthy() })
-  const defaultPendingAfterStop = capture('default-pending-stopped')
-
-  fireEvent.change(input, { target: { value: 'commit default' } })
-  fireEvent.click(screen.getByRole('button', { name: '发送' }))
-  await screen.findByTitle('当前为默认模式')
-  const defaultCommitted = capture('default-committed')
-  fireEvent.click(screen.getByRole('button', { name: '停止' }))
-
-  await expect(`${JSON.stringify({
-    initial,
-    planPending,
-    planCommitted,
-    defaultPendingWhileRunning,
-    defaultPendingAfterStop,
-    defaultCommitted,
-  }, null, 2)}\n`).toMatchFileSnapshot('./snapshots/plan-mode.json')
-})

apps/web/tests/settings-chrome.e2e.ts

@@ -0,0 +1,170 @@
+// Web e2e scenarios: the settings surface — the modal shell (trigger, nav,
+// section switching, both close paths), the Appearance preference row (the
+// real theme gesture — click 深色 and the whole cascade runs: ThemeService preference -> localStorage dsh.theme
+// -> theme/change -> ui-layout's presenter -> body attribute -> alias token)
+// and the Language row (settings-scoped localization + persisted dsh.locale).
+// Zero model calls: everything is pure client + persistence state on a blank
+// frame, so there is no fixture and a stray stream would fail loud on the
+// open llm seam.
+import { fileURLToPath } from 'node:url'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
+import { join } from 'node:path'
+import {
+  acknowledgeReloadConnectionLoss, assertFixtureInventory, captureStableAria, compareOrRefreshGolden,
+  launchWebScaffold, watchConsole, webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { saveFailureShot } from './support.ts'
+
+const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/settings-chrome', import.meta.url))
+const DIALOG_EXPECTED = join(SNAPSHOT_DIR, 'dialog.expected.md')
+const MODE = webSnapshotMode()
+
+describe('web e2e: settings modal, appearance gesture, language switch', () => {
+  let scaffold: WebScaffold
+  let browser: Browser
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+
+  beforeAll(async () => {
+    scaffold = await launchWebScaffold({})
+    browser = await chromium.launch()
+    page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+  }, 120_000)
+
+  afterAll(async () => {
+    await browser?.close()
+    await scaffold?.close()
+  })
+
+  it('opens the settings dialog, switches sections, and closes by every path', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-settings-shell'))
+    const trigger = page.getByRole('button', { name: '设置', exact: true })
+    expect(await trigger.getAttribute('aria-haspopup')).toBe('dialog')
+    expect(await trigger.getAttribute('aria-expanded')).toBe('false')
+    await trigger.click()
+    const dialog = page.getByRole('dialog', { name: '设置' })
+    await dialog.waitFor({ timeout: 10_000 })
+    expect(await trigger.getAttribute('aria-expanded')).toBe('true')
+    // General is the active section by default; its skeleton rows plus the
+    // functional Language and Appearance rows render.
+    expect(await dialog.getByRole('button', { name: '通用设置' }).getAttribute('aria-current')).toBe('true')
+    await expect.poll(() => dialog.getByText('语言', { exact: true }).count(), { timeout: 5_000 }).toBe(1)
+    await expect.poll(() => dialog.getByText('外观', { exact: true }).count(), { timeout: 5_000 }).toBe(1)
+    // Golden of the freshly opened dialog (default zh, General active).
+    const snapshot = await captureStableAria(page, '[role="dialog"]', scaffold.workspaceCwd)
+    await compareOrRefreshGolden(DIALOG_EXPECTED, snapshot, MODE)
+    // Section switch: aria-current moves; Models is deliberately empty.
+    await dialog.getByRole('button', { name: '模型' }).click()
+    await expect.poll(() => dialog.getByRole('button', { name: '模型' }).getAttribute('aria-current'), { timeout: 5_000 }).toBe('true')
+    expect(await dialog.getByRole('button', { name: '通用设置' }).getAttribute('aria-current')).toBeNull()
+    // Close path 1: Escape.
+    await page.keyboard.press('Escape')
+    await expect.poll(() => page.getByRole('dialog', { name: '设置' }).count(), { timeout: 5_000 }).toBe(0)
+    expect(await trigger.getAttribute('aria-expanded')).toBe('false')
+    // Close path 2: the header close button (focus lands there on open).
+    await trigger.click()
+    await page.getByRole('dialog', { name: '设置' }).getByRole('button', { name: '关闭' }).click()
+    await expect.poll(() => page.getByRole('dialog', { name: '设置' }).count(), { timeout: 5_000 }).toBe(0)
+    expect(tripwire.pageErrors).toEqual([])
+  }, 60_000)
+
+  it('flips the theme through the Appearance cubes and persists across reload', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-settings-appearance'))
+    const readState = async (): Promise<{ attr: boolean; token: string; stored: string | null }> =>
+      await page.evaluate(() => ({
+        attr: document.body.hasAttribute('data-ds-dark-theme'),
+        token: getComputedStyle(document.body).getPropertyValue('--dsw-alias-bg-base').trim(),
+        stored: localStorage.getItem('dsh.theme'),
+      }))
+    // Pin the OS scheme to light so the default `system` preference resolves
+    // light and the dark flip below is unambiguously the gesture's doing.
+    await page.emulateMedia({ colorScheme: 'light' })
+    const light = await readState()
+    expect(light.attr).toBe(false)
+
+    await page.getByRole('button', { name: '设置', exact: true }).click()
+    const dialog = page.getByRole('dialog', { name: '设置' })
+    await dialog.waitFor({ timeout: 10_000 })
+    const darkCube = dialog.getByRole('button', { name: '深色' })
+    expect(await darkCube.getAttribute('aria-pressed')).toBe('false')
+    await darkCube.click()
+    // The full cascade: pressed state, persisted preference, body attribute,
+    // alias token flip — all from one real user gesture.
+    await expect.poll(() => darkCube.getAttribute('aria-pressed'), { timeout: 5_000 }).toBe('true')
+    const dark = await readState()
+    expect(dark.attr).toBe(true)
+    expect(dark.stored).toBe('dark')
+    expect(dark.token).not.toBe(light.token)
+    await page.keyboard.press('Escape')
+
+    // Reload: the preference survives boot (restore + presenter initial apply).
+    const warningStart = tripwire.warnings.length
+    await page.reload({ waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    acknowledgeReloadConnectionLoss(tripwire, warningStart)
+    await page.emulateMedia({ colorScheme: 'light' })
+    const reloaded = await readState()
+    expect(reloaded.attr).toBe(true)
+    expect(reloaded.stored).toBe('dark')
+
+    // `system` follows the emulated OS scheme (dark stays dark, light clears).
+    await page.getByRole('button', { name: '设置', exact: true }).click()
+    const systemCube = page.getByRole('dialog', { name: '设置' }).getByRole('button', { name: '跟随系统' })
+    await systemCube.click()
+    await expect.poll(() => systemCube.getAttribute('aria-pressed'), { timeout: 5_000 }).toBe('true')
+    await expect.poll(async () => (await readState()).attr, { timeout: 5_000 }).toBe(false)
+    await page.emulateMedia({ colorScheme: 'dark' })
+    await expect.poll(async () => (await readState()).attr, { timeout: 5_000 }).toBe(true)
+    // Restore for the specs that follow: light preference beats the emulated
+    // dark OS scheme, leaving the shared page in the light default.
+    await page.getByRole('dialog', { name: '设置' }).getByRole('button', { name: '浅色' }).click()
+    await expect.poll(async () => (await readState()).attr, { timeout: 5_000 }).toBe(false)
+    await page.keyboard.press('Escape')
+    expect(tripwire.pageErrors).toEqual([])
+  }, 90_000)
+
+  it('switches the settings surface language and persists dsh.locale', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-settings-language'))
+    await page.getByRole('button', { name: '设置', exact: true }).click()
+    const zhDialog = page.getByRole('dialog', { name: '设置' })
+    await zhDialog.waitFor({ timeout: 10_000 })
+    // The Language selector pill shows the active locale's own name.
+    const selector = zhDialog.getByRole('button', { name: '中文' })
+    expect(await selector.getAttribute('aria-haspopup')).toBe('menu')
+    await selector.click()
+    await page.getByRole('menuitem', { name: 'English' }).click()
+    // The settings-owned copy re-registers localized: dialog title, nav,
+    // Appearance labels. (Only the settings namespaces are localized today —
+    // the rest of the app's copy is intentionally out of this row's scope.)
+    const enDialog = page.getByRole('dialog', { name: 'Settings' })
+    await enDialog.waitFor({ timeout: 10_000 })
+    expect(await enDialog.getByRole('button', { name: 'General' }).getAttribute('aria-current')).toBe('true')
+    await expect.poll(() => enDialog.getByText('Appearance', { exact: true }).count(), { timeout: 5_000 }).toBe(1)
+    expect(await page.evaluate(() => localStorage.getItem('dsh.locale'))).toBe('en')
+    // Reload keeps English; then restore zh so shared page state (and the
+    // other specs' 设置-anchored selectors + goldens) see the default again.
+    const warningStart = tripwire.warnings.length
+    await page.reload({ waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    acknowledgeReloadConnectionLoss(tripwire, warningStart)
+    const enTrigger = page.getByRole('button', { name: 'Settings' })
+    await enTrigger.waitFor({ timeout: 10_000 })
+    await enTrigger.click()
+    await page.getByRole('dialog', { name: 'Settings' }).getByRole('button', { name: 'English' }).click()
+    await page.getByRole('menuitem', { name: '中文' }).click()
+    await page.getByRole('dialog', { name: '设置' }).waitFor({ timeout: 10_000 })
+    expect(await page.evaluate(() => localStorage.getItem('dsh.locale'))).toBe('zh')
+    await page.keyboard.press('Escape')
+    expect(tripwire.pageErrors).toEqual([])
+  }, 90_000)
+
+  it.skipIf(MODE === 'record')('keeps the fixture inventory closed', async () => {
+    expect(tripwire.warnings).toEqual([])
+    await assertFixtureInventory(SNAPSHOT_DIR, ['dialog.expected.md'])
+  })
+})

apps/web/tests/sidebar-scrollbar.e2e.ts

@@ -0,0 +1,375 @@
+// Web e2e scenario: the sidebar session list's scrollbar as the browser
+// actually lays it out — the observable half of the themed-scrollbar change
+// (packages/client/ui-theme/src/styles/scrollbar.css plus the
+// `scrollbar-gutter: stable` reservation on WorkspaceBrowser's `.list`). The
+// ui-theme/ui-workspace unit specs read the CSS text; only a real engine
+// reports the reserved gutter width and the substituted `scrollbar-color`, so
+// those two facts live here.
+//
+// Zero model calls: the list only has to overflow, so the scenario seeds many
+// cold sessions from another spec's committed fixture (seeded-history's
+// seed.jsonl, reused read-only — this spec needs row count, not new recorded
+// content) and never launches a replay row. A stray stream would fail loud
+// with NO_ADAPTER.
+//
+// Headless-chromium caveats, load-bearing for what is asserted below.
+//
+// Headless chromium defaults to an OVERLAY scrollbar: one drawn on top of the
+// content, consuming no layout width unless something reserves space. That is
+// the mode in which the reported symptom exists at all, so this environment
+// reproduces it rather than merely approximating it — measured against clean
+// master, where the list's band is 0 and the bar covers 7px of the relative
+// time. (Under a classic space-consuming bar, `clientWidth` already excludes
+// the bar and nothing can be covered; a headed run under xvfb behaves that way
+// and cannot show the symptom.)
+//
+// The consequence for assertions: comparing the time element's right edge
+// against the list's CLIENT-area right edge holds in both states and proves
+// nothing, because with an overlay bar the client edge is the border edge. The
+// two signals that do separate the states are the reserved band width and
+// `timeCoveredBy`, which measures the overlap against the bar's own width.
+//
+// Both the `scrollbar-gutter: stable` reservation and the sheet's
+// `::-webkit-scrollbar` width are needed for that band, and neither suffices:
+// measured on the running app, deleting either one takes the band from 8 to 0
+// while the other stays in force. The gutter states that space be reserved; the
+// pseudo-element width is what makes chromium treat the bar as occupying layout
+// space in the first place.
+//
+// That conjunction is why `band` and `timeCoveredBy` are both asserted and
+// neither replaces the other. Removing only the gutter leaves `timeCoveredBy` at
+// 0, because the bar is then 8px wide and the row's right padding is also 8px,
+// so it abuts the timestamp without covering it; `band` catches that case.
+// Removing both — the actual master state — is what produces the reported
+// overlap, and `timeCoveredBy` measures it at 7. Each was mutation-checked with
+// the other assertions in its test silenced.
+//
+// Chromium also takes the `::-webkit-scrollbar*` path, not the standard
+// properties: scrollbar.css gates `scrollbar-width`/`scrollbar-color` behind
+// `@supports not selector(::-webkit-scrollbar)`, which is false here. The
+// resolved standard properties therefore read `auto`, and that reading is
+// asserted — a concrete value would mean the gate leaked and silenced the
+// pseudo-element rules. What the theme test measures instead is the pair the
+// pseudo-element rules read: the indirection variables as they resolve ON the
+// list, plus the `::-webkit-scrollbar-thumb:hover` declaration as it stands in
+// the cascade. The hover thumb colour is not observable any other way —
+// chromium folds the `:hover` rule into `getComputedStyle(el,
+// '::-webkit-scrollbar-thumb')`, so that query reports the hover colour at
+// rest and cannot pin either state (measured by deleting the hover rule live:
+// the same query flipped from the hover colour to the resting one).
+import { readFile } from 'node:fs/promises'
+import { fileURLToPath } from 'node:url'
+import { join } from 'node:path'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
+import {
+  assertFixtureInventory, compareOrRefreshGolden, launchWebScaffold, seedSession, watchConsole,
+  webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { saveFailureShot } from './support.ts'
+
+const SEED = fileURLToPath(new URL('./snapshots/seeded-history/seed.jsonl', import.meta.url))
+const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/sidebar-scrollbar', import.meta.url))
+/**
+ * Committed golden of the resolved scrollbar style and geometry, in both
+ * palettes. The aria goldens the other scenarios commit cannot carry this
+ * change: it alters no DOM and no accessible name, so their normalized trees are
+ * byte-identical with and without it. This one records the values instead, which
+ * makes an unintended shift in thumb colour, band width, or rendering path a
+ * reviewable diff rather than an assertion someone has to think about.
+ */
+const GEOMETRY_EXPECTED = join(SNAPSHOT_DIR, 'geometry.expected.md')
+const MODE = webSnapshotMode()
+/** Enough rows that the list overflows the 800px-tall viewport's sidebar; the scenario asserts the overflow rather than trusting it. */
+const SEED_COUNT = 24
+
+/** Geometry and resolved scrollbar style of one scroll container, measured in the page. */
+interface ListMetrics {
+  /** Resolved `scrollbar-gutter`. */
+  gutter: string
+  /** Resolved `::-webkit-scrollbar` width: the pseudo-element path's own sizing. */
+  width: string
+  /** Resolved `::-webkit-scrollbar-track` background. */
+  track: string
+  /** Resolved `scrollbar-width`, expected `auto` because the gate excludes chromium. */
+  standardWidth: string
+  /** Resolved `scrollbar-color`, expected `auto` for the same reason. */
+  standardColor: string
+  /** `::-webkit-scrollbar-thumb:hover` background declarations found in the cascade, in sheet order. */
+  hoverRules: string[]
+  /** `--dsh-scrollbar-thumb` resolved on the list, serialized as a colour. */
+  token: string
+  /** `--dsh-scrollbar-thumb-hover` resolved on the list, serialized the same way. */
+  hoverToken: string
+  /** True when the list actually scrolls. */
+  overflows: boolean
+  /** Border-box width minus client width: the space the scrollbar takes out of the content area. */
+  band: number
+  /** Client-area right edge in viewport coordinates (`clientWidth` excludes the scrollbar band). */
+  clientRight: number
+  /** Border-box right edge in viewport coordinates. */
+  borderRight: number
+  /** Right edge of the first row's relative-time element, the content the unreserved bar covered. */
+  timeRight: number
+  /**
+   * Pixels of the relative time the scrollbar paints over: how far its right
+   * edge reaches into the band the bar occupies, `[borderRight - barWidth,
+   * borderRight]`. This is the reported symptom as a number, and it is the one
+   * geometric signal that separates the two states in this environment — see
+   * the file header on why `clientWidth` comparisons cannot.
+   */
+  timeCoveredBy: number
+}
+
+/**
+ * Measure the sidebar list in the page.
+ * @param page - the page under test.
+ * @returns the list's resolved scrollbar style and the geometry the fix changes.
+ */
+function measureList(page: Page): Promise<ListMetrics> {
+  return page.evaluate(() => {
+    const list = document.querySelector<HTMLElement>('[role="tree"][aria-label="Sessions"]')
+    if (list === null) throw new Error('sidebar session list not in the DOM')
+    const time = list.querySelector<HTMLElement>('[class*="time"]')
+    if (time === null) throw new Error('no row relative-time element in the sidebar list')
+    // Each indirection variable is resolved through its own throwaway probe
+    // appended to the list: `var()` substitution then happens where the list
+    // sits in the cascade, which is the claim, and `color` normalizes whatever
+    // notation the palette sheet chose into one comparable serialization. A
+    // REUSED probe would report only the last value read — `getComputedStyle`
+    // returns a live declaration, so reassigning `style.color` retroactively
+    // changes every earlier read.
+    const resolve = (name: string): string => {
+      const probe = document.createElement('span')
+      probe.style.color = `var(${name})`
+      list.append(probe)
+      const value = getComputedStyle(probe).color
+      probe.remove()
+      return value
+    }
+    // The hover colour is read out of the cascade rather than computed:
+    // chromium reports the `:hover` background for the resting pseudo-element
+    // too (see the file header), so no computed query separates the states.
+    // Cross-origin sheets throw on `cssRules`; none is expected, and skipping
+    // them cannot mask the rule under test, which ships in the app's own CSS.
+    const hoverRules = [...document.styleSheets]
+      .flatMap((sheet) => {
+        try {
+          return [...sheet.cssRules]
+        } catch {
+          return []
+        }
+      })
+      .filter((rule): rule is CSSStyleRule => rule instanceof CSSStyleRule)
+      .filter(rule => rule.selectorText === '::-webkit-scrollbar-thumb:hover')
+      .map(rule => rule.style.getPropertyValue('background'))
+    const style = getComputedStyle(list)
+    const pseudoWidth = getComputedStyle(list, '::-webkit-scrollbar').width
+    const barWidth = pseudoWidth === 'auto' ? 15 : Number.parseFloat(pseudoWidth)
+    return {
+      gutter: style.scrollbarGutter,
+      width: pseudoWidth,
+      track: getComputedStyle(list, '::-webkit-scrollbar-track').backgroundColor,
+      standardWidth: style.scrollbarWidth,
+      standardColor: style.scrollbarColor,
+      hoverRules,
+      token: resolve('--dsh-scrollbar-thumb'),
+      hoverToken: resolve('--dsh-scrollbar-thumb-hover'),
+      overflows: list.scrollHeight > list.clientHeight,
+      band: list.getBoundingClientRect().width - list.clientWidth,
+      clientRight: list.getBoundingClientRect().left + list.clientWidth,
+      borderRight: list.getBoundingClientRect().right,
+      timeRight: time.getBoundingClientRect().right,
+      // The bar is drawn in the rightmost `barWidth` of the border box, whether
+      // or not that space was reserved. Its width comes from the sheet where the
+      // sheet applies, and from the UA's own overlay bar otherwise — 15px is
+      // what this chromium paints, measured against master where the rule is
+      // absent. Taking the UA width as the fallback is what keeps the assertion
+      // honest: assuming 0 there would report no occlusion precisely in the
+      // state that has it.
+      timeCoveredBy: Math.max(0, time.getBoundingClientRect().right - (list.getBoundingClientRect().right - barWidth)),
+    }
+  })
+}
+
+/**
+ * Render the golden body: the resolved scrollbar style of the list in each
+ * palette, plus the geometric relations the fix establishes.
+ *
+ * Absolute coordinates are deliberately absent. `timeRight`, `clientRight`, and
+ * `borderRight` depend on the sidebar's laid-out width and on font metrics, so
+ * committing them would make the golden fail on a machine whose fonts measure
+ * differently — a fixture that has to be re-recorded per platform documents the
+ * platform, not the change. What is recorded instead is the band, the overlap,
+ * and the two orderings, each of which is a difference or a comparison and so
+ * survives any layout that keeps the reservation.
+ * @param light - metrics measured under the light palette.
+ * @param dark - metrics measured under the dark palette.
+ * @returns the golden body, without a trailing newline.
+ */
+function renderGeometry(light: ListMetrics, dark: ListMetrics): string {
+  const palette = (name: string, metrics: ListMetrics): string[] => [
+    `## ${name}`,
+    '',
+    `- scrollbar-gutter: ${metrics.gutter}`,
+    `- ::-webkit-scrollbar width: ${metrics.width}`,
+    `- ::-webkit-scrollbar-track background: ${metrics.track}`,
+    `- scrollbar-width: ${metrics.standardWidth}`,
+    `- scrollbar-color: ${metrics.standardColor}`,
+    `- ::-webkit-scrollbar-thumb:hover declarations: ${metrics.hoverRules.join(' | ')}`,
+    `- --dsh-scrollbar-thumb: ${metrics.token}`,
+    `- --dsh-scrollbar-thumb-hover: ${metrics.hoverToken}`,
+    `- list overflows: ${String(metrics.overflows)}`,
+    `- reserved band: ${String(metrics.band)}px`,
+    `- relative time covered by the bar: ${String(metrics.timeCoveredBy)}px`,
+    `- relative time ends inside the content area: ${String(metrics.timeRight <= metrics.clientRight)}`,
+    `- content area ends before the border box: ${String(metrics.clientRight < metrics.borderRight)}`,
+    '',
+  ]
+  return [
+    '# Sidebar session list scrollbar',
+    '',
+    ...palette('Light palette', light),
+    ...palette('Dark palette', dark),
+  ].join('\n').trimEnd()
+}
+
+/**
+ * Reveal the seeded rows: every seeded session is unattached, so they all sit
+ * in the collapsed Ungrouped bucket. Converges on expanded rather than
+ * clicking once — startup auto-selection can expand the bucket first, and a
+ * second click would collapse it again. Hand-rolled polling because
+ * `expect.poll` is test-scoped and this runs in `beforeAll`.
+ * @param page - the page under test.
+ */
+async function expandSeededSessions(page: Page): Promise<void> {
+  const bucket = page.getByText('Ungrouped', { exact: true }).locator('..').locator('..')
+  await bucket.waitFor({ timeout: 15_000 })
+  const rows = page.locator('[role="tree"][aria-label="Sessions"] [role="treeitem"]')
+  const deadline = Date.now() + 30_000
+  for (;;) {
+    if (await bucket.getAttribute('aria-expanded') !== 'true') {
+      await page.getByText('Ungrouped', { exact: true }).click()
+    }
+    if (await bucket.getAttribute('aria-expanded') === 'true' && await rows.count() > SEED_COUNT / 2) return
+    if (Date.now() > deadline) {
+      throw new Error(`Ungrouped bucket never revealed more than ${SEED_COUNT / 2} rows`)
+    }
+    await page.waitForTimeout(200)
+  }
+}
+
+describe('web e2e: sidebar session list scrollbar (reserved gutter / themed thumb)', () => {
+  let scaffold: WebScaffold
+  let browser: Browser
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+
+  beforeAll(async () => {
+    scaffold = await launchWebScaffold({})
+    const fixture = await readFile(SEED, 'utf8')
+    for (let index = 0; index < SEED_COUNT; index += 1) {
+      await seedSession(scaffold, fixture, `sidebar-scrollbar-web-e2e-${String(index).padStart(2, '0')}`)
+    }
+    browser = await chromium.launch()
+    // Shorter than the other scenarios' 1000px so SEED_COUNT rows overflow
+    // the list with room to spare.
+    page = await browser.newPage({ viewport: { width: 1680, height: 800 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    await expandSeededSessions(page)
+  }, 180_000)
+
+  afterAll(async () => {
+    await browser?.close()
+    await scaffold?.close()
+  })
+
+  it('reserves a scrollbar gutter on the overflowing session list', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-sidebar-scrollbar-gutter'))
+    // Vacuity guard: with a non-overflowing list `stable` still reserves, but
+    // the scenario would no longer be reproducing the reported situation.
+    await expect.poll(async () => (await measureList(page)).overflows, { timeout: 10_000 }).toBe(true)
+    const metrics = await measureList(page)
+    expect(metrics.gutter).toBe('stable')
+    // The control. `band > 0` is the whole observable effect of the
+    // reservation: the scrollbar is taken out of the content area instead of
+    // drawn over it. Removing the declaration makes it exactly 0. The value
+    // itself is not pinned — it tracks `scrollbar-width` and the platform.
+    expect(metrics.band).toBeGreaterThan(0)
+    // The reported symptom, stated directly: no part of the row's relative time
+    // lies under the bar. Measures 7 on clean master — the `h` of `1h` is the
+    // covered part. Unlike the client-edge comparison below it does not go
+    // vacuous under an overlay scrollbar, because it measures against the bar's
+    // own width rather than against a content edge the overlay bar does not
+    // move. It is not a replacement for the band assertion above; see the file
+    // header for which regression each one catches.
+    expect(metrics.timeCoveredBy).toBe(0)
+    // Corollaries of the reservation, kept because they pin where the band sits
+    // rather than only that it exists: the time ends inside the content area,
+    // and the content area ends before the border box. Each holds in both
+    // states on its own (see the file header) and is meaningful only alongside
+    // the two assertions above.
+    expect(metrics.timeRight).toBeLessThanOrEqual(metrics.clientRight)
+    expect(metrics.clientRight).toBeLessThan(metrics.borderRight)
+    expect(tripwire.pageErrors).toEqual([])
+  }, 60_000)
+
+  it('renders the themed thumb through the WebKit path in both palettes', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-sidebar-scrollbar-theme'))
+    const light = await measureList(page)
+    // The gate's signature on this engine, and the reason it exists: chromium
+    // implements `::-webkit-scrollbar`, so the standard properties stay at
+    // their initial `auto`. A concrete value here would mean the gate leaked,
+    // which is exactly what makes chromium discard the pseudo-element rules —
+    // the hover token included.
+    expect(light.standardWidth).toBe('auto')
+    expect(light.standardColor).toBe('auto')
+    // The pseudo-element path is the one in force: the sheet's own 8px sizing
+    // and transparent track reached a container it never names.
+    expect(light.width).toBe('8px')
+    expect(light.track).toBe('rgba(0, 0, 0, 0)')
+    // The resting and the hover rule each read the rebindable indirection, and
+    // the two resolve to DIFFERENT colours on this list: the l1 pair arrived
+    // here intact rather than collapsing to one value or falling back.
+    expect(light.hoverRules).toEqual(['var(--dsh-scrollbar-thumb-hover)'])
+    expect(light.token).toMatch(/^rgba?\(/)
+    expect(light.hoverToken).not.toBe(light.token)
+    // The dark palette declares different scrollbar tokens; driving the body
+    // attribute pins the cascade the way lifecycle-chrome does (the Settings
+    // gesture that sets it is owned there).
+    await page.evaluate(() => { document.body.setAttribute('data-ds-dark-theme', '') })
+    const dark = await measureList(page)
+    expect(dark.token).not.toBe(light.token)
+    expect(dark.hoverToken).not.toBe(dark.token)
+    expect(dark.hoverToken).not.toBe(light.hoverToken)
+    await page.evaluate(() => { document.body.removeAttribute('data-ds-dark-theme') })
+    const restored = await measureList(page)
+    expect(restored.token).toBe(light.token)
+    expect(restored.hoverToken).toBe(light.hoverToken)
+    expect(tripwire.pageErrors).toEqual([])
+  }, 60_000)
+
+  it('matches the committed scrollbar geometry golden in both palettes', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-sidebar-scrollbar-golden'))
+    const light = await measureList(page)
+    await page.evaluate(() => { document.body.setAttribute('data-ds-dark-theme', '') })
+    const dark = await measureList(page)
+    await page.evaluate(() => { document.body.removeAttribute('data-ds-dark-theme') })
+    await compareOrRefreshGolden(GEOMETRY_EXPECTED, renderGeometry(light, dark), MODE)
+    expect(tripwire.pageErrors).toEqual([])
+  }, 60_000)
+
+  it('commits exactly the fixtures it reads', async () => {
+    // The scenario borrows seeded-history's seed.jsonl rather than committing a
+    // second copy, so this directory holds the golden alone.
+    await assertFixtureInventory(SNAPSHOT_DIR, ['geometry.expected.md'])
+  })
+
+  it.skipIf(MODE === 'record')('issued zero model calls and stayed clean', () => {
+    expect(tripwire.warnings).toEqual([])
+    expect(tripwire.pageErrors).toEqual([])
+  })
+})

apps/web/tests/slash-flow.snapshot.ts

@@ -0,0 +1,190 @@
+// @vitest-environment jsdom
+// Assembled keyless snapshot of the slash/input/session convergence under the
+// agent-parity model: the New Session view state locks the composer until a
+// Workspace is picked (connectWorkspace materializes the full Session+Agent),
+// the '/' menu serves the session's wire command catalog (sessions are always
+// agent-backed — no draft/materialized split), a leadingInput command claims,
+// submits over the wire, and notices its result, and the SAME composer
+// textarea then carries the first plain send, whose ACCEPTANCE (not attempt)
+// flips blank and surfaces the session in lists. This is the user-visible
+// acceptance anchor — package mocks do not substitute for the assembled
+// application transcript.
+import { readFileSync } from 'node:fs'
+import { join } from 'node:path'
+import { act, cleanup, fireEvent, screen, waitFor, within } from '@testing-library/react'
+import { afterEach, beforeEach, expect, it, vi } from 'vitest'
+import type { WebBootEntry } from '@deepseek-ai/dsh-client-modules/client'
+import { AppWebEntry } from '@deepseek-ai/dsh-client-web'
+
+const PLUGINS: readonly (WebBootEntry & { dir: string })[] = [
+  { id: '@deepseek-ai/dsh-client-connection', dir: 'connection', url: '/plugins/connection.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-runtime', dir: 'runtime', url: '/plugins/runtime.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-connection'], immediately: true },
+  { id: '@deepseek-ai/dsh-client-ui-theme', dir: 'ui-theme', url: '/plugins/ui-theme.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-locale', dir: 'locale', url: '/plugins/locale.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-ui-layout', dir: 'ui-layout', url: '/plugins/ui-layout.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-runtime'] },
+  { id: '@deepseek-ai/dsh-client-ui-sidebar', dir: 'ui-sidebar', url: '/plugins/ui-sidebar.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout'] },
+  { id: '@deepseek-ai/dsh-client-ui-slash', dir: 'ui-slash', url: '/plugins/ui-slash.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-runtime'] },
+  { id: '@deepseek-ai/dsh-client-ui-conversation', dir: 'ui-conversation', url: '/plugins/ui-conversation.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout', '@deepseek-ai/dsh-client-ui-slash'] },
+  { id: '@deepseek-ai/dsh-client-ui-command', dir: 'ui-command', url: '/plugins/ui-command.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-slash', '@deepseek-ai/dsh-client-ui-conversation'] },
+  { id: '@deepseek-ai/dsh-client-ui-skill', dir: 'ui-skill', url: '/plugins/ui-skill.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-slash'] },
+  { id: '@deepseek-ai/dsh-client-ui-subagent', dir: 'ui-subagent', url: '/plugins/ui-subagent.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-slash'] },
+  {
+    id: '@deepseek-ai/dsh-client-ui-workspace',
+    dir: 'ui-workspace',
+    url: '/plugins/ui-workspace.js',
+    rev: 'fx',
+    inject: [
+      '@deepseek-ai/dsh-client-runtime',
+      '@deepseek-ai/dsh-client-ui-conversation',
+      '@deepseek-ai/dsh-client-ui-sidebar',
+    ],
+  },
+]
+
+const bundles = new Map(PLUGINS.map(plugin => [
+  plugin.url,
+  readFileSync(join(process.cwd(), 'packages/client', plugin.dir, 'lib/client.js'), 'utf8'),
+]))
+
+interface FixtureWindow extends Window {
+  __DSH_BOOT__?: { rev: string; entries: WebBootEntry[] }
+  __ModuleLoader__?: unknown
+}
+
+class ResizeObserverStub {
+  observe(): void {}
+  disconnect(): void {}
+  unobserve(): void {}
+}
+
+const win = window as FixtureWindow
+let unmount: (() => void) | undefined
+
+beforeEach(() => {
+  localStorage.clear()
+  document.title = 'DeepSeek Harness'
+  vi.stubGlobal('ResizeObserver', ResizeObserverStub)
+  vi.stubGlobal('requestAnimationFrame', (callback: FrameRequestCallback) =>
+    setTimeout(() => { callback(0) }, 0) as unknown as number)
+  vi.stubGlobal('cancelAnimationFrame', (id: number) => { clearTimeout(id) })
+})
+
+afterEach(() => {
+  act(() => { unmount?.() })
+  unmount = undefined
+  cleanup()
+  delete win.__DSH_BOOT__
+  delete win.__ModuleLoader__
+  delete (globalThis as Record<string, unknown>).__fxTiming
+  document.body.innerHTML = ''
+  document.head.querySelectorAll('style[data-plugin]').forEach((style) => { style.remove() })
+  document.title = ''
+  history.replaceState(null, '', '/')
+  vi.unstubAllGlobals()
+})
+
+/** Boot the complete built client graph against one keyless fixture branch. */
+function boot(search: string): void {
+  history.replaceState(null, '', `/${search}`)
+  const root = document.createElement('div')
+  root.id = 'root'
+  document.body.appendChild(root)
+  win.__DSH_BOOT__ = { rev: 'fx', entries: PLUGINS.map(({ dir: _dir, ...plugin }) => plugin) }
+  act(() => {
+    const entry = new AppWebEntry(root, {
+      fetchBundle: (url) => {
+        const code = bundles.get(url)
+        return code === undefined ? Promise.reject(new Error(`missing built bundle ${url}`)) : Promise.resolve(code)
+      },
+      executeBundle: (code) => { (0, eval)(code) },
+    })
+    void entry.run()
+    unmount = () => { entry.dispose() }
+  })
+}
+
+/** Collapse decorative whitespace while preserving the text a user sees. */
+function visibleText(element: Element): string {
+  return (element.textContent ?? '').replace(/\s+/g, ' ').trim()
+}
+
+/** Type into the machine-driven composer and let the change echo back. */
+async function typeComposer(composer: HTMLTextAreaElement, value: string): Promise<void> {
+  fireEvent.change(composer, { target: { value } })
+  await waitFor(() => { expect(composer.value).toBe(value) })
+}
+
+it('locked view state, connectWorkspace unlock, /echo claim chain, and blank-on-acceptance ride one resident composer', async () => {
+  boot('?fixture=empty')
+
+  // View state: no session entity — the composer renders locked; only the
+  // workspace picker is live.
+  const locked = await screen.findByPlaceholderText<HTMLTextAreaElement>(
+    'Choose a workspace to start', {}, { timeout: 10_000 },
+  )
+  expect(locked.disabled).toBe(true)
+
+  // Pick (create) a Workspace: connectWorkspace materializes the full
+  // Session+Agent and the provider swaps in the live blank-session hero.
+  fireEvent.click(screen.getAllByRole('button', { name: 'Choose workspace' })
+    .find(el => el.getAttribute('aria-haspopup') === 'menu')!)
+  fireEvent.click(await screen.findByRole('menuitem', { name: 'Create a new workspace' }))
+  const dialog = await screen.findByRole('dialog', { name: 'Create a new workspace' })
+  fireEvent.change(within(dialog).getByRole('textbox', { name: 'New workspace name' }), {
+    target: { value: 'nova' },
+  })
+  fireEvent.click(within(dialog).getByRole('button', { name: 'Create workspace' }))
+
+  const composer = await screen.findByPlaceholderText<HTMLTextAreaElement>(
+    'Describe what you want to build', {}, { timeout: 10_000 },
+  )
+  expect(composer.disabled).toBe(false)
+
+  // '/' opens the menu with the session's wire command catalog (the session
+  // is agent-backed from birth — the catalog is the single-address list).
+  await typeComposer(composer, '/')
+  const menu = await screen.findByRole('listbox', { name: 'Trigger suggestions' })
+  await waitFor(() => { expect(visibleText(menu)).toContain('echo') })
+  const menuText = visibleText(menu)
+
+  // Pick /echo (leadingInput): the claim token lands in the same textarea.
+  fireEvent.mouseDown(screen.getByRole('option', { name: /echo/ }))
+  await waitFor(() => { expect(composer.value).toBe('/echo ') })
+
+  // Type args and submit: the claim executes over the wire and notices its
+  // result; the token is consumed and the draft returns to plain text.
+  await typeComposer(composer, '/echo hello parser')
+  fireEvent.keyDown(composer, { key: 'Enter' })
+  await screen.findByText('hello parser', {}, { timeout: 10_000 })
+  await waitFor(() => { expect(composer.value).toBe('') })
+
+  // Slash execution does not flip blank: the selected row remains New Session.
+  const tree = screen.getByRole('tree', { name: 'Sessions' })
+  expect(within(tree).getByText('1 session')).toBeDefined()
+  expect(within(tree).getByText('New Session')).toBeDefined()
+
+  // First plain send through the SAME textarea: acceptance logs the user
+  // message and converts the existing sidebar row out of blank.
+  const before = composer
+  await typeComposer(composer, 'build me a parser')
+  fireEvent.keyDown(composer, { key: 'Enter' })
+  await waitFor(() => {
+    expect(screen.queryByText("Let's start building")).toBeNull()
+  }, { timeout: 10_000 })
+  await waitFor(() => { expect(within(tree).getByText('1 session')).toBeDefined() }, { timeout: 10_000 })
+  const after = document.querySelector('textarea')
+
+  expect({
+    menuHadEcho: menuText.includes('echo'),
+    menuHadCompact: menuText.includes('compact'),
+    composerSurvivedConversion: after === before,
+    sessionListed: visibleText(within(tree).getByText('1 session').closest('[role="treeitem"]')!),
+  }).toMatchInlineSnapshot(`
+    {
+      "composerSurvivedConversion": true,
+      "menuHadCompact": true,
+      "menuHadEcho": true,
+      "sessionListed": "nova1 session",
+    }
+  `)
+})

apps/web/tests/smoke-fixture.e2e.ts

@@ -1,382 +0,0 @@
-// Keyless boot-chain smoke over the REAL carrier: startWebServer + entry
-// graph (__DSH_BOOT__ web2 shape) injection + built shell dist in a real
-// chromium. First describe: graph injection + the fail-loud half. Second
-// describe: the settled success pass — all ten REAL tsdown bundles load
-// through the module system + vendored Loader chain in ?fixture mode (the
-// infrastructure four ride the immediately prefetch tier, the UI rows fetch
-// on demand), the three-column frame appears in one flip, and the resident
-// question completes through the real UI stack. The full model round lands
-// in smoke-real under the W5 real-host standard.
-import { existsSync } from 'node:fs'
-import { fileURLToPath } from 'node:url'
-import type { Browser, Page } from 'playwright'
-import { chromium } from 'playwright'
-import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
-import { startWebServer } from '@deepseek-ai/dsh-host-webserver'
-import type { WebBootEntry, WebBootGraph } from '@deepseek-ai/dsh-host-webserver'
-import { DIST_INDEX, probeFreePort, requireDist, saveFailureShot } from './support.ts'
-
-const bundlePath = (dir: string): string =>
-  fileURLToPath(new URL(`../../../packages/client/${dir}/lib/client.js`, import.meta.url))
-
-const LAYOUT_ID = '@deepseek-ai/dsh-client-ui-layout'
-const SIDEBAR_ID = '@deepseek-ai/dsh-client-ui-sidebar'
-
-/** id ↔ bundle table for the success pass (the complete Web UI assembly). */
-const REAL_PLUGINS: { id: string; dir: string; inject?: string[]; immediately?: boolean }[] = [
-  { id: '@deepseek-ai/dsh-client-connection', dir: 'connection', immediately: true },
-  { id: '@deepseek-ai/dsh-client-runtime', dir: 'runtime', inject: ['@deepseek-ai/dsh-client-connection'], immediately: true },
-  { id: '@deepseek-ai/dsh-client-ui-theme', dir: 'ui-theme', immediately: true },
-  { id: '@deepseek-ai/dsh-client-i18n', dir: 'i18n', immediately: true },
-  { id: LAYOUT_ID, dir: 'ui-layout', inject: ['@deepseek-ai/dsh-client-runtime'] },
-  { id: SIDEBAR_ID, dir: 'ui-sidebar', inject: [LAYOUT_ID] },
-  { id: '@deepseek-ai/dsh-client-ui-conversation', dir: 'ui-conversation', inject: [LAYOUT_ID] },
-  { id: '@deepseek-ai/dsh-client-ui-plan', dir: 'ui-plan', inject: ['@deepseek-ai/dsh-client-ui-conversation'] },
-  { id: '@deepseek-ai/dsh-client-ui-question', dir: 'ui-question', inject: ['@deepseek-ai/dsh-client-ui-conversation'] },
-  { id: '@deepseek-ai/dsh-client-ui-trajectory', dir: 'ui-trajectory', inject: ['@deepseek-ai/dsh-client-ui-conversation'] },
-]
-
-const BUNDLE_PATHS = new Map(REAL_PLUGINS.map(p => [p.id, bundlePath(p.dir)]))
-
-const row = (id: string, extra?: Partial<WebBootEntry>): WebBootEntry =>
-  ({ id, url: `/plugins/${id}/client.js?rev=e2e`, rev: 'e2e', ...extra })
-
-const graphRows: WebBootEntry[] = REAL_PLUGINS.map(p => row(p.id, {
-  ...(p.inject !== undefined ? { inject: p.inject } : {}),
-  ...(p.immediately === true ? { immediately: true } : {}),
-}))
-
-/** Graph for the fail-loud half: the immediately tier, one live UI row, one missing row. */
-const FAIL_GRAPH: WebBootGraph = {
-  rev: 'e2e-fail',
-  entries: [...graphRows.filter(r => r.immediately === true), row(LAYOUT_ID), row('@probe/absent')],
-}
-
-/** Graph for the success pass: the complete assembly. */
-const OK_GRAPH: WebBootGraph = { rev: 'e2e-ok', entries: graphRows }
-
-/** Registry stub over a fixed graph (the real HostWebPluginRegistry is webserver-side production code). */
-function fixedRegistry(graph: WebBootGraph, byId: ReadonlyMap<string, string>) {
-  return {
-    graph: () => graph,
-    clientPath: (id: string) => byId.get(id),
-    onRebuilt: () => () => undefined,
-  }
-}
-
-describe('web boot chain (keyless, real carrier)', () => {
-  let server: Awaited<ReturnType<typeof startWebServer>>
-  let browser: Browser
-  let page: Page
-  const pageErrors: string[] = []
-
-  beforeAll(async () => {
-    requireDist()
-    const port = await probeFreePort()
-    const apiHandler = { fetch: () => Promise.resolve(new Response('boot smoke must not call /api', { status: 500 })) }
-    server = await startWebServer({
-      host: '127.0.0.1',
-      port,
-      distIndex: DIST_INDEX,
-      apiHandler,
-      webPlugins: fixedRegistry(FAIL_GRAPH, BUNDLE_PATHS),
-    }, (err) => { pageErrors.push(`server: ${String(err)}`) })
-    browser = await chromium.launch()
-    page = await browser.newPage()
-    page.on('pageerror', e => pageErrors.push(String(e)))
-    await page.goto(`http://127.0.0.1:${port}/`, { waitUntil: 'load' })
-  })
-
-  afterAll(async () => {
-    await browser?.close()
-    await server?.close()
-  })
-
-  it('GET / injects the entry graph verbatim', async () => {
-    onTestFailed(() => saveFailureShot(page, 'smoke-boot-manifest'))
-    const boot = await page.evaluate(() => (window as { __DSH_BOOT__?: unknown }).__DSH_BOOT__)
-    expect(boot).toEqual(FAIL_GRAPH)
-  })
-
-  it('serves a real bundle through the plugins endpoint', async () => {
-    const res = await page.request.get(`${new URL(page.url()).origin}/plugins/${LAYOUT_ID}/client.js`)
-    expect(res.status()).toBe(200)
-    expect(await res.text()).toContain('window.__ModuleLoader__.load')
-  })
-
-  it('boots to the loading page and fail-louds the absent entry', async () => {
-    onTestFailed(() => saveFailureShot(page, 'smoke-boot-fail-loud'))
-    await page.waitForSelector('text=HARNESS', { timeout: 10_000 })
-    await page.waitForSelector('text=Failed to load plugins', { timeout: 10_000 })
-    await page.waitForSelector('text=@probe/absent', { timeout: 2000 })
-    // The real UI must not have flipped in: the gate opens only on settled.
-    expect(await page.locator('[class*="frame"]').count()).toBe(0)
-  })
-
-  it('applies the token sheets before any plugin CSS', async () => {
-    const family = await page.evaluate(() => getComputedStyle(document.body).getPropertyValue('--dsw-font-family'))
-    expect(family.trim().length).toBeGreaterThan(0)
-  })
-})
-
-describe('web boot chain success pass (keyless, ten real bundles, ?fixture)', () => {
-  let server: Awaited<ReturnType<typeof startWebServer>>
-  let browser: Browser
-  let page: Page
-  const pageErrors: string[] = []
-
-  beforeAll(async () => {
-    requireDist()
-    const missing = REAL_PLUGINS.filter(p => !existsSync(bundlePath(p.dir)))
-    if (missing.length > 0) throw new Error(`client bundles not built (pnpm --filter <pkg> bundle): ${missing.map(m => m.dir).join(', ')}`)
-    const port = await probeFreePort()
-    // ?fixture never opens HTTP streams; /api is a tripwire like the first describe.
-    const apiHandler = { fetch: () => Promise.resolve(new Response('fixture mode must not call /api', { status: 500 })) }
-    server = await startWebServer({
-      host: '127.0.0.1',
-      port,
-      distIndex: DIST_INDEX,
-      apiHandler,
-      webPlugins: fixedRegistry(OK_GRAPH, BUNDLE_PATHS),
-    }, (err) => { pageErrors.push(`server: ${String(err)}`) })
-    browser = await chromium.launch()
-    page = await browser.newPage()
-    page.on('pageerror', e => pageErrors.push(String(e)))
-    await page.goto(`http://127.0.0.1:${port}/?fixture`, { waitUntil: 'load' })
-  })
-
-  afterAll(async () => {
-    await browser?.close()
-    await server?.close()
-  })
-
-  it('settles and flips to the three-column frame in one pass', async () => {
-    onTestFailed(() => saveFailureShot(page, 'smoke-boot-settled'))
-    await page.waitForSelector('[class*="frame"]', { timeout: 15_000 })
-    // Loading page is gone; the grid carries the three tracks.
-    expect(await page.locator('text=Failed to load plugins').count()).toBe(0)
-    const template = await page.locator('[class*="frame"]').evaluate(el => getComputedStyle(el).gridTemplateColumns)
-    expect(template.split(' ').length).toBe(3)
-  })
-
-  it('every plugin CSS landed with its ownership tag', async () => {
-    const owners = await page.evaluate(() =>
-      [...document.querySelectorAll('style[data-plugin]')].map(s => (s as HTMLElement).dataset['plugin']))
-    expect(owners).toContain(LAYOUT_ID)
-    expect(owners).toContain(SIDEBAR_ID)
-  })
-
-  it('collapsed sidebar animates to a 56px rail with the four controls', async () => {
-    onTestFailed(() => saveFailureShot(page, 'smoke-boot-collapsed-rail'))
-    const frame = page.locator('[class*="frame"]')
-    const firstTrack = async (): Promise<string> => (await frame.evaluate(
-      el => getComputedStyle(el).gridTemplateColumns)).split(' ')[0]!
-    // The tracks transition on the deepsuite curve; assert the animated
-    // settle rather than an instant jump.
-    const settledTrack = async (px: string): Promise<void> => {
-      await expect.poll(firstTrack, { timeout: 2000 }).toBe(px)
-    }
-    // The brand wordmark is decorative svg (aria-hidden) — presence tracks the wide chrome.
-    const brand = () => page.locator('[class*="brand"]').count()
-    await page.getByRole('button', { name: 'Collapse sidebar' }).click()
-    // Mid-collapse the wide chrome is still mounted, fading — not swapped out.
-    expect(await brand()).toBe(1)
-    await settledTrack('56px')
-    await expect.poll(brand, { timeout: 2000 }).toBe(0)
-    for (const name of ['Open sidebar', 'New session', 'New workspace', 'Search sessions', 'Settings']) {
-      await expect(page.getByRole('button', { name }).isVisible(), name).resolves.toBe(true)
-    }
-    await page.getByRole('button', { name: 'Open sidebar' }).click()
-    await settledTrack('280px')
-    await expect(page.getByRole('button', { name: 'Collapse sidebar' }).isVisible()).resolves.toBe(true)
-    // Rail search: collapse again, the search control expands and lands in the box.
-    await page.getByRole('button', { name: 'Collapse sidebar' }).click()
-    await settledTrack('56px')
-    await page.getByRole('button', { name: 'Search sessions' }).click()
-    await settledTrack('280px')
-    // Focus is deferred past the slide (EXPAND_SLIDE_MS) — poll for it.
-    await expect.poll(() => page.evaluate(() =>
-      (document.activeElement as HTMLInputElement | null)?.placeholder ?? ''), { timeout: 2000 }).toContain('Search')
-  })
-
-  it('renders file tool rows and expands fixture reasoning from either click target', async () => {
-    onTestFailed(() => saveFailureShot(page, 'smoke-think-disclosure'))
-    await page.locator('[role="treeitem"]').first().click()
-    await page.locator('[role="treeitem"][aria-selected]').first().click()
-
-    const thinkRoot = page.locator('[data-variant="think"]').first()
-    const think = thinkRoot.getByRole('button')
-    await think.waitFor({ state: 'visible', timeout: 10_000 })
-    expect(await think.getAttribute('aria-expanded')).toBe('false')
-
-    await thinkRoot.getByText(/^思考过程 .*reasoning 内容。$/).click()
-    expect(await think.getAttribute('aria-expanded')).toBe('true')
-    expect(await thinkRoot.locator(':scope > div').count()).toBe(2)
-
-    await think.getByText('Think', { exact: true }).click()
-    expect(await think.getAttribute('aria-expanded')).toBe('false')
-
-    const editRoot = page.locator('[data-variant="edit"]').first()
-    await editRoot.waitFor({ state: 'visible', timeout: 10_000 })
-    expect(await editRoot.getByText('Edit', { exact: true }).count()).toBe(1)
-    expect(await editRoot.getByText('notes/demo.txt', { exact: true }).count()).toBe(1)
-
-    const writeRoot = page.locator('[data-variant="write"]').first()
-    await writeRoot.waitFor({ state: 'visible', timeout: 10_000 })
-    expect(await writeRoot.getByText('Write', { exact: true }).count()).toBe(1)
-    expect(await writeRoot.getByText('notes/new-demo.txt', { exact: true }).count()).toBe(1)
-  })
-
-  it('keeps Markdown semantic while a fixture reply streams and finalizes', async () => {
-    onTestFailed(() => saveFailureShot(page, 'smoke-markdown-stream'))
-    await page.getByRole('button', { name: 'New session', exact: true }).click()
-    const input = page.locator('textarea[placeholder]')
-    await input.waitFor({ timeout: 15_000 })
-    await input.fill('render markdown')
-    await page.getByRole('button', { name: '发送' }).click()
-
-    const streaming = page.locator('[data-streaming="true"]')
-    await streaming.getByRole('heading', { name: 'Markdown fixture' }).waitFor({ timeout: 15_000 })
-    await streaming.waitFor({ state: 'detached', timeout: 15_000 })
-
-    const finalHeading = page.getByRole('heading', { name: 'Markdown fixture' })
-    expect(await finalHeading.evaluate(element => element.tagName)).toBe('H1')
-    expect(await page.locator('pre code').filter({ hasText: 'const markdown = true' }).count()).toBe(1)
-    const external = page.getByRole('link', { name: 'DeepSeek' })
-    expect(await external.getAttribute('target')).toBe('_blank')
-    expect(await external.getAttribute('rel')).toBe('noopener noreferrer')
-  })
-
-  it('queues plan targets without cancelling a running turn and commits them at prompt boundaries', async () => {
-    onTestFailed(() => saveFailureShot(page, 'smoke-plan-mode'))
-    const select = page.getByRole('combobox', { name: '协作模式' })
-    await select.waitFor({ state: 'visible', timeout: 15_000 })
-    await expect(page.getByTitle('当前为默认模式').isVisible()).resolves.toBe(true)
-    await select.focus()
-    expect(await select.evaluate((element) => {
-      const chip = element.parentElement?.firstElementChild
-      if (!(chip instanceof HTMLElement)) return null
-      const style = getComputedStyle(chip)
-      return { outlineStyle: style.outlineStyle, outlineWidth: style.outlineWidth }
-    })).toEqual({ outlineStyle: 'solid', outlineWidth: '2px' })
-
-    await select.selectOption('plan')
-    await page.getByTitle(/计划模式将在下一次模型请求时生效/).waitFor()
-    const descriptionId = await select.getAttribute('aria-describedby')
-    expect(descriptionId).not.toBeNull()
-    expect(await page.locator(`[id="${descriptionId}"]`).textContent())
-      .toBe('当前为默认模式；计划模式将在下一次模型请求时生效')
-    const input = page.locator('textarea[placeholder]')
-    await input.fill('commit plan mode')
-    await page.getByRole('button', { name: '发送' }).click()
-    await page.getByTitle('当前为计划模式').waitFor()
-
-    await select.selectOption('default')
-    await page.getByTitle(/默认模式将在下一次模型请求时生效/).waitFor()
-    await expect(page.getByRole('button', { name: '停止' }).isVisible()).resolves.toBe(true)
-    await page.getByRole('button', { name: '停止' }).click()
-    await page.getByTitle(/默认模式将在下一次模型请求时生效/).waitFor()
-
-    await input.fill('commit default mode')
-    await page.getByRole('button', { name: '发送' }).click()
-    await page.getByTitle('当前为默认模式').waitFor()
-    await page.getByRole('button', { name: '停止' }).click()
-  })
-
-  it('renders and completes the resident question through the composer slot', async () => {
-    onTestFailed(() => saveFailureShot(page, 'smoke-question-composer'))
-    const sessionTree = page.getByRole('tree', { name: 'Sessions' })
-    const projectRow = sessionTree.getByRole('treeitem').filter({ hasText: '3 sessions' })
-    if (await projectRow.getAttribute('aria-expanded') === 'false') await projectRow.click()
-    await sessionTree.getByText('Fixture 历史会话', { exact: true }).click()
-    const composer = page.locator('[data-question-key]')
-    await composer.waitFor({ timeout: 15_000 })
-    expect({
-      pendingQuestionPlaceholders: await page.getByText(/等待回答（/).count(),
-      question: await composer.getByRole('heading').innerText(),
-      progress: await composer.getByText('1 / 3', { exact: true }).innerText(),
-      options: await composer.getByRole('radio').allTextContents(),
-      custom: await composer.getByRole('button', { name: '其他，请填写自定义答案' }).innerText(),
-    }).toMatchInlineSnapshot(`
-      {
-        "custom": "其他，请填写自定义答案",
-        "options": [
-          "1工程落地型推荐更看重能直接做 runtime、tool executor、sandbox、trace 和线上问题排查。",
-          "2研究潜力型更看重 Agent 理解、训练评测思路和长期成长空间。",
-          "3均衡型同时要求工程能力和 Agent 认知，但可能筛选门槛更高。",
-        ],
-        "pendingQuestionPlaceholders": 0,
-        "progress": "1 / 3",
-        "question": "你现在更想招哪类 Agent/Harness 候选人？",
-      }
-    `)
-
-    await composer.getByRole('radio', { name: '工程落地型' }).click()
-    await composer.getByText('2 / 3', { exact: true }).waitFor()
-    await composer.getByRole('button', { name: '跳过本题', exact: true }).click()
-    const planHeading = composer.getByRole('heading', { level: 1, name: '面试计划' })
-    await planHeading.waitFor()
-    expect({
-      code: await composer.locator('code').filter({ hasText: '偏好' }).innerText(),
-      headingTag: await planHeading.evaluate(element => element.tagName),
-      listItems: await composer.locator('li').allTextContents(),
-      strong: await composer.locator('strong').filter({ hasText: '按当前招聘目标' }).innerText(),
-    }).toMatchInlineSnapshot(`
-      {
-        "code": "偏好",
-        "headingTag": "H1",
-        "listItems": [
-          "按当前招聘目标选择",
-          "跳过则视为不设 偏好",
-        ],
-        "strong": "按当前招聘目标",
-      }
-    `)
-    // Exercise provider-sized plan detail through the assembled composer
-    // without making the shared fixture transcript permanently enormous.
-    await planHeading.evaluate((element) => {
-      const markdown = element.parentElement
-      if (markdown === null) throw new Error('Markdown detail root missing')
-      markdown.textContent = Array.from(
-        { length: 80 },
-        (_, index) => `Plan section ${String(index + 1)} keeps review context readable.`,
-      ).join(' ')
-    })
-    const scrollRegion = composer.locator('[data-question-scroll]')
-    const layout = await composer.evaluate((root) => {
-      const card = root.querySelector('section')
-      const scroller = root.querySelector('[data-question-scroll]')
-      const footer = root.querySelector('footer')
-      if (!(card instanceof HTMLElement) ||
-          !(scroller instanceof HTMLElement) ||
-          !(footer instanceof HTMLElement)) return null
-      const cardRect = card.getBoundingClientRect()
-      const footerRect = footer.getBoundingClientRect()
-      return {
-        cardClientHeight: card.clientHeight,
-        cardScrollHeight: card.scrollHeight,
-        footerInsideCard: footerRect.bottom <= cardRect.bottom,
-        scrollerClientHeight: scroller.clientHeight,
-        scrollerScrollHeight: scroller.scrollHeight,
-      }
-    })
-    expect(layout).not.toBeNull()
-    expect(layout?.cardScrollHeight).toBe(layout?.cardClientHeight)
-    expect(layout?.footerInsideCard).toBe(true)
-    expect(layout?.scrollerScrollHeight).toBeGreaterThan(layout?.scrollerClientHeight ?? 0)
-    await scrollRegion.evaluate((element) => { element.scrollTop = element.scrollHeight })
-    await expect.poll(() => scrollRegion.evaluate(element => element.scrollTop)).toBeGreaterThan(0)
-    await composer.getByRole('checkbox', { name: '系统设计' }).click()
-    await composer.getByRole('checkbox', { name: 'Agent 产品判断' }).click()
-    await composer.getByRole('checkbox', { name: 'Agent 产品判断' }).press('Enter')
-
-    await composer.waitFor({ state: 'detached' })
-    const restoredInput = page.locator('textarea[placeholder]')
-    await restoredInput.waitFor()
-    expect(await restoredInput.getAttribute('placeholder')).toBe('回复生成中，可停止后再输入')
-  })
-
-  it('stayed clean: no page errors across the whole load chain', () => {
-    expect(pageErrors).toEqual([])
-  })
-})

apps/web/tests/smoke-real.e2e.ts

@@ -1,13 +1,13 @@
 // W5 real-host smoke: spawn `dsh web` with a real key, walk the full W5 flow
 // list in a real chromium, screenshot every screen into .artifacts/ for the
 // figma comparison pass. Self-skips without DEEPSEEK_API_KEY (repo e2e
-// convention); the runner loads the repo-root .env explicitly because the CLI
-// only auto-loads .env from its cwd (a temp dir here, so sessions never land
-// in the repo's .sessions).
+// convention); vitest.web.config.ts loads the repo-root .env before this file
+// runs (the CLI only auto-loads .env from its cwd — a temp dir here, so
+// sessions never land in the repo's .sessions).
 //
 // Selector convention: CSS Modules hash as [hash]_[local], so class-substring
 // selectors are unreliable — anchor on data-* attributes (data-variant /
-// data-clickable / data-sample) or visible text. The one [class*=] use below
+// data-sample) or visible text. The one [class*=] use below
 // (frame/handle) rides local names that survive hashing as suffixes; prefer
 // data-* for anything new.
 //
@@ -24,18 +24,7 @@ import { pathToFileURL } from 'node:url'
 import type { Browser, Page } from 'playwright'
 import { chromium } from 'playwright'
 import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
-import { REPO_ROOT, probeFreePort, requireDist, saveFailureShot } from './support.ts'
-
-/** Repo-root .env → process.env (never overrides an already-set variable). */
-function loadRootEnv(): void {
-  const envPath = join(REPO_ROOT, '.env')
-  if (!existsSync(envPath)) return
-  for (const line of readFileSync(envPath, 'utf8').split('\n')) {
-    const m = /^([A-Za-z_][A-Za-z0-9_]*)=(.*)$/.exec(line.trim())
-    if (m !== null && process.env[m[1]!] === undefined) process.env[m[1]!] = m[2]
-  }
-}
-loadRootEnv()
+import { REPO_ROOT, connectFreshWorkspace, probeFreePort, requireDist, saveFailureShot } from './support.ts'
 
 function waitForReadyLine(child: ChildProcess): Promise<string> {
   return new Promise((resolveReady, reject) => {
@@ -100,8 +89,10 @@ function providerTitle(page: HistoryPage): string | undefined {
 
 function hasAssistantMarker(page: HistoryPage, marker: string): boolean {
   return page.events.some(({ event }) => {
-    if (event.type !== 'assistant/message' || !isRecord(event.data) || !Array.isArray(event.data.content)) return false
-    return event.data.content.some(block =>
+    if (event.type !== 'assistant/message' || !isRecord(event.data) || !isRecord(event.data.message)) return false
+    const content = event.data.message.content
+    if (!Array.isArray(content)) return false
+    return content.some(block =>
       isRecord(block) && block.type === 'text' && typeof block.text === 'string' && block.text.includes(marker))
   })
 }
@@ -144,12 +135,13 @@ async function detailsTrack(page: Page): Promise<number> {
   return Number(cols.split(' ').pop()!.replace('px', ''))
 }
 
-// Readiness gate: `dsh web` serves ALL ten manifest plugins; until every UI
+// Readiness gate: `dsh web` serves all ten production manifest plugins; until every UI
 // plugin's client bundle exists and exports apply, the loader fail-louds and
 // the frame never appears.
 const UI_PLUGIN_DIRS = [
-  'connection', 'runtime', 'ui-theme', 'i18n', 'ui-layout',
-  'ui-sidebar', 'ui-conversation', 'ui-plan', 'ui-question', 'ui-trajectory',
+  'connection', 'runtime', 'ui-theme', 'locale', 'ui-layout', 'ui-sidebar',
+  'ui-settings', 'ui-settings-general', 'ui-models', 'ui-conversation',
+  'ui-model', 'ui-question', 'ui-trajectory',
 ]
 const ROUND_DONE_MARKER = 'WEB_ROUND_DONE'
 const notReady = UI_PLUGIN_DIRS.filter((dir) => {
@@ -180,9 +172,6 @@ describe('dsh web keyless CLI smoke', () => {
       const readyUrl = await waitForReadyLine(child)
       expect(readyUrl).toMatch(/^http:\/\/127\.0\.0\.1:\d+$/)
       expect((await fetch(readyUrl)).status).toBe(200)
-      const created = await rpc<{ sessionId: string }>(readyUrl, 'session.create', {})
-      expect(await rpc(readyUrl, 'session.planMode', { sessionId: created.sessionId }))
-        .toEqual({ active: false })
     } finally {
       const closed = child.exitCode === null
         ? new Promise<void>((resolveClose) => { child.once('close', () => { resolveClose() }) })
@@ -193,7 +182,7 @@ describe('dsh web keyless CLI smoke', () => {
     }
   })
 
-  it('injects workspace instructions and the active Web plan policy into the provider request', async () => {
+  it('injects the invoking workspace AGENTS.md into the provider request', async () => {
     requireDist()
     const workspace = mkdtempSync(join(tmpdir(), 'dsh-web-workspace-'))
     mkdirSync(join(workspace, '.git'))
@@ -241,14 +230,10 @@ describe('dsh web keyless CLI smoke', () => {
     try {
       const baseUrl = await waitForReadyLine(child)
       const created = await rpc<{ sessionId: string }>(baseUrl, 'session.create', {})
-      expect(await rpc(baseUrl, 'session.setPlanMode', {
-        sessionId: created.sessionId, active: true,
-      })).toEqual({ active: false, pending: true })
       await rpc<{ accepted: true }>(baseUrl, 'session.prompt', {
         sessionId: created.sessionId,
         mode: 'queue',
         content: [{ type: 'text', text: 'go' }],
-        planMode: true,
       })
       const captured = await Promise.race([
         providerRequest,
@@ -258,11 +243,6 @@ describe('dsh web keyless CLI smoke', () => {
       ])
       const workspaceMessage = captured.messages?.find(message =>
         message.role === 'user' && message.content?.includes('web-workspace-context-probe'))
-      const systemMessage = captured.messages?.find(message => message.role === 'system')
-      expect(systemMessage?.content).toContain('Stay in plan mode until exit_plan_mode succeeds')
-      expect(systemMessage?.content).toContain('Do not edit or write files')
-      expect(await rpc(baseUrl, 'session.planMode', { sessionId: created.sessionId }))
-        .toEqual({ active: true })
       expect(workspaceMessage).toMatchInlineSnapshot(`
         {
           "content": "<system-reminder>
@@ -286,6 +266,83 @@ describe('dsh web keyless CLI smoke', () => {
       rmSync(workspace, { recursive: true, force: true })
     }
   })
+
+  it('DSH_TOOLS_MODE=code collapses the provider wire tools to run_code with the SDK prompt section', async () => {
+    requireDist()
+    const workspace = mkdtempSync(join(tmpdir(), 'dsh-web-code-mode-'))
+
+    interface CodeModeProviderRequest {
+      messages?: { role?: string; content?: string }[]
+      tools?: { function?: { name?: string } }[]
+    }
+    let resolveProviderRequest!: (request: CodeModeProviderRequest) => void
+    const providerRequest = new Promise<CodeModeProviderRequest>((resolve) => {
+      resolveProviderRequest = resolve
+    })
+    const provider = createServer((request, response) => {
+      let body = ''
+      request.setEncoding('utf8')
+      request.on('data', (chunk: string) => { body += chunk })
+      request.on('end', () => {
+        resolveProviderRequest(JSON.parse(body) as CodeModeProviderRequest)
+        response.writeHead(200, { 'content-type': 'text/event-stream' })
+        response.end([
+          'data: {"choices":[{"delta":{"role":"assistant","content":null,"reasoning_content":""}}]}',
+          'data: {"choices":[{"delta":{"content":"done"}}]}',
+          'data: {"choices":[{"delta":{"content":""},"finish_reason":"stop"}],"usage":{"prompt_tokens":3,"completion_tokens":1}}',
+          'data: [DONE]',
+          '',
+        ].join('\n\n'))
+      })
+    })
+    await new Promise<void>(resolve => provider.listen(0, '127.0.0.1', resolve))
+    const address = provider.address()
+    if (address === null || typeof address === 'string') throw new Error('mock provider did not bind a TCP port')
+    const tsxLoader = pathToFileURL(createRequire(join(REPO_ROOT, 'package.json')).resolve('tsx')).href
+    const child = spawn(
+      process.execPath,
+      ['--import', tsxLoader, join(REPO_ROOT, 'apps/cli/src/bin.ts'), 'web', '--port', '0'],
+      {
+        cwd: workspace,
+        env: {
+          ...process.env,
+          DEEPSEEK_API_KEY: 'keyless-web-code-mode',
+          DEEPSEEK_BASE_URL: `http://127.0.0.1:${address.port}`,
+          DSH_TOOLS_MODE: 'code',
+          DSH_HOME: join(workspace, '.dsh'),
+          TSX_TSCONFIG_PATH: join(REPO_ROOT, 'tsconfig.json'),
+        },
+        stdio: ['ignore', 'pipe', 'pipe'],
+      },
+    )
+    try {
+      const baseUrl = await waitForReadyLine(child)
+      const created = await rpc<{ sessionId: string }>(baseUrl, 'session.create', {})
+      await rpc<{ accepted: true }>(baseUrl, 'session.prompt', {
+        sessionId: created.sessionId,
+        mode: 'queue',
+        content: [{ type: 'text', text: 'go' }],
+      })
+      const captured = await Promise.race([
+        providerRequest,
+        new Promise<never>((_resolve, reject) => {
+          setTimeout(() => { reject(new Error('provider request not received in 10s')) }, 10_000).unref()
+        }),
+      ])
+      expect(captured.tools?.map(tool => tool.function?.name)).toEqual(['run_code'])
+      const system = captured.messages?.find(message => message.role === 'system')
+      expect(system?.content).toContain('## Writing code for run_code')
+      expect(system?.content).toContain('declare const tools')
+    } finally {
+      const closed = child.exitCode === null
+        ? new Promise<void>((resolveClose) => { child.once('close', () => { resolveClose() }) })
+        : Promise.resolve()
+      if (child.exitCode === null) child.kill('SIGTERM')
+      await closed
+      await new Promise<void>(resolveClose => provider.close(() => { resolveClose() }))
+      rmSync(workspace, { recursive: true, force: true })
+    }
+  })
 })
 
 describe.skipIf(!process.env.DEEPSEEK_API_KEY || notReady.length > 0)('web smoke (real host, real key, W5)', () => {
@@ -342,16 +399,16 @@ describe.skipIf(!process.env.DEEPSEEK_API_KEY || notReady.length > 0)('web smoke
 
   it('2+3 empty-state first send completes a real model round', async () => {
     onTestFailed(() => saveFailureShot(page, 'w5-first-round'))
+    // Fresh world: connect a Workspace so the composer starts live.
+    await connectFreshWorkspace(page)
     const input = page.locator('textarea').first()
     await input.waitFor({ timeout: 10_000 })
     await screen(page, '02-empty-state')
     const prompt = `Please answer this request carefully: explain event sourcing in two sentences, ending with exactly ${ROUND_DONE_MARKER}.`
     await input.fill(prompt)
     await input.press('Enter')
-    // startSession chain: session mounts, composer moves to the bottom.
-    // Regression pin (P0, 585671106): this send used to white-screen the tree
-    // (scope tag lost to a duplicate inlined runtime instance) — body going
-    // near-empty here means that class of bug is back.
+    // The first send must keep the session tree mounted; a near-empty body
+    // reveals a duplicate runtime bundle with incompatible scope tags.
     await page.waitForFunction(() => document.body.innerText.length > 50, undefined, { timeout: 15_000 })
     expect(pageErrors).toEqual([])
     await page.waitForFunction(
@@ -393,7 +450,7 @@ describe.skipIf(!process.env.DEEPSEEK_API_KEY || notReady.length > 0)('web smoke
     await screen(page, '07-back-to-chat')
   })
 
-  it('5 bash differential rendering: tool row click opens the details column', async () => {
+  it('5 bash differential rendering: tool row click leaves the details column collapsed', async () => {
     onTestFailed(() => saveFailureShot(page, 'w5-tool-details'))
     const input = page.locator('textarea').first()
     await input.fill('请用 bash 工具运行命令 echo w5marker 然后告诉我结果')
@@ -407,13 +464,9 @@ describe.skipIf(!process.env.DEEPSEEK_API_KEY || notReady.length > 0)('web smoke
     await screen(page, '08-bash-round')
     expect(await detailsTrack(page)).toBe(0)
     await toolRow.click()
-    // Selection channel: click writes selection + layout.openDetails.
-    await page.waitForFunction(() => {
-      const frame = document.querySelector('[class*="frame"]')
-      if (frame === null) return false
-      return Number(getComputedStyle(frame).gridTemplateColumns.split(' ').pop()!.replace('px', '')) > 0
-    }, undefined, { timeout: 10_000 })
-    await screen(page, '09-details-open')
+    // Tool rows no longer drive layout.openDetails; the column stays closed.
+    expect(await detailsTrack(page)).toBe(0)
+    await screen(page, '09-details-closed')
   }, 150_000)
 
   it('6 sidebar drag widens the column and persists across reload', async () => {

apps/web/tests/snapshots/code-mode-round/session.jsonl

@@ -0,0 +1,35 @@
+{"type":"session","version":0,"id":"{{sessionId}}","createdAt":1785013630399,"cwd":"{{cwd}}/workspace"}
+{"type":"turn/start","seq":0,"time":1785013630411,"data":{"turn":1,"trigger":{"kind":"message","source":{"kind":"user","rpcId":"{{rpcId}}"}}}}
+{"type":"user/message","seq":1,"time":1785013630411,"data":{"content":[{"type":"text","text":"Using ONE run_code program: run bash `echo CODE_ROUND_OK`, then read the file missing.txt catching its error in the program. Return an object with both outcomes. Then reply DONE and stop."}],"source":{"kind":"user","rpcId":"{{rpcId}}"}},"surfaceOp":"append"}
+{"type":"session/title","seq":2,"time":1785013630418,"data":{"title":"Using ONE run_code program: run","messageSeqs":[1],"source":{"kind":"fallback"}}}
+{"type":"step/start","seq":3,"time":1785013630479,"data":{"turn":1,"step":1}}
+{"type":"request/header","seq":4,"time":1785013630480,"data":{"header":{"config":{"provider":"deepseek","model":"deepseek-v4-flash"},"system":"{{system}}","tools":"{{tools}}","messagePrefix":["{{messagePrefix}}"]},"reason":"initial"}}
+{"type":"assistant/chunk","seq":5,"time":1785013631481,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":6,"time0":1785013631481,"data":{"turn":1,"step":1,"index":0,"dt":[182,27,0,0,1,39,1,0,11,0,0,1,0,25,0,1,0,0,25,28,0,0,0,26,1,0,0,0,0,25,1,0,0,0,0,28,1,0,0,0,23,1,0,1,0,0,25,1,0,0,0,26,0,0,0,26,0,26,0,0,1,25,1,0,0,0,0,25,1,26,0,1,26,29],"texts":["The"," user"," wants"," me"," to"," write"," a"," single"," `","run","_code","`"," program"," that",":\n","1","."," Runs"," bash"," to"," echo"," \"","CODE","_RO","UND","_OK","\"\n","2","."," T","ries"," to"," read"," a"," file"," \"","missing",".txt","\""," and"," catches"," the"," error","\n","3","."," Returns"," an"," object"," with"," both"," outcomes","\n","4","."," They"," also"," want"," me"," to"," reply"," \"","D","ONE","\""," and"," stop"," after","\n\n","Let"," me"," write"," this"," program","."]}}
+{"type":"assistant/chunk","seq":81,"time":1785013632219,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":1,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":82,"time0":1785013632220,"data":{"turn":1,"step":1,"index":1,"dt":[26,0,1,27,0,0,1,22,0,26,1,41,11,0,0,26,0,1,26,0,0,0,0,26,0,0,0,0,1,25,1,0,0,0,0,27,1,0,0,0,0,25,1,0,0,0,25,0,0,0,1,0,28,1,0,0,45,0,0,15,0,0,0,66,1,0,0,1,0,0,0,0,0,12,0,0,0,0,30,1,0,0,0,0,21,1,0,26,0,0,0,0,0,26,27,0,0,0,0,1,25,1,0,0,0,25,1,25,0,0,27,26,26,0,1,0,26,0],"id":"call_00_6VNoF1gDSerTBKoCfYSH3765","name":"run_code","args":["","{","\"","description","\"",": ","\"","Run"," bash"," echo"," and"," catch"," missing"," file"," read","\"",", ","\"","code","\"",": ","\"","\\n","const"," bash","Result"," ="," await"," tools",".b","ash","({\\n"," "," command",":"," \\\"","echo"," CODE","_RO","UND","_OK","\\\",\\n"," "," description",":"," \\\"","E","cho"," CODE","_RO","UND","_OK","\\\"\\n","});\\n\\n","let"," read","Error"," ="," null",";\\n","try"," {\\n"," "," await"," tools",".read","({"," file","_path",":"," \\\"","missing",".txt","\\\""," });\\n","}"," catch"," (","e",")"," {\\n"," "," read","Error"," ="," {\\n","   "," tool","Name",":"," e",".t","ool","Name",",\\n","   "," message",":"," e",".message","\\n"," "," };\\n","}\\n\\n","return"," {"," bash",":"," bash","Result",".stdout",".text",".trim","(),"," read","Error"," };\\n","\"","}"]}}
+{"type":"assistant/chunk","seq":201,"time":1785013633103,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user wants me to write a single `run_code` program that:\n1. Runs bash to echo \"CODE_ROUND_OK\"\n2. Tries to read a file \"missing.txt\" and catches the error\n3. Returns an object with both outcomes\n4. They also want me to reply \"DONE\" and stop after\n\nLet me write this program."}}}}
+{"type":"assistant/chunk","seq":202,"time":1785013633103,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":1,"block":{"type":"tool-call","id":"call_00_6VNoF1gDSerTBKoCfYSH3765","name":"run_code","arguments":"{\"description\": \"Run bash echo and catch missing file read\", \"code\": \"\\nconst bashResult = await tools.bash({\\n  command: \\\"echo CODE_ROUND_OK\\\",\\n  description: \\\"Echo CODE_ROUND_OK\\\"\\n});\\n\\nlet readError = null;\\ntry {\\n  await tools.read({ file_path: \\\"missing.txt\\\" });\\n} catch (e) {\\n  readError = {\\n    toolName: e.toolName,\\n    message: e.message\\n  };\\n}\\n\\nreturn { bash: bashResult.stdout.text.trim(), readError };\\n\"}"}}}}
+{"type":"assistant/chunk","seq":203,"time":1785013633104,"data":{"turn":1,"step":1,"chunk":{"type":"usage","usage":{"inputTokens":8082,"outputTokens":235,"cacheReadTokens":384,"reasoningTokens":75}}}}
+{"type":"assistant/chunk","seq":204,"time":1785013633104,"data":{"turn":1,"step":1,"chunk":{"type":"finish","reason":{"kind":"tool-calls"}}}}
+{"type":"assistant/message","seq":205,"time":1785013633108,"data":{"turn":1,"step":1,"content":[{"type":"reasoning","text":"The user wants me to write a single `run_code` program that:\n1. Runs bash to echo \"CODE_ROUND_OK\"\n2. Tries to read a file \"missing.txt\" and catches the error\n3. Returns an object with both outcomes\n4. They also want me to reply \"DONE\" and stop after\n\nLet me write this program."},{"type":"tool-call","id":"call_00_6VNoF1gDSerTBKoCfYSH3765","name":"run_code","arguments":"{\"description\": \"Run bash echo and catch missing file read\", \"code\": \"\\nconst bashResult = await tools.bash({\\n  command: \\\"echo CODE_ROUND_OK\\\",\\n  description: \\\"Echo CODE_ROUND_OK\\\"\\n});\\n\\nlet readError = null;\\ntry {\\n  await tools.read({ file_path: \\\"missing.txt\\\" });\\n} catch (e) {\\n  readError = {\\n    toolName: e.toolName,\\n    message: e.message\\n  };\\n}\\n\\nreturn { bash: bashResult.stdout.text.trim(), readError };\\n\"}"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":8082,"outputTokens":235,"cacheReadTokens":384,"reasoningTokens":75}},"sourceEventSeqs":[5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,100,101,102,103,104,105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,123,124,125,126,127,128,129,130,131,132,133,134,135,136,137,138,139,140,141,142,143,144,145,146,147,148,149,150,151,152,153,154,155,156,157,158,159,160,161,162,163,164,165,166,167,168,169,170,171,172,173,174,175,176,177,178,179,180,181,182,183,184,185,186,187,188,189,190,191,192,193,194,195,196,197,198,199,200,201,202,203,204],"surfaceOp":"append"}
+{"type":"tool/call","seq":206,"time":1785013633108,"data":{"turn":1,"step":1,"callId":"call_00_6VNoF1gDSerTBKoCfYSH3765","name":"run_code","arguments":"{\"description\": \"Run bash echo and catch missing file read\", \"code\": \"\\nconst bashResult = await tools.bash({\\n  command: \\\"echo CODE_ROUND_OK\\\",\\n  description: \\\"Echo CODE_ROUND_OK\\\"\\n});\\n\\nlet readError = null;\\ntry {\\n  await tools.read({ file_path: \\\"missing.txt\\\" });\\n} catch (e) {\\n  readError = {\\n    toolName: e.toolName,\\n    message: e.message\\n  };\\n}\\n\\nreturn { bash: bashResult.stdout.text.trim(), readError };\\n\"}"}}
+{"type":"tool/code-dispatch-start","seq":207,"time":1785013633173,"data":{"parentCallId":"call_00_6VNoF1gDSerTBKoCfYSH3765","subCallId":"call_00_6VNoF1gDSerTBKoCfYSH3765:code:1","name":"bash","arguments":{"command":"echo CODE_ROUND_OK","description":"Echo CODE_ROUND_OK"}}}
+{"type":"tool/code-dispatch","seq":208,"time":1785013633196,"data":{"parentCallId":"call_00_6VNoF1gDSerTBKoCfYSH3765","subCallId":"call_00_6VNoF1gDSerTBKoCfYSH3765:code:1","name":"bash","arguments":{"command":"echo CODE_ROUND_OK","description":"Echo CODE_ROUND_OK"},"isError":false,"content":[{"type":"text","text":"CODE_ROUND_OK\n"}]}}
+{"type":"tool/code-dispatch-start","seq":209,"time":1785013633197,"data":{"parentCallId":"call_00_6VNoF1gDSerTBKoCfYSH3765","subCallId":"call_00_6VNoF1gDSerTBKoCfYSH3765:code:2","name":"read","arguments":{"file_path":"missing.txt"}}}
+{"type":"tool/code-dispatch","seq":210,"time":1785013633198,"data":{"parentCallId":"call_00_6VNoF1gDSerTBKoCfYSH3765","subCallId":"call_00_6VNoF1gDSerTBKoCfYSH3765:code:2","name":"read","arguments":{"file_path":"missing.txt"},"isError":true,"content":[{"type":"text","text":"Error: cannot read \"{{cwd}}/workspace/missing.txt\": not found"}]}}
+{"type":"tool/result","seq":211,"time":1785013633201,"data":{"turn":1,"step":1,"callId":"call_00_6VNoF1gDSerTBKoCfYSH3765","content":[{"type":"text","text":"{\n  \"bash\": \"CODE_ROUND_OK\",\n  \"readError\": {\n    \"toolName\": \"read\",\n    \"message\": \"cannot read \\\"{{cwd}}/workspace/missing.txt\\\": not found\"\n  }\n}"}],"isError":false},"sourceEventSeqs":[206],"surfaceOp":"append"}
+{"type":"step/end","seq":212,"time":1785013633204,"data":{"turn":1,"step":1}}
+{"type":"step/start","seq":213,"time":1785013633207,"data":{"turn":1,"step":2}}
+{"type":"assistant/chunk","seq":214,"time":1785013633985,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":215,"time0":1785013633986,"data":{"turn":1,"step":2,"index":0,"dt":[106,27,1,0,0,23,1,29,0,1,25,1,22],"texts":["The"," program"," ran"," successfully","."," Let"," me"," now"," reply"," D","ONE"," as"," instructed","."]}}
+{"type":"assistant/chunk","seq":229,"time":1785013634223,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":1,"blockType":"text"}}}
+{"type":"assistant/chunk","seq":230,"time":1785013634223,"data":{"turn":1,"step":2,"chunk":{"type":"text-delta","index":1,"text":"D"}}}
+{"type":"assistant/chunk","seq":231,"time":1785013634223,"data":{"turn":1,"step":2,"chunk":{"type":"text-delta","index":1,"text":"ONE"}}}
+{"type":"assistant/chunk","seq":232,"time":1785013634223,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The program ran successfully. Let me now reply DONE as instructed."}}}}
+{"type":"assistant/chunk","seq":233,"time":1785013634223,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":1,"block":{"type":"text","text":"DONE"}}}}
+{"type":"assistant/chunk","seq":234,"time":1785013634223,"data":{"turn":1,"step":2,"chunk":{"type":"usage","usage":{"inputTokens":196,"outputTokens":17,"cacheReadTokens":8576,"reasoningTokens":14}}}}
+{"type":"assistant/chunk","seq":235,"time":1785013634223,"data":{"turn":1,"step":2,"chunk":{"type":"finish","reason":{"kind":"stop"}}}}
+{"type":"assistant/message","seq":236,"time":1785013634224,"data":{"turn":1,"step":2,"content":[{"type":"reasoning","text":"The program ran successfully. Let me now reply DONE as instructed."},{"type":"text","text":"DONE"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":196,"outputTokens":17,"cacheReadTokens":8576,"reasoningTokens":14}},"sourceEventSeqs":[214,215,216,217,218,219,220,221,222,223,224,225,226,227,228,229,230,231,232,233,234,235],"surfaceOp":"append"}
+{"type":"step/end","seq":237,"time":1785013634225,"data":{"turn":1,"step":2}}
+{"type":"turn/end","seq":238,"time":1785013634225,"data":{"turn":1,"reason":{"kind":"completed"}}}

apps/web/tests/snapshots/code-mode-round/ui.expected.md

@@ -0,0 +1,32 @@
+- banner:
+  - navigation "Session hierarchy":
+    - 'button "Using ONE run_code program: run" [disabled]'
+    - text: · 1 turns
+  - tablist:
+    - tab "Chat" [selected]
+    - tab "Trajectory"
+    - tab "Waterfall"
+- text: "Using ONE run_code program: run bash `echo CODE_ROUND_OK`, then read the file missing.txt catching its error in the program. Return an object with both outcomes. Then reply DONE and stop."
+- 'button "Think The user wants me to write a single `run_code` program that:"':
+  - img
+  - text: "Think The user wants me to write a single `run_code` program that:"
+- button:
+  - img
+- text: Code Run bash echo and catch missing file read Echo CODE_ROUND_OK
+- button
+- text: Read missing.txt
+- button "Think The program ran successfully. Let me now reply DONE as instructed.":
+  - img
+  - text: Think The program ran successfully. Let me now reply DONE as instructed.
+- paragraph: DONE
+- text: cache hit 52% · 17,490 tokens · 1 turns · 2 steps
+- textbox "Message the agent"
+- button "Add attachment":
+  - img
+- combobox "Access mode":
+  - option "Read-only" [selected]
+  - option "Read-write"
+- button "选择模型，当前 deepseek-v4-flash":
+  - text: deepseek-v4-flash
+  - img
+- button "Send message" [disabled]

apps/web/tests/snapshots/cordis-tool-round/session.jsonl

@@ -0,0 +1,56 @@
+{"type":"session","version":0,"id":"{{sessionId}}","createdAt":1785157562825,"cwd":"{{cwd}}/workspace"}
+{"type":"turn/start","seq":0,"time":1785157562881,"data":{"turn":1,"trigger":{"kind":"message","source":{"kind":"user","rpcId":"{{rpcId}}"}}}}
+{"type":"user/message","seq":1,"time":1785157562882,"data":{"content":[{"type":"text","text":"Use only Cordis tools. First call cordis_inspect with what \"temporary\". Then call cordis_mount with this exact code: \"return { name: \\\"snapshot-noop\\\", apply(ctx) {} }\". Read its returned id and call cordis_unmount with that exact id. After all three calls succeed, reply exactly CORDIS_UI_DONE and stop."}],"source":{"kind":"user","rpcId":"{{rpcId}}"}},"surfaceOp":"append"}
+{"type":"session/title","seq":2,"time":1785157562883,"data":{"title":"Use only Cordis tools. First","messageSeqs":[1],"source":{"kind":"fallback"}}}
+{"type":"step/start","seq":3,"time":1785157562937,"data":{"turn":1,"step":1}}
+{"type":"request/header","seq":4,"time":1785157562938,"data":{"header":{"config":{"provider":"deepseek","model":"deepseek-v4-flash","reasoningEffort":"high"},"system":"{{system}}","tools":"{{tools}}","messagePrefix":["{{messagePrefix}}"]},"reason":"initial"}}
+{"type":"assistant/chunk","seq":5,"time":1785157564667,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":6,"time0":1785157564667,"data":{"turn":1,"step":1,"index":0,"dt":[115,31,3,0,1,0,1,21,1,0,0,0,1,23,0,1,0,0,0,24,2,1,0,0,0,28,2,0,0,0,1,23,2,22,2,1,25,2,0,0,25,27,1,1,0,0,28,2,0,0,0,0,32,1,31,1,0,0,0,9,29,3,0,0,0,1,23,1,0,0,0,27,4,0,0,0,23,2,0,0],"texts":["The"," user"," wants"," me"," to",":\n","1","."," Call"," `","cord","is","_in","spect","`"," with"," `","what",":"," \"","t","emporary","\"`\n","2","."," Call"," `","cord","is","_m","ount","`"," with"," the"," exact"," code"," provided","\n","3","."," Read"," the"," returned"," id"," and"," call"," `","cord","is","_un","mount","`"," with"," that"," exact"," id","\n","4","."," Reply"," exactly"," \"","C","ORD","IS","_","UI","_D","ONE","\""," and"," stop","\n\n","Let"," me"," start"," with"," step"," ","1","."]}}
+{"type":"assistant/chunk","seq":87,"time":1785157565360,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":1,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":88,"time0":1785157565360,"data":{"turn":1,"step":1,"index":1,"dt":[15,2,0,0,25,2,0,0,27,1],"id":"call_00_KZk918WtlKan9pHMULIT8794","name":"cordis_inspect","args":["","{","\"","what","\"",": ","\"","t","emporary","\"","}"]}}
+{"type":"assistant/chunk","seq":99,"time":1785157565490,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user wants me to:\n1. Call `cordis_inspect` with `what: \"temporary\"`\n2. Call `cordis_mount` with the exact code provided\n3. Read the returned id and call `cordis_unmount` with that exact id\n4. Reply exactly \"CORDIS_UI_DONE\" and stop\n\nLet me start with step 1."}}}}
+{"type":"assistant/chunk","seq":100,"time":1785157565491,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":1,"block":{"type":"tool-call","id":"call_00_KZk918WtlKan9pHMULIT8794","name":"cordis_inspect","arguments":"{\"what\": \"temporary\"}"}}}}
+{"type":"assistant/chunk","seq":101,"time":1785157565491,"data":{"turn":1,"step":1,"chunk":{"type":"usage","usage":{"inputTokens":15137,"outputTokens":128,"cacheReadTokens":1280,"reasoningTokens":81}}}}
+{"type":"assistant/chunk","seq":102,"time":1785157565491,"data":{"turn":1,"step":1,"chunk":{"type":"finish","reason":{"kind":"tool-calls"}}}}
+{"type":"assistant/message","seq":103,"time":1785157565495,"data":{"turn":1,"step":1,"content":[{"type":"reasoning","text":"The user wants me to:\n1. Call `cordis_inspect` with `what: \"temporary\"`\n2. Call `cordis_mount` with the exact code provided\n3. Read the returned id and call `cordis_unmount` with that exact id\n4. Reply exactly \"CORDIS_UI_DONE\" and stop\n\nLet me start with step 1."},{"type":"tool-call","id":"call_00_KZk918WtlKan9pHMULIT8794","name":"cordis_inspect","arguments":"{\"what\": \"temporary\"}"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":15137,"outputTokens":128,"cacheReadTokens":1280,"reasoningTokens":81}},"sourceEventSeqs":[5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,100,101,102],"surfaceOp":"append"}
+{"type":"tool/call","seq":104,"time":1785157565496,"data":{"turn":1,"step":1,"callId":"call_00_KZk918WtlKan9pHMULIT8794","name":"cordis_inspect","arguments":"{\"what\": \"temporary\"}"}}
+{"type":"tool/result","seq":105,"time":1785157565500,"data":{"turn":1,"step":1,"callId":"call_00_KZk918WtlKan9pHMULIT8794","content":[{"type":"text","text":"## Temporary Plugins\nNo temporary Plugins are running. Temporary Plugins created with cordis_mount disappear when DSH restarts."}],"isError":false},"sourceEventSeqs":[104],"surfaceOp":"append"}
+{"type":"step/end","seq":106,"time":1785157565503,"data":{"turn":1,"step":1}}
+{"type":"step/start","seq":107,"time":1785157565503,"data":{"turn":1,"step":2}}
+{"type":"assistant/chunk","seq":108,"time":1785157566524,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":109,"time0":1785157566525,"data":{"turn":1,"step":2,"index":0,"dt":[105,30,2,0,0,24,2,0,0,27,2,1,0,25,0,0,0,1,0,39,1],"texts":["Good",","," no"," temporary"," plugins"," running","."," Now"," step"," ","2",":"," call"," cord","is","_m","ount"," with"," the"," exact"," code","."]}}
+{"type":"assistant/chunk","seq":131,"time":1785157566845,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":1,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":132,"time0":1785157566845,"data":{"turn":1,"step":2,"index":1,"dt":[42,4,1,0,0,15,2,0,0,0,16,0,0,0,0,1,23,2,0,0,25,7,18],"id":"call_00_OyrlxqqpnvzTe11sN5Oy2361","name":"cordis_mount","args":["","{","\"","code","\"",": ","\"","return"," {"," name",":"," \\\"","sn","apshot","-no","op","\\\","," apply","(ctx",")"," {}"," }","\"","}"]}}
+{"type":"assistant/chunk","seq":156,"time":1785157567041,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"Good, no temporary plugins running. Now step 2: call cordis_mount with the exact code."}}}}
+{"type":"assistant/chunk","seq":157,"time":1785157567041,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":1,"block":{"type":"tool-call","id":"call_00_OyrlxqqpnvzTe11sN5Oy2361","name":"cordis_mount","arguments":"{\"code\": \"return { name: \\\"snapshot-noop\\\", apply(ctx) {} }\"}"}}}}
+{"type":"assistant/chunk","seq":158,"time":1785157567042,"data":{"turn":1,"step":2,"chunk":{"type":"usage","usage":{"inputTokens":72,"outputTokens":82,"cacheReadTokens":16512,"reasoningTokens":22}}}}
+{"type":"assistant/chunk","seq":159,"time":1785157567042,"data":{"turn":1,"step":2,"chunk":{"type":"finish","reason":{"kind":"tool-calls"}}}}
+{"type":"assistant/message","seq":160,"time":1785157567043,"data":{"turn":1,"step":2,"content":[{"type":"reasoning","text":"Good, no temporary plugins running. Now step 2: call cordis_mount with the exact code."},{"type":"tool-call","id":"call_00_OyrlxqqpnvzTe11sN5Oy2361","name":"cordis_mount","arguments":"{\"code\": \"return { name: \\\"snapshot-noop\\\", apply(ctx) {} }\"}"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":72,"outputTokens":82,"cacheReadTokens":16512,"reasoningTokens":22}},"sourceEventSeqs":[108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,123,124,125,126,127,128,129,130,131,132,133,134,135,136,137,138,139,140,141,142,143,144,145,146,147,148,149,150,151,152,153,154,155,156,157,158,159],"surfaceOp":"append"}
+{"type":"tool/call","seq":161,"time":1785157567043,"data":{"turn":1,"step":2,"callId":"call_00_OyrlxqqpnvzTe11sN5Oy2361","name":"cordis_mount","arguments":"{\"code\": \"return { name: \\\"snapshot-noop\\\", apply(ctx) {} }\"}"}}
+{"type":"tool/result","seq":162,"time":1785157567049,"data":{"turn":1,"step":2,"callId":"call_00_OyrlxqqpnvzTe11sN5Oy2361","content":[{"type":"text","text":"Temporary Plugin dyn-1 is running (plugin \"snapshot-noop\"; available until unmounted or DSH restarts)."}],"isError":false},"sourceEventSeqs":[161],"surfaceOp":"append"}
+{"type":"step/end","seq":163,"time":1785157567050,"data":{"turn":1,"step":2}}
+{"type":"step/start","seq":164,"time":1785157567050,"data":{"turn":1,"step":3}}
+{"type":"assistant/chunk","seq":165,"time":1785157567835,"data":{"turn":1,"step":3,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":166,"time0":1785157567836,"data":{"turn":1,"step":3,"index":0,"dt":[83,25,2,0,0,26,1,1,0,0,0,41,2,0,0,0,0,8,2,0,0,0],"texts":["The"," id"," is"," \"","d","yn","-","1","\"."," Now"," step"," ","3",":"," call"," cord","is","_un","mount"," with"," that"," id","."]}}
+{"type":"assistant/chunk","seq":189,"time":1785157568117,"data":{"turn":1,"step":3,"chunk":{"type":"block-start","index":1,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":190,"time0":1785157568118,"data":{"turn":1,"step":3,"index":1,"dt":[17,2,1,24,2,0,1,25,0,0,0,29],"id":"call_00_e38S6zeYdZGvbhecUCil6659","name":"cordis_unmount","args":["","{","\"","id","\"",": ","\"","d","yn","-","1","\"","}"]}}
+{"type":"assistant/chunk","seq":203,"time":1785157568278,"data":{"turn":1,"step":3,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The id is \"dyn-1\". Now step 3: call cordis_unmount with that id."}}}}
+{"type":"assistant/chunk","seq":204,"time":1785157568279,"data":{"turn":1,"step":3,"chunk":{"type":"block-end","index":1,"block":{"type":"tool-call","id":"call_00_e38S6zeYdZGvbhecUCil6659","name":"cordis_unmount","arguments":"{\"id\": \"dyn-1\"}"}}}}
+{"type":"assistant/chunk","seq":205,"time":1785157568279,"data":{"turn":1,"step":3,"chunk":{"type":"usage","usage":{"inputTokens":63,"outputTokens":72,"cacheReadTokens":16640,"reasoningTokens":23}}}}
+{"type":"assistant/chunk","seq":206,"time":1785157568279,"data":{"turn":1,"step":3,"chunk":{"type":"finish","reason":{"kind":"tool-calls"}}}}
+{"type":"assistant/message","seq":207,"time":1785157568280,"data":{"turn":1,"step":3,"content":[{"type":"reasoning","text":"The id is \"dyn-1\". Now step 3: call cordis_unmount with that id."},{"type":"tool-call","id":"call_00_e38S6zeYdZGvbhecUCil6659","name":"cordis_unmount","arguments":"{\"id\": \"dyn-1\"}"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":63,"outputTokens":72,"cacheReadTokens":16640,"reasoningTokens":23}},"sourceEventSeqs":[165,166,167,168,169,170,171,172,173,174,175,176,177,178,179,180,181,182,183,184,185,186,187,188,189,190,191,192,193,194,195,196,197,198,199,200,201,202,203,204,205,206],"surfaceOp":"append"}
+{"type":"tool/call","seq":208,"time":1785157568280,"data":{"turn":1,"step":3,"callId":"call_00_e38S6zeYdZGvbhecUCil6659","name":"cordis_unmount","arguments":"{\"id\": \"dyn-1\"}"}}
+{"type":"tool/result","seq":209,"time":1785157568281,"data":{"turn":1,"step":3,"callId":"call_00_e38S6zeYdZGvbhecUCil6659","content":[{"type":"text","text":"Temporary Plugin dyn-1 was unmounted and removed."}],"isError":false},"sourceEventSeqs":[208],"surfaceOp":"append"}
+{"type":"step/end","seq":210,"time":1785157568282,"data":{"turn":1,"step":3}}
+{"type":"step/start","seq":211,"time":1785157568282,"data":{"turn":1,"step":4}}
+{"type":"assistant/chunk","seq":212,"time":1785157569185,"data":{"turn":1,"step":4,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":213,"time0":1785157569186,"data":{"turn":1,"step":4,"index":0,"dt":[165,26,26,1,0,27,9,17,2,1,0,0,0,44,1,0,0,1,0,6,3],"texts":["All"," three"," calls"," succeeded","."," I"," should"," now"," reply"," exactly"," \"","C","ORD","IS","_","UI","_D","ONE","\""," and"," stop","."]}}
+{"type":"assistant/chunk","seq":235,"time":1785157569515,"data":{"turn":1,"step":4,"chunk":{"type":"block-start","index":1,"blockType":"text"}}}
+{"type":"text-chunks","seq0":236,"time0":1785157569515,"data":{"turn":1,"step":4,"index":1,"dt":[0,0,35,1,0,0],"texts":["C","ORD","IS","_","UI","_D","ONE"]}}
+{"type":"assistant/chunk","seq":243,"time":1785157569551,"data":{"turn":1,"step":4,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"All three calls succeeded. I should now reply exactly \"CORDIS_UI_DONE\" and stop."}}}}
+{"type":"assistant/chunk","seq":244,"time":1785157569551,"data":{"turn":1,"step":4,"chunk":{"type":"block-end","index":1,"block":{"type":"text","text":"CORDIS_UI_DONE"}}}}
+{"type":"assistant/chunk","seq":245,"time":1785157569551,"data":{"turn":1,"step":4,"chunk":{"type":"usage","usage":{"inputTokens":29,"outputTokens":30,"cacheReadTokens":16768,"reasoningTokens":22}}}}
+{"type":"assistant/chunk","seq":246,"time":1785157569551,"data":{"turn":1,"step":4,"chunk":{"type":"finish","reason":{"kind":"stop"}}}}
+{"type":"assistant/message","seq":247,"time":1785157569553,"data":{"turn":1,"step":4,"content":[{"type":"reasoning","text":"All three calls succeeded. I should now reply exactly \"CORDIS_UI_DONE\" and stop."},{"type":"text","text":"CORDIS_UI_DONE"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":29,"outputTokens":30,"cacheReadTokens":16768,"reasoningTokens":22}},"sourceEventSeqs":[212,213,214,215,216,217,218,219,220,221,222,223,224,225,226,227,228,229,230,231,232,233,234,235,236,237,238,239,240,241,242,243,244,245,246],"surfaceOp":"append"}
+{"type":"step/end","seq":248,"time":1785157569554,"data":{"turn":1,"step":4}}
+{"type":"turn/end","seq":249,"time":1785157569554,"data":{"turn":1,"reason":{"kind":"completed"}}}

apps/web/tests/snapshots/cordis-tool-round/ui.expected.md

@@ -0,0 +1,48 @@
+- banner:
+  - navigation "Session hierarchy":
+    - button "Use only Cordis tools. First" [disabled]
+    - text: · 1 turns
+  - tablist:
+    - tab "Chat" [selected]
+    - tab "Trajectory"
+    - tab "Waterfall"
+- text: "Use only Cordis tools. First call cordis_inspect with what \"temporary\". Then call cordis_mount with this exact code: \"return { name: \\\"snapshot-noop\\\", apply(ctx) {} }\". Read its returned id and call cordis_unmount with that exact id. After all three calls succeed, reply exactly CORDIS_UI_DONE and stop."
+- button "复制":
+  - img
+- button "在新对话中分支":
+  - img
+- button "编辑":
+  - img
+- button "▸ 上下文注入"
+- button "Think The user wants me to:":
+  - img
+  - text: "Think The user wants me to:"
+- button:
+  - img
+- text: Inspect temporary
+- 'button "Think Good, no temporary plugins running. Now step 2: call cordis_mount with the exact code."':
+  - img
+  - text: "Think Good, no temporary plugins running. Now step 2: call cordis_mount with the exact code."
+- button [expanded]:
+  - img
+- text: Mount temporary Plugin typescript
+- button "复制"
+- code: "return { name: \"snapshot-noop\", apply(ctx) {} }"
+- 'button "Think The id is \"dyn-1\". Now step 3: call cordis_unmount with that id."':
+  - img
+  - text: "Think The id is \"dyn-1\". Now step 3: call cordis_unmount with that id."
+- button:
+  - img
+- text: Unmount temporary Plugin dyn-1
+- button "Think All three calls succeeded. I should now reply exactly \"CORDIS_UI_DONE\" and stop.":
+  - img
+  - text: Think All three calls succeeded. I should now reply exactly "CORDIS_UI_DONE" and stop.
+- paragraph: CORDIS_UI_DONE
+- text: cache hit 77% · 66,813 tokens · 1 turns · 4 steps
+- textbox "Message the agent"
+- button "Add attachment":
+  - img
+- combobox "Access mode":
+  - option "Read-only" [selected]
+  - option "Read-write"
+- button "Send message" [disabled]

apps/web/tests/snapshots/fresh-round-trip/session.jsonl

@@ -0,0 +1,31 @@
+{"type":"session","version":0,"id":"{{sessionId}}","createdAt":1784973850091,"cwd":"{{cwd}}/workspace"}
+{"type":"turn/start","seq":0,"time":1784973850102,"data":{"turn":1,"trigger":{"kind":"message","source":{"kind":"user","rpcId":"{{rpcId}}"}}}}
+{"type":"user/message","seq":1,"time":1784973850103,"data":{"content":[{"type":"text","text":"Use the bash tool to run exactly: echo WEB_E2E_OK. Then reply with the single word DONE and stop."}],"source":{"kind":"user","rpcId":"{{rpcId}}"}},"surfaceOp":"append"}
+{"type":"session/title","seq":2,"time":1784973850105,"data":{"title":"Use the bash tool to","messageSeqs":[1],"source":{"kind":"fallback"}}}
+{"type":"step/start","seq":3,"time":1784973850164,"data":{"turn":1,"step":1}}
+{"type":"request/header","seq":4,"time":1784973850165,"data":{"header":{"config":{"provider":"deepseek","model":"deepseek-v4-flash"},"system":"{{system}}","tools":"{{tools}}","messagePrefix":["{{messagePrefix}}"]},"reason":"initial"}}
+{"type":"assistant/chunk","seq":5,"time":1784973850888,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":6,"time0":1784973850889,"data":{"turn":1,"step":1,"index":0,"dt":[199,1,0,0,0,18,1,0,0,0,0,27,0,1,0,0],"texts":["The"," user"," wants"," me"," to"," run"," a"," simple"," bash"," command"," and"," reply"," with"," \"","D","ONE","\"."]}}
+{"type":"assistant/chunk","seq":23,"time":1784973851217,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":1,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":24,"time0":1784973851217,"data":{"turn":1,"step":1,"index":1,"dt":[27,0,0,0,1,26,0,0,1,27,0,0,1,26,0,26,1,0,0,26,27,0,29,0,0,26],"id":"call_00_BYXlxjFaalMg95YVqEeF2495","name":"bash","args":["","{","\"","command","\"",": ","\"","echo"," WEB","_E","2","E","_OK","\"",", ","\"","description","\"",": ","\"","E","cho"," the"," test"," string","\"","}"]}}
+{"type":"assistant/chunk","seq":51,"time":1784973851493,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user wants me to run a simple bash command and reply with \"DONE\"."}}}}
+{"type":"assistant/chunk","seq":52,"time":1784973851493,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":1,"block":{"type":"tool-call","id":"call_00_BYXlxjFaalMg95YVqEeF2495","name":"bash","arguments":"{\"command\": \"echo WEB_E2E_OK\", \"description\": \"Echo the test string\"}"}}}}
+{"type":"assistant/chunk","seq":53,"time":1784973851493,"data":{"turn":1,"step":1,"chunk":{"type":"usage","usage":{"inputTokens":122,"outputTokens":85,"cacheReadTokens":7680,"reasoningTokens":17}}}}
+{"type":"assistant/chunk","seq":54,"time":1784973851493,"data":{"turn":1,"step":1,"chunk":{"type":"finish","reason":{"kind":"tool-calls"}}}}
+{"type":"assistant/message","seq":55,"time":1784973851498,"data":{"turn":1,"step":1,"content":[{"type":"reasoning","text":"The user wants me to run a simple bash command and reply with \"DONE\"."},{"type":"tool-call","id":"call_00_BYXlxjFaalMg95YVqEeF2495","name":"bash","arguments":"{\"command\": \"echo WEB_E2E_OK\", \"description\": \"Echo the test string\"}"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":122,"outputTokens":85,"cacheReadTokens":7680,"reasoningTokens":17}},"sourceEventSeqs":[5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54],"surfaceOp":"append"}
+{"type":"tool/call","seq":56,"time":1784973851499,"data":{"turn":1,"step":1,"callId":"call_00_BYXlxjFaalMg95YVqEeF2495","name":"bash","arguments":"{\"command\": \"echo WEB_E2E_OK\", \"description\": \"Echo the test string\"}"}}
+{"type":"tool/result","seq":57,"time":1784973851515,"data":{"turn":1,"step":1,"callId":"call_00_BYXlxjFaalMg95YVqEeF2495","content":[{"type":"text","text":"WEB_E2E_OK\n"}],"isError":false},"sourceEventSeqs":[56],"surfaceOp":"append"}
+{"type":"step/end","seq":58,"time":1784973851517,"data":{"turn":1,"step":1}}
+{"type":"step/start","seq":59,"time":1784973851518,"data":{"turn":1,"step":2}}
+{"type":"assistant/chunk","seq":60,"time":1784973852194,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":61,"time0":1784973852195,"data":{"turn":1,"step":2,"index":0,"dt":[114,29,1,0,0,31,0,1,0,0,0,27,0,0,0,30,1,0,0,0,0,30],"texts":["The"," command"," executed"," successfully"," and"," output"," \"","WEB","_E","2","E","_OK","\"."," I"," just"," need"," to"," reply"," with"," \"","D","ONE","\"."]}}
+{"type":"assistant/chunk","seq":84,"time":1784973852459,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":1,"blockType":"text"}}}
+{"type":"assistant/chunk","seq":85,"time":1784973852459,"data":{"turn":1,"step":2,"chunk":{"type":"text-delta","index":1,"text":"D"}}}
+{"type":"assistant/chunk","seq":86,"time":1784973852459,"data":{"turn":1,"step":2,"chunk":{"type":"text-delta","index":1,"text":"ONE"}}}
+{"type":"assistant/chunk","seq":87,"time":1784973852459,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The command executed successfully and output \"WEB_E2E_OK\". I just need to reply with \"DONE\"."}}}}
+{"type":"assistant/chunk","seq":88,"time":1784973852460,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":1,"block":{"type":"text","text":"DONE"}}}}
+{"type":"assistant/chunk","seq":89,"time":1784973852460,"data":{"turn":1,"step":2,"chunk":{"type":"usage","usage":{"inputTokens":97,"outputTokens":26,"cacheReadTokens":7808,"reasoningTokens":23}}}}
+{"type":"assistant/chunk","seq":90,"time":1784973852460,"data":{"turn":1,"step":2,"chunk":{"type":"finish","reason":{"kind":"stop"}}}}
+{"type":"assistant/message","seq":91,"time":1784973852461,"data":{"turn":1,"step":2,"content":[{"type":"reasoning","text":"The command executed successfully and output \"WEB_E2E_OK\". I just need to reply with \"DONE\"."},{"type":"text","text":"DONE"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":97,"outputTokens":26,"cacheReadTokens":7808,"reasoningTokens":23}},"sourceEventSeqs":[60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90],"surfaceOp":"append"}
+{"type":"step/end","seq":92,"time":1784973852461,"data":{"turn":1,"step":2}}
+{"type":"turn/end","seq":93,"time":1784973852462,"data":{"turn":1,"reason":{"kind":"completed"}}}

apps/web/tests/snapshots/fresh-round-trip/ui.expected.md

@@ -0,0 +1,28 @@
+- banner:
+  - navigation "Session hierarchy":
+    - button "Use the bash tool to" [disabled]
+    - text: · 1 turns
+  - tablist:
+    - tab "Chat" [selected]
+    - tab "Trajectory"
+    - tab "Waterfall"
+- text: "Use the bash tool to run exactly: echo WEB_E2E_OK. Then reply with the single word DONE and stop."
+- button "Think The user wants me to run a simple bash command and reply with \"DONE\".":
+  - img
+  - text: Think The user wants me to run a simple bash command and reply with "DONE".
+- text: Echo the test string
+- button "Think The command executed successfully and output \"WEB_E2E_OK\". I just need to reply with \"DONE\".":
+  - img
+  - text: Think The command executed successfully and output "WEB_E2E_OK". I just need to reply with "DONE".
+- paragraph: DONE
+- text: cache hit 99% · 15,818 tokens · 1 turns · 2 steps
+- textbox "Message the agent"
+- button "Add attachment":
+  - img
+- combobox "Access mode":
+  - option "Read-only" [selected]
+  - option "Read-write"
+- button "选择模型，当前 deepseek-v4-flash":
+  - text: deepseek-v4-flash
+  - img
+- button "Send message" [disabled]

apps/web/tests/snapshots/lifecycle-chrome/hero.expected.md

@@ -0,0 +1,39 @@
+- button "Collapse sidebar":
+  - img
+- button "New session":
+  - img
+  - text: New Session
+- text: Workspaces
+- button "Group by":
+  - img
+- button "Create workspace":
+  - img
+- button "Search sessions":
+  - img
+- textbox "Search name, keywords..."
+- tree "Sessions":
+  - treeitem "workspace 1 session" [expanded]:
+    - img
+    - text: workspace 1 session
+  - treeitem "New Session now" [selected]
+- button "设置":
+  - img
+  - text: 设置
+- text: Let's start building
+- button "Choose workspace":
+  - img
+  - text: workspace
+  - img
+- textbox "Describe what you want to build"
+- button "Add attachment":
+  - img
+- combobox "Access mode":
+  - option "Read-only" [selected]
+  - option "Read-write"
+- button "选择模型，当前 deepseek-v4-flash":
+  - text: deepseek-v4-flash
+  - img
+- button "Send message" [disabled]
+- text: 详情
+- button "关闭详情"
+- text: 点击消息流中的工具行查看详情

apps/web/tests/snapshots/lifecycle-chrome/reloaded.expected.md

@@ -0,0 +1,24 @@
+- banner:
+  - navigation "Session hierarchy":
+    - button "Reply with the single word" [disabled]
+    - text: · 1 turns
+  - tablist:
+    - tab "Chat" [selected]
+    - tab "Trajectory"
+    - tab "Waterfall"
+- text: Reply with the single word LIGHTHOUSE and stop.
+- button "Think The user wants me to reply with a single word. Let me comply.":
+  - img
+  - text: Think The user wants me to reply with a single word. Let me comply.
+- paragraph: LIGHTHOUSE
+- text: cache hit 99% · 7,810 tokens · 1 turns · 1 steps
+- textbox "Message the agent"
+- button "Add attachment":
+  - img
+- combobox "Access mode":
+  - option "Read-only" [selected]
+  - option "Read-write"
+- button "选择模型，当前 deepseek-v4-flash":
+  - text: deepseek-v4-flash
+  - img
+- button "Send message" [disabled]

apps/web/tests/snapshots/lifecycle-chrome/session.jsonl

@@ -0,0 +1,17 @@
+{"type":"session","version":0,"id":"{{sessionId}}","createdAt":1785015039278,"cwd":"{{cwd}}/workspace"}
+{"type":"turn/start","seq":0,"time":1785015039291,"data":{"turn":1,"trigger":{"kind":"message","source":{"kind":"user","rpcId":"{{rpcId}}"}}}}
+{"type":"user/message","seq":1,"time":1785015039292,"data":{"content":[{"type":"text","text":"Reply with the single word LIGHTHOUSE and stop."}],"source":{"kind":"user","rpcId":"{{rpcId}}"}},"surfaceOp":"append"}
+{"type":"session/title","seq":2,"time":1785015039294,"data":{"title":"Reply with the single word","messageSeqs":[1],"source":{"kind":"fallback"}}}
+{"type":"step/start","seq":3,"time":1785015039362,"data":{"turn":1,"step":1}}
+{"type":"request/header","seq":4,"time":1785015039363,"data":{"header":{"config":{"provider":"deepseek","model":"deepseek-v4-flash"},"system":"{{system}}","tools":"{{tools}}","messagePrefix":["{{messagePrefix}}"]},"reason":"initial"}}
+{"type":"assistant/chunk","seq":5,"time":1785015039930,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":6,"time0":1785015039930,"data":{"turn":1,"step":1,"index":0,"dt":[162,28,1,0,0,46,1,0,0,0,11,0,0,30],"texts":["The"," user"," wants"," me"," to"," reply"," with"," a"," single"," word","."," Let"," me"," comply","."]}}
+{"type":"assistant/chunk","seq":21,"time":1785015040209,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":1,"blockType":"text"}}}
+{"type":"text-chunks","seq0":22,"time0":1785015040209,"data":{"turn":1,"step":1,"index":1,"dt":[1,0,30,1],"texts":["L","IGH","TH","O","USE"]}}
+{"type":"assistant/chunk","seq":27,"time":1785015040241,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user wants me to reply with a single word. Let me comply."}}}}
+{"type":"assistant/chunk","seq":28,"time":1785015040242,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":1,"block":{"type":"text","text":"LIGHTHOUSE"}}}}
+{"type":"assistant/chunk","seq":29,"time":1785015040242,"data":{"turn":1,"step":1,"chunk":{"type":"usage","usage":{"inputTokens":109,"outputTokens":21,"cacheReadTokens":7680,"reasoningTokens":15}}}}
+{"type":"assistant/chunk","seq":30,"time":1785015040242,"data":{"turn":1,"step":1,"chunk":{"type":"finish","reason":{"kind":"stop"}}}}
+{"type":"assistant/message","seq":31,"time":1785015040244,"data":{"turn":1,"step":1,"content":[{"type":"reasoning","text":"The user wants me to reply with a single word. Let me comply."},{"type":"text","text":"LIGHTHOUSE"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":109,"outputTokens":21,"cacheReadTokens":7680,"reasoningTokens":15}},"sourceEventSeqs":[5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30],"surfaceOp":"append"}
+{"type":"step/end","seq":32,"time":1785015040246,"data":{"turn":1,"step":1}}
+{"type":"turn/end","seq":33,"time":1785015040247,"data":{"turn":1,"reason":{"kind":"completed"}}}

apps/web/tests/snapshots/live-interactions/cancel.expected.md

@@ -0,0 +1,21 @@
+- banner:
+  - navigation "Session hierarchy":
+    - button "Reply with a one-sentence description" [disabled]
+    - text: · 1 turns
+  - tablist:
+    - tab "Chat" [selected]
+    - tab "Trajectory"
+    - tab "Waterfall"
+- text: Reply with a one-sentence description of event sourcing, then stop.
+- paragraph: partial
+- text: 已停止 0 tokens · 1 turns · 1 steps
+- textbox "Message the agent"
+- button "Add attachment":
+  - img
+- combobox "Access mode":
+  - option "Read-only" [selected]
+  - option "Read-write"
+- button "选择模型，当前 deepseek-v4-flash":
+  - text: deepseek-v4-flash
+  - img
+- button "Send message" [disabled]

apps/web/tests/snapshots/live-interactions/error-auth.expected.md

@@ -0,0 +1,19 @@
+- banner:
+  - navigation "Session hierarchy":
+    - button "Reply with a one-sentence description" [disabled]
+    - text: · 1 turns
+  - tablist:
+    - tab "Chat" [selected]
+    - tab "Trajectory"
+    - tab "Waterfall"
+- text: Reply with a one-sentence description of event sourcing, then stop.
+- textbox "Message the agent"
+- button "Add attachment":
+  - img
+- combobox "Access mode":
+  - option "Read-only" [selected]
+  - option "Read-write"
+- button "选择模型，当前 deepseek-v4-flash":
+  - text: deepseek-v4-flash
+  - img
+- button "Send message" [disabled]

apps/web/tests/snapshots/live-interactions/retry.expected.md

@@ -0,0 +1,24 @@
+- banner:
+  - navigation "Session hierarchy":
+    - button "Reply with a one-sentence description" [disabled]
+    - text: · 1 turns
+  - tablist:
+    - tab "Chat" [selected]
+    - tab "Trajectory"
+    - tab "Waterfall"
+- text: Reply with a one-sentence description of event sourcing, then stop.
+- button "Think The user is asking for a one-sentence description of event sourcing. This is a straightforward knowledge question that doesn't require any skill loading or tool calls.":
+  - img
+  - text: Think The user is asking for a one-sentence description of event sourcing. This is a straightforward knowledge question that doesn't require any skill loading or tool calls.
+- paragraph: Event sourcing is a pattern where all changes to an application's state are stored as an immutable, append-only sequence of events, rather than persisting only the current state, enabling full auditability, temporal queries, and event-driven architectures.
+- text: cache hit 99% · 7,869 tokens · 1 turns · 1 steps
+- textbox "Message the agent"
+- button "Add attachment":
+  - img
+- combobox "Access mode":
+  - option "Read-only" [selected]
+  - option "Read-write"
+- button "选择模型，当前 deepseek-v4-flash":
+  - text: deepseek-v4-flash
+  - img
+- button "Send message" [disabled]

apps/web/tests/snapshots/live-interactions/session.jsonl

@@ -0,0 +1,17 @@
+{"type":"session","version":0,"id":"{{sessionId}}","createdAt":1784998084441,"cwd":"{{cwd}}/workspace"}
+{"type":"turn/start","seq":0,"time":1784998084454,"data":{"turn":1,"trigger":{"kind":"message","source":{"kind":"user","rpcId":"{{rpcId}}"}}}}
+{"type":"user/message","seq":1,"time":1784998084454,"data":{"content":[{"type":"text","text":"Reply with a one-sentence description of event sourcing, then stop."}],"source":{"kind":"user","rpcId":"{{rpcId}}"}},"surfaceOp":"append"}
+{"type":"session/title","seq":2,"time":1784998084457,"data":{"title":"Reply with a one-sentence description","messageSeqs":[1],"source":{"kind":"fallback"}}}
+{"type":"step/start","seq":3,"time":1784998084519,"data":{"turn":1,"step":1}}
+{"type":"request/header","seq":4,"time":1784998084520,"data":{"header":{"config":{"provider":"deepseek","model":"deepseek-v4-flash"},"system":"{{system}}","tools":"{{tools}}","messagePrefix":["{{messagePrefix}}"]},"reason":"initial"}}
+{"type":"assistant/chunk","seq":5,"time":1784998084900,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":6,"time0":1784998084900,"data":{"turn":1,"step":1,"index":0,"dt":[153,3,0,29,1,0,0,28,0,1,0,0,0,28,0,0,0,29,1,0,29,0,0,29,0,0,36,0,21,29],"texts":["The"," user"," is"," asking"," for"," a"," one","-s","entence"," description"," of"," event"," sourcing","."," This"," is"," a"," straightforward"," knowledge"," question"," that"," doesn","'t"," require"," any"," skill"," loading"," or"," tool"," calls","."]}}
+{"type":"assistant/chunk","seq":37,"time":1784998085318,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":1,"blockType":"text"}}}
+{"type":"text-chunks","seq0":38,"time0":1784998085318,"data":{"turn":1,"step":1,"index":1,"dt":[0,28,0,0,29,1,28,29,1,0,0,33,0,0,28,0,25,0,1,29,1,0,0,0,0,28,0,30,0,0,0,29,1,27,0,29,1,30,0,28,0,0,0,28,0,31],"texts":["Event"," sourcing"," is"," a"," pattern"," where"," all"," changes"," to"," an"," application","'s"," state"," are"," stored"," as"," an"," immutable",","," append","-only"," sequence"," of"," events",","," rather"," than"," pers","isting"," only"," the"," current"," state",","," enabling"," full"," audit","ability",","," temporal"," queries",","," and"," event","-driven"," architectures","."]}}
+{"type":"assistant/chunk","seq":85,"time":1784998085814,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user is asking for a one-sentence description of event sourcing. This is a straightforward knowledge question that doesn't require any skill loading or tool calls."}}}}
+{"type":"assistant/chunk","seq":86,"time":1784998085814,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":1,"block":{"type":"text","text":"Event sourcing is a pattern where all changes to an application's state are stored as an immutable, append-only sequence of events, rather than persisting only the current state, enabling full auditability, temporal queries, and event-driven architectures."}}}}
+{"type":"assistant/chunk","seq":87,"time":1784998085814,"data":{"turn":1,"step":1,"chunk":{"type":"usage","usage":{"inputTokens":110,"outputTokens":79,"cacheReadTokens":7680,"reasoningTokens":31}}}}
+{"type":"assistant/chunk","seq":88,"time":1784998085814,"data":{"turn":1,"step":1,"chunk":{"type":"finish","reason":{"kind":"stop"}}}}
+{"type":"assistant/message","seq":89,"time":1784998085818,"data":{"turn":1,"step":1,"content":[{"type":"reasoning","text":"The user is asking for a one-sentence description of event sourcing. This is a straightforward knowledge question that doesn't require any skill loading or tool calls."},{"type":"text","text":"Event sourcing is a pattern where all changes to an application's state are stored as an immutable, append-only sequence of events, rather than persisting only the current state, enabling full auditability, temporal queries, and event-driven architectures."}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":110,"outputTokens":79,"cacheReadTokens":7680,"reasoningTokens":31}},"sourceEventSeqs":[5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88],"surfaceOp":"append"}
+{"type":"step/end","seq":90,"time":1784998085820,"data":{"turn":1,"step":1}}
+{"type":"turn/end","seq":91,"time":1784998085821,"data":{"turn":1,"reason":{"kind":"completed"}}}

apps/web/tests/snapshots/navigation-panes/seed.jsonl

@@ -0,0 +1,54 @@
+{"type":"session","version":0,"id":"{{sessionId}}","createdAt":1785011380476,"cwd":"{{cwd}}/workspace"}
+{"type":"turn/start","seq":0,"time":1785011380489,"data":{"turn":1,"trigger":{"kind":"message","source":{"kind":"user","rpcId":"{{rpcId}}"}}}}
+{"type":"user/message","seq":1,"time":1785011380490,"data":{"content":[{"type":"text","text":"NavScenario: first run bash to print exactly NAVIGATION_OK, then read nav-a.md and nav-b.md using two read calls in ONE assistant message, then reply with the single word FIRST_DONE and stop."}],"source":{"kind":"user","rpcId":"{{rpcId}}"}},"surfaceOp":"append"}
+{"type":"session/title","seq":2,"time":1785011380492,"data":{"title":"NavScenario: first run bash to","messageSeqs":[1],"source":{"kind":"fallback"}}}
+{"type":"step/start","seq":3,"time":1785011380549,"data":{"turn":1,"step":1}}
+{"type":"request/header","seq":4,"time":1785011380550,"data":{"header":{"config":{"provider":"deepseek","model":"deepseek-v4-flash"},"system":"{{system}}","tools":"{{tools}}","messagePrefix":["{{messagePrefix}}"]},"reason":"initial"}}
+{"type":"assistant/chunk","seq":5,"time":1785011380917,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":6,"time0":1785011380917,"data":{"turn":1,"step":1,"index":0,"dt":[110,25,1,0,0,25,1,0,26,0,1,0,27,1,0,0,0,26,1,0,0,26,0,0,0,0,1,25,0,0,25,0,1,0,0,0,26,1,0,25,0,0,27,1,0,0,0,0,25,28,0,1,0,0,0,27,0,0,0,25,1,24,1,0,25],"texts":["The"," user"," wants"," me"," to"," follow"," a"," specific"," navigation"," scenario","."," Let"," me",":\n\n","1","."," Run"," bash"," to"," print"," \"","NA","V","IG","ATION","_OK","\"\n","2","."," Read"," nav","-a",".md"," and"," nav","-b",".md"," in"," two"," read"," calls"," in"," ONE"," message","\n","3","."," Reply"," with"," \"","FIR","ST","_D","ONE","\"\n\n","Let"," me"," start"," with"," the"," bash"," command"," and"," the"," reads","."]}}
+{"type":"assistant/chunk","seq":72,"time":1785011381556,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":1,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":73,"time0":1785011381557,"data":{"turn":1,"step":1,"index":1,"dt":[0,0,26,0,0,0,25,1,26,0,0,1,33,1,17,0,0,0,28,1,0,0,0,24,1],"id":"call_00_kFKHaEXcTYEex0iDZw0C2432","name":"bash","args":["","{","\"","command","\"",": ","\"","echo"," NAV","IG","ATION","_OK","\"",", ","\"","description","\"",": ","\"","Print"," NAV","IG","ATION","_OK","\"","}"]}}
+{"type":"assistant/chunk","seq":99,"time":1785011381793,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":2,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":100,"time0":1785011381793,"data":{"turn":1,"step":1,"index":2,"dt":[26,0,0,0,1,27,0,0,0,26,1,23],"id":"call_01_tK4hIIRVTMgAvdzs7m9j6212","name":"read","args":["","{","\"","file","_path","\"",": ","\"","nav","-a",".md","\"","}"]}}
+{"type":"assistant/chunk","seq":113,"time":1785011381924,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":3,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":114,"time0":1785011381924,"data":{"turn":1,"step":1,"index":3,"dt":[26,1,0,26,0,0,0,26,0,0,0,26],"id":"call_02_k8Z6wGirxfnW96Iv8mkz9224","name":"read","args":["","{","\"","file","_path","\"",": ","\"","nav","-b",".md","\"","}"]}}
+{"type":"assistant/chunk","seq":127,"time":1785011382086,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user wants me to follow a specific navigation scenario. Let me:\n\n1. Run bash to print \"NAVIGATION_OK\"\n2. Read nav-a.md and nav-b.md in two read calls in ONE message\n3. Reply with \"FIRST_DONE\"\n\nLet me start with the bash command and the reads."}}}}
+{"type":"assistant/chunk","seq":128,"time":1785011382087,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":1,"block":{"type":"tool-call","id":"call_00_kFKHaEXcTYEex0iDZw0C2432","name":"bash","arguments":"{\"command\": \"echo NAVIGATION_OK\", \"description\": \"Print NAVIGATION_OK\"}"}}}}
+{"type":"assistant/chunk","seq":129,"time":1785011382087,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":2,"block":{"type":"tool-call","id":"call_01_tK4hIIRVTMgAvdzs7m9j6212","name":"read","arguments":"{\"file_path\": \"nav-a.md\"}"}}}}
+{"type":"assistant/chunk","seq":130,"time":1785011382087,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":3,"block":{"type":"tool-call","id":"call_02_k8Z6wGirxfnW96Iv8mkz9224","name":"read","arguments":"{\"file_path\": \"nav-b.md\"}"}}}}
+{"type":"assistant/chunk","seq":131,"time":1785011382087,"data":{"turn":1,"step":1,"chunk":{"type":"usage","usage":{"inputTokens":140,"outputTokens":197,"cacheReadTokens":7680,"reasoningTokens":66}}}}
+{"type":"assistant/chunk","seq":132,"time":1785011382087,"data":{"turn":1,"step":1,"chunk":{"type":"finish","reason":{"kind":"tool-calls"}}}}
+{"type":"assistant/message","seq":133,"time":1785011382091,"data":{"turn":1,"step":1,"content":[{"type":"reasoning","text":"The user wants me to follow a specific navigation scenario. Let me:\n\n1. Run bash to print \"NAVIGATION_OK\"\n2. Read nav-a.md and nav-b.md in two read calls in ONE message\n3. Reply with \"FIRST_DONE\"\n\nLet me start with the bash command and the reads."},{"type":"tool-call","id":"call_00_kFKHaEXcTYEex0iDZw0C2432","name":"bash","arguments":"{\"command\": \"echo NAVIGATION_OK\", \"description\": \"Print NAVIGATION_OK\"}"},{"type":"tool-call","id":"call_01_tK4hIIRVTMgAvdzs7m9j6212","name":"read","arguments":"{\"file_path\": \"nav-a.md\"}"},{"type":"tool-call","id":"call_02_k8Z6wGirxfnW96Iv8mkz9224","name":"read","arguments":"{\"file_path\": \"nav-b.md\"}"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":140,"outputTokens":197,"cacheReadTokens":7680,"reasoningTokens":66}},"sourceEventSeqs":[5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,100,101,102,103,104,105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,123,124,125,126,127,128,129,130,131,132],"surfaceOp":"append"}
+{"type":"tool/call","seq":134,"time":1785011382092,"data":{"turn":1,"step":1,"callId":"call_00_kFKHaEXcTYEex0iDZw0C2432","name":"bash","arguments":"{\"command\": \"echo NAVIGATION_OK\", \"description\": \"Print NAVIGATION_OK\"}"}}
+{"type":"tool/result","seq":135,"time":1785011382105,"data":{"turn":1,"step":1,"callId":"call_00_kFKHaEXcTYEex0iDZw0C2432","content":[{"type":"text","text":"NAVIGATION_OK\n"}],"isError":false},"sourceEventSeqs":[134],"surfaceOp":"append"}
+{"type":"tool/call","seq":136,"time":1785011382105,"data":{"turn":1,"step":1,"callId":"call_01_tK4hIIRVTMgAvdzs7m9j6212","name":"read","arguments":"{\"file_path\": \"nav-a.md\"}"}}
+{"type":"tool/call","seq":137,"time":1785011382106,"data":{"turn":1,"step":1,"callId":"call_02_k8Z6wGirxfnW96Iv8mkz9224","name":"read","arguments":"{\"file_path\": \"nav-b.md\"}"}}
+{"type":"tool/result","seq":138,"time":1785011382113,"data":{"turn":1,"step":1,"callId":"call_01_tK4hIIRVTMgAvdzs7m9j6212","content":[{"type":"text","text":"<path>{{cwd}}/workspace/nav-a.md</path>\n<type>file</type>\n<content>\n1: # alpha nav\n\n(End of file - total 1 lines)\n</content>"}],"isError":false},"sourceEventSeqs":[136],"surfaceOp":"append"}
+{"type":"tool/result","seq":139,"time":1785011382114,"data":{"turn":1,"step":1,"callId":"call_02_k8Z6wGirxfnW96Iv8mkz9224","content":[{"type":"text","text":"<path>{{cwd}}/workspace/nav-b.md</path>\n<type>file</type>\n<content>\n1: # beta nav\n\n(End of file - total 1 lines)\n</content>"}],"isError":false},"sourceEventSeqs":[137],"surfaceOp":"append"}
+{"type":"step/end","seq":140,"time":1785011382117,"data":{"turn":1,"step":1}}
+{"type":"step/start","seq":141,"time":1785011382118,"data":{"turn":1,"step":2}}
+{"type":"assistant/chunk","seq":142,"time":1785011382673,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":143,"time0":1785011382673,"data":{"turn":1,"step":2,"index":0,"dt":[90,27,27,1,0,0,0,26,1,0,0,0,0,27,0,0,0,0,27,0,0,27,0,0,0,0,1,25,1,0,0,0,0,26,1,0,0,0,0,25,1,0,26,1,0,0,0,0,26,1],"texts":["All"," three"," calls"," succeeded",":\n","1","."," bash"," printed"," \"","NA","V","IG","ATION","_OK","\"\n","2","."," nav","-a",".md"," contains"," \"#"," alpha"," nav","\"\n","3","."," nav","-b",".md"," contains"," \"#"," beta"," nav","\"\n\n","Now"," I"," need"," to"," reply"," with"," the"," single"," word"," \"","FIR","ST","_D","ONE","\"."]}}
+{"type":"assistant/chunk","seq":194,"time":1785011383060,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":1,"blockType":"text"}}}
+{"type":"text-chunks","seq0":195,"time0":1785011383060,"data":{"turn":1,"step":2,"index":1,"dt":[0,0,29],"texts":["FIR","ST","_D","ONE"]}}
+{"type":"assistant/chunk","seq":199,"time":1785011383090,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"All three calls succeeded:\n1. bash printed \"NAVIGATION_OK\"\n2. nav-a.md contains \"# alpha nav\"\n3. nav-b.md contains \"# beta nav\"\n\nNow I need to reply with the single word \"FIRST_DONE\"."}}}}
+{"type":"assistant/chunk","seq":200,"time":1785011383090,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":1,"block":{"type":"text","text":"FIRST_DONE"}}}}
+{"type":"assistant/chunk","seq":201,"time":1785011383090,"data":{"turn":1,"step":2,"chunk":{"type":"usage","usage":{"inputTokens":349,"outputTokens":56,"cacheReadTokens":7808,"reasoningTokens":51}}}}
+{"type":"assistant/chunk","seq":202,"time":1785011383090,"data":{"turn":1,"step":2,"chunk":{"type":"finish","reason":{"kind":"stop"}}}}
+{"type":"assistant/message","seq":203,"time":1785011383091,"data":{"turn":1,"step":2,"content":[{"type":"reasoning","text":"All three calls succeeded:\n1. bash printed \"NAVIGATION_OK\"\n2. nav-a.md contains \"# alpha nav\"\n3. nav-b.md contains \"# beta nav\"\n\nNow I need to reply with the single word \"FIRST_DONE\"."},{"type":"text","text":"FIRST_DONE"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":349,"outputTokens":56,"cacheReadTokens":7808,"reasoningTokens":51}},"sourceEventSeqs":[142,143,144,145,146,147,148,149,150,151,152,153,154,155,156,157,158,159,160,161,162,163,164,165,166,167,168,169,170,171,172,173,174,175,176,177,178,179,180,181,182,183,184,185,186,187,188,189,190,191,192,193,194,195,196,197,198,199,200,201,202],"surfaceOp":"append"}
+{"type":"step/end","seq":204,"time":1785011383091,"data":{"turn":1,"step":2}}
+{"type":"turn/end","seq":205,"time":1785011383092,"data":{"turn":1,"reason":{"kind":"completed"}}}
+{"type":"turn/start","seq":206,"time":1785011383106,"data":{"turn":2,"trigger":{"kind":"message","source":{"kind":"user","rpcId":"{{rpcId}}"}}}}
+{"type":"user/message","seq":207,"time":1785011383107,"data":{"content":[{"type":"text","text":"Reply in markdown with: a level-2 heading \"Navigation Summary\", a bulleted list of exactly two items, and a fenced code block containing echo WATERFALL. Then stop."}],"source":{"kind":"user","rpcId":"{{rpcId}}"}},"surfaceOp":"append"}
+{"type":"step/start","seq":208,"time":1785011383107,"data":{"turn":2,"step":1}}
+{"type":"assistant/chunk","seq":209,"time":1785011383497,"data":{"turn":2,"step":1,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":210,"time0":1785011383497,"data":{"turn":2,"step":1,"index":0,"dt":[125,23,1,0,0,88,0,0,5,0,1,0,0,7,0],"texts":["The"," user"," wants"," me"," to"," reply"," with"," a"," specific"," format","."," Let"," me"," do"," that","."]}}
+{"type":"assistant/chunk","seq":226,"time":1785011383748,"data":{"turn":2,"step":1,"chunk":{"type":"block-start","index":1,"blockType":"text"}}}
+{"type":"text-chunks","seq0":227,"time0":1785011383748,"data":{"turn":2,"step":1,"index":1,"dt":[24,1,25,0,0,25,26,1,0,0,0,25,0,0,0,1,26,1],"texts":["##"," Navigation"," Summary","\n\n","-"," alpha"," nav","\n","-"," beta"," nav","\n\n","```\n","echo"," WATER","F","ALL","\n","```"]}}
+{"type":"assistant/chunk","seq":246,"time":1785011383903,"data":{"turn":2,"step":1,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user wants me to reply with a specific format. Let me do that."}}}}
+{"type":"assistant/chunk","seq":247,"time":1785011383903,"data":{"turn":2,"step":1,"chunk":{"type":"block-end","index":1,"block":{"type":"text","text":"## Navigation Summary\n\n- alpha nav\n- beta nav\n\n```\necho WATERFALL\n```"}}}}
+{"type":"assistant/chunk","seq":248,"time":1785011383903,"data":{"turn":2,"step":1,"chunk":{"type":"usage","usage":{"inputTokens":141,"outputTokens":36,"cacheReadTokens":8064,"reasoningTokens":16}}}}
+{"type":"assistant/chunk","seq":249,"time":1785011383903,"data":{"turn":2,"step":1,"chunk":{"type":"finish","reason":{"kind":"stop"}}}}
+{"type":"assistant/message","seq":250,"time":1785011383904,"data":{"turn":2,"step":1,"content":[{"type":"reasoning","text":"The user wants me to reply with a specific format. Let me do that."},{"type":"text","text":"## Navigation Summary\n\n- alpha nav\n- beta nav\n\n```\necho WATERFALL\n```"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":141,"outputTokens":36,"cacheReadTokens":8064,"reasoningTokens":16}},"sourceEventSeqs":[209,210,211,212,213,214,215,216,217,218,219,220,221,222,223,224,225,226,227,228,229,230,231,232,233,234,235,236,237,238,239,240,241,242,243,244,245,246,247,248,249],"surfaceOp":"append"}
+{"type":"step/end","seq":251,"time":1785011383904,"data":{"turn":2,"step":1}}
+{"type":"turn/end","seq":252,"time":1785011383904,"data":{"turn":2,"reason":{"kind":"completed"}}}

apps/web/tests/snapshots/navigation-panes/trajectory.expected.md

@@ -0,0 +1 @@
+- text: "Turn 1 Message {{duration}} #1 User NavScenario: first run bash to print exactly NAVIGATION_OK, then read nav-a.md and nav-b.md using two read calls in ONE assistant message, then reply with the single word FIRST_DONE and stop. +{{duration}} Step 1 {{duration}} bash read×2 #2 Tool bash · {\"command\": \"echo NAVIGATION_OK\", \"description\": \"Print NAVIGATION_OK\"} +{{duration}} #3 Tool read · {\"file_path\": \"nav-a.md\"} +{{duration}} #4 Tool read · {\"file_path\": \"nav-b.md\"} +{{duration}} Step 2 {{duration}} #5 Message FIRST_DONE 349 56 51 +{{duration}} Turn 2 Message {{duration}} #6 User Reply in markdown with: a level-2 heading \"Navigation Summary\", a bulleted list of exactly two items, and a fenced code block containing echo WATERFALL. Then stop. +{{duration}} Step 1 {{duration}} #7 Message ## Navigation Summary - alpha nav - beta nav ``` echo WATERFALL ``` 141 36 16 +{{duration}}"

apps/web/tests/snapshots/navigation-panes/waterfall.expected.md

@@ -0,0 +1 @@
+- text: 3 turns · 3 steps · 3 tool calls turn 0 turn 1 turn 2

apps/web/tests/snapshots/question-composer/answered.expected.md

@@ -0,0 +1,36 @@
+- banner:
+  - navigation "Session hierarchy":
+    - button "Use the ask_user_question tool to" [disabled]
+    - text: · 1 turns
+  - tablist:
+    - tab "Chat" [selected]
+    - tab "Trajectory"
+    - tab "Waterfall"
+- text: "Use the ask_user_question tool to ask me exactly one question with id \"color\", question \"Which color do you prefer?\", header \"Pick one\", and two options: label \"Blue\" with description \"A cool recessive hue that reads as calm and trustworthy in long reading sessions and dense dashboards.\", and label \"Green\" with description \"A restful mid-spectrum hue with the highest perceived brightness, easiest on the eye over long sessions.\" After I answer, reply with the single word DONE and stop."
+- button "复制":
+  - img
+- button "在新对话中分支":
+  - img
+- button "编辑":
+  - img
+- button "Think The user wants me to use the ask_user_question tool with specific parameters. Let me do exactly that.":
+  - img
+  - text: Think The user wants me to use the ask_user_question tool with specific parameters. Let me do exactly that.
+- button:
+  - img
+- text: "Tool call ask_user_question · {\"questions\": [{\"id\": \"color\", \"question\": \"Which color do you prefer?\", \"header\": \"Pick one\", \"options\": [{\"label\": \"Blue\", \"description\": \"A cool recessive hue that reads as calm and trustworthy in long reading sessions and dense dashboards.\"}, {\"label\": \"Green\", \"description\": \"A restful mid-spectrum hue with the highest perceived brightness, easiest on the eye over long sessions.\"}]}]}"
+- button "Think The user answered \"Blue\". I should now reply with the single word DONE and stop.":
+  - img
+  - text: Think The user answered "Blue". I should now reply with the single word DONE and stop.
+- paragraph: DONE
+- text: cache hit 95% · 8,769 tokens · 1 turns · 2 steps
+- textbox "Message the agent"
+- button "Add attachment":
+  - img
+- combobox "Access mode":
+  - option "Read-only" [selected]
+  - option "Read-write"
+- button "选择模型，当前 deepseek-v4-flash":
+  - text: deepseek-v4-flash
+  - img
+- button "Send message" [disabled]

apps/web/tests/snapshots/question-composer/session.jsonl

@@ -0,0 +1,31 @@
+{"type":"session","version":0,"id":"{{sessionId}}","createdAt":1785150167878,"cwd":"{{cwd}}/workspace"}
+{"type":"turn/start","seq":0,"time":1785150167924,"data":{"turn":1,"trigger":{"kind":"message","source":{"kind":"user","rpcId":"{{rpcId}}"}}}}
+{"type":"user/message","seq":1,"time":1785150167925,"data":{"content":[{"type":"text","text":"Use the ask_user_question tool to ask me exactly one question with id \"color\", question \"Which color do you prefer?\", header \"Pick one\", and two options: label \"Blue\" with description \"A cool recessive hue that reads as calm and trustworthy in long reading sessions and dense dashboards.\", and label \"Green\" with description \"A restful mid-spectrum hue with the highest perceived brightness, easiest on the eye over long sessions.\" After I answer, reply with the single word DONE and stop."}],"source":{"kind":"user","rpcId":"{{rpcId}}"}},"surfaceOp":"append"}
+{"type":"session/title","seq":2,"time":1785150167927,"data":{"title":"Use the ask_user_question tool to","messageSeqs":[1],"source":{"kind":"fallback"}}}
+{"type":"step/start","seq":3,"time":1785150167928,"data":{"turn":1,"step":1}}
+{"type":"request/header","seq":4,"time":1785150167929,"data":{"header":{"config":{"provider":"deepseek","model":"deepseek-v4-flash"},"system":"{{system}}","tools":"{{tools}}"},"reason":"initial"}}
+{"type":"assistant/chunk","seq":5,"time":1785150168452,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":6,"time0":1785150168452,"data":{"turn":1,"step":1,"index":0,"dt":[87,26,1,0,0,0,38,0,0,0,0,1,12,27,0,27,0,0,1,25,0],"texts":["The"," user"," wants"," me"," to"," use"," the"," ask","_user","_","question"," tool"," with"," specific"," parameters","."," Let"," me"," do"," exactly"," that","."]}}
+{"type":"assistant/chunk","seq":28,"time":1785150168775,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":1,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":29,"time0":1785150168776,"data":{"turn":1,"step":1,"index":1,"dt":[25,1,0,0,0,25,0,0,0,26,1,0,0,0,0,25,1,0,0,0,0,25,1,0,0,0,0,25,1,0,0,0,1,25,0,0,0,0,1,25,1,0,0,0,0,25,1,0,0,26,0,0,1,0,24,1,0,0,0,1,26,1,0,0,0,0,25,0,1,0,0,0,25,1,0,0,25,0,0,0,0,1,25,0,0,1,0,0,25,0,0,0,1,0,26,1,24],"id":"call_00_Cijldc88LYmVPCXYUsRq1617","name":"ask_user_question","args":["","{","\"","questions","\"",": ","[","{\"","id","\":"," \"","color","\","," \"","question","\":"," \"","Which"," color"," do"," you"," prefer","?\","," \"","header","\":"," \"","Pick"," one","\","," \"","options","\":"," [","{\"","label","\":"," \"","Blue","\","," \"","description","\":"," \"","A"," cool"," recessive"," hue"," that"," reads"," as"," calm"," and"," trustworthy"," in"," long"," reading"," sessions"," and"," dense"," dash","boards",".\"","},"," {\"","label","\":"," \"","Green","\","," \"","description","\":"," \"","A"," rest","ful"," mid","-spect","rum"," hue"," with"," the"," highest"," perceived"," brightness",","," easiest"," on"," the"," eye"," over"," long"," sessions",".\"","}]","}]","}"]}}
+{"type":"assistant/chunk","seq":127,"time":1785150169308,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user wants me to use the ask_user_question tool with specific parameters. Let me do exactly that."}}}}
+{"type":"assistant/chunk","seq":128,"time":1785150169308,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":1,"block":{"type":"tool-call","id":"call_00_Cijldc88LYmVPCXYUsRq1617","name":"ask_user_question","arguments":"{\"questions\": [{\"id\": \"color\", \"question\": \"Which color do you prefer?\", \"header\": \"Pick one\", \"options\": [{\"label\": \"Blue\", \"description\": \"A cool recessive hue that reads as calm and trustworthy in long reading sessions and dense dashboards.\"}, {\"label\": \"Green\", \"description\": \"A restful mid-spectrum hue with the highest perceived brightness, easiest on the eye over long sessions.\"}]}]}"}}}}
+{"type":"assistant/chunk","seq":129,"time":1785150169308,"data":{"turn":1,"step":1,"chunk":{"type":"usage","usage":{"inputTokens":113,"outputTokens":158,"cacheReadTokens":4096,"reasoningTokens":22}}}}
+{"type":"assistant/chunk","seq":130,"time":1785150169308,"data":{"turn":1,"step":1,"chunk":{"type":"finish","reason":{"kind":"tool-calls"}}}}
+{"type":"assistant/message","seq":131,"time":1785150169311,"data":{"turn":1,"step":1,"content":[{"type":"reasoning","text":"The user wants me to use the ask_user_question tool with specific parameters. Let me do exactly that."},{"type":"tool-call","id":"call_00_Cijldc88LYmVPCXYUsRq1617","name":"ask_user_question","arguments":"{\"questions\": [{\"id\": \"color\", \"question\": \"Which color do you prefer?\", \"header\": \"Pick one\", \"options\": [{\"label\": \"Blue\", \"description\": \"A cool recessive hue that reads as calm and trustworthy in long reading sessions and dense dashboards.\"}, {\"label\": \"Green\", \"description\": \"A restful mid-spectrum hue with the highest perceived brightness, easiest on the eye over long sessions.\"}]}]}"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":113,"outputTokens":158,"cacheReadTokens":4096,"reasoningTokens":22}},"sourceEventSeqs":[5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,100,101,102,103,104,105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,123,124,125,126,127,128,129,130],"surfaceOp":"append"}
+{"type":"tool/call","seq":132,"time":1785150169312,"data":{"turn":1,"step":1,"callId":"call_00_Cijldc88LYmVPCXYUsRq1617","name":"ask_user_question","arguments":"{\"questions\": [{\"id\": \"color\", \"question\": \"Which color do you prefer?\", \"header\": \"Pick one\", \"options\": [{\"label\": \"Blue\", \"description\": \"A cool recessive hue that reads as calm and trustworthy in long reading sessions and dense dashboards.\"}, {\"label\": \"Green\", \"description\": \"A restful mid-spectrum hue with the highest perceived brightness, easiest on the eye over long sessions.\"}]}]}"}}
+{"type":"tool/result","seq":133,"time":1785150169787,"data":{"turn":1,"step":1,"callId":"call_00_Cijldc88LYmVPCXYUsRq1617","content":[{"type":"text","text":"{\"answers\":[{\"id\":\"color\",\"selected\":[\"Blue\"]}]}"}],"isError":false},"sourceEventSeqs":[132],"surfaceOp":"append"}
+{"type":"step/end","seq":134,"time":1785150169790,"data":{"turn":1,"step":1}}
+{"type":"step/start","seq":135,"time":1785150169790,"data":{"turn":1,"step":2}}
+{"type":"assistant/chunk","seq":136,"time":1785150170605,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":137,"time0":1785150170606,"data":{"turn":1,"step":2,"index":0,"dt":[111,29,0,0,0,1,34,0,0,17,1,29,0,0,0,0,1,26],"texts":["The"," user"," answered"," \"","Blue","\"."," I"," should"," now"," reply"," with"," the"," single"," word"," D","ONE"," and"," stop","."]}}
+{"type":"assistant/chunk","seq":156,"time":1785150170856,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":1,"blockType":"text"}}}
+{"type":"assistant/chunk","seq":157,"time":1785150170856,"data":{"turn":1,"step":2,"chunk":{"type":"text-delta","index":1,"text":"D"}}}
+{"type":"assistant/chunk","seq":158,"time":1785150170856,"data":{"turn":1,"step":2,"chunk":{"type":"text-delta","index":1,"text":"ONE"}}}
+{"type":"assistant/chunk","seq":159,"time":1785150170856,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user answered \"Blue\". I should now reply with the single word DONE and stop."}}}}
+{"type":"assistant/chunk","seq":160,"time":1785150170856,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":1,"block":{"type":"text","text":"DONE"}}}}
+{"type":"assistant/chunk","seq":161,"time":1785150170856,"data":{"turn":1,"step":2,"chunk":{"type":"usage","usage":{"inputTokens":284,"outputTokens":22,"cacheReadTokens":4096,"reasoningTokens":19}}}}
+{"type":"assistant/chunk","seq":162,"time":1785150170856,"data":{"turn":1,"step":2,"chunk":{"type":"finish","reason":{"kind":"stop"}}}}
+{"type":"assistant/message","seq":163,"time":1785150170857,"data":{"turn":1,"step":2,"content":[{"type":"reasoning","text":"The user answered \"Blue\". I should now reply with the single word DONE and stop."},{"type":"text","text":"DONE"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":284,"outputTokens":22,"cacheReadTokens":4096,"reasoningTokens":19}},"sourceEventSeqs":[136,137,138,139,140,141,142,143,144,145,146,147,148,149,150,151,152,153,154,155,156,157,158,159,160,161,162],"surfaceOp":"append"}
+{"type":"step/end","seq":164,"time":1785150170858,"data":{"turn":1,"step":2}}
+{"type":"turn/end","seq":165,"time":1785150170858,"data":{"turn":1,"reason":{"kind":"completed"}}}

apps/web/tests/snapshots/question-composer/ui.expected.md

@@ -0,0 +1,23 @@
+- region "Which color do you prefer?":
+  - text: Pick one
+  - heading "Which color do you prefer?" [level=2]
+  - text: 1 / 1
+  - button "上一题" [disabled]:
+    - img
+  - button "下一题" [disabled]:
+    - img
+  - button "放弃整组问题":
+    - img
+  - radiogroup:
+    - radio "Blue":
+      - text: 1 Blue A cool recessive hue that reads as calm and trustworthy in long reading sessions and dense dashboards.
+      - img
+    - radio "Green":
+      - text: 2 Green A restful mid-spectrum hue with the highest perceived brightness, easiest on the eye over long sessions.
+      - img
+    - button "其他，请填写自定义答案":
+      - img
+      - text: 其他，请填写自定义答案
+  - status
+  - button "跳过本题"
+  - button "提交" [disabled]

apps/web/tests/snapshots/seeded-history/seed.jsonl

@@ -0,0 +1,36 @@
+{"type":"session","version":0,"id":"{{sessionId}}","createdAt":1784974100747,"cwd":"{{cwd}}/workspace"}
+{"type":"turn/start","seq":0,"time":1784974100758,"data":{"turn":1,"trigger":{"kind":"message","source":{"kind":"user","rpcId":"{{rpcId}}"}}}}
+{"type":"user/message","seq":1,"time":1784974100759,"data":{"content":[{"type":"text","text":"Use the read tool twice in one assistant message: read a.txt and b.txt. Then reply with the single word DONE and stop."}],"source":{"kind":"user","rpcId":"{{rpcId}}"}},"surfaceOp":"append"}
+{"type":"session/title","seq":2,"time":1784974100761,"data":{"title":"Use the read tool twice","messageSeqs":[1],"source":{"kind":"fallback"}}}
+{"type":"step/start","seq":3,"time":1784974100827,"data":{"turn":1,"step":1}}
+{"type":"request/header","seq":4,"time":1784974100828,"data":{"header":{"config":{"provider":"deepseek","model":"deepseek-v4-flash"},"system":"{{system}}","tools":"{{tools}}","messagePrefix":["{{messagePrefix}}"]},"reason":"initial"}}
+{"type":"assistant/chunk","seq":5,"time":1784974101296,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":6,"time0":1784974101297,"data":{"turn":1,"step":1,"index":0,"dt":[125,30,0,1,0,0,30,1,0,0,0,0,30,1,0,0,30,0,0,0,0,1,30,1,0,0],"texts":["The"," user"," wants"," me"," to"," read"," a",".txt"," and"," b",".txt",","," then"," reply"," with"," \"","D","ONE","\"."," Let"," me"," do"," both"," reads"," in"," parallel","."]}}
+{"type":"assistant/chunk","seq":33,"time":1784974101666,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":1,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":34,"time0":1784974101667,"data":{"turn":1,"step":1,"index":1,"dt":[30,0,0,0,0,0,29,1,0,29,1],"id":"call_00_OsndvlcKnCcUmae7QXal8633","name":"read","args":["","{","\"","file","_path","\"",": ","\"","a",".txt","\"","}"]}}
+{"type":"assistant/chunk","seq":46,"time":1784974101821,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":2,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":47,"time0":1784974101822,"data":{"turn":1,"step":1,"index":2,"dt":[27,0,0,0,1,31,0,1,0,26,1],"id":"call_01_Hw6AQjhf9gjxnOtppcGx0725","name":"read","args":["","{","\"","file","_path","\"",": ","\"","b",".txt","\"","}"]}}
+{"type":"assistant/chunk","seq":59,"time":1784974101974,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user wants me to read a.txt and b.txt, then reply with \"DONE\". Let me do both reads in parallel."}}}}
+{"type":"assistant/chunk","seq":60,"time":1784974101974,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":1,"block":{"type":"tool-call","id":"call_00_OsndvlcKnCcUmae7QXal8633","name":"read","arguments":"{\"file_path\": \"a.txt\"}"}}}}
+{"type":"assistant/chunk","seq":61,"time":1784974101974,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":2,"block":{"type":"tool-call","id":"call_01_Hw6AQjhf9gjxnOtppcGx0725","name":"read","arguments":"{\"file_path\": \"b.txt\"}"}}}}
+{"type":"assistant/chunk","seq":62,"time":1784974101974,"data":{"turn":1,"step":1,"chunk":{"type":"usage","usage":{"inputTokens":124,"outputTokens":103,"cacheReadTokens":7680,"reasoningTokens":27}}}}
+{"type":"assistant/chunk","seq":63,"time":1784974101974,"data":{"turn":1,"step":1,"chunk":{"type":"finish","reason":{"kind":"tool-calls"}}}}
+{"type":"assistant/message","seq":64,"time":1784974101978,"data":{"turn":1,"step":1,"content":[{"type":"reasoning","text":"The user wants me to read a.txt and b.txt, then reply with \"DONE\". Let me do both reads in parallel."},{"type":"tool-call","id":"call_00_OsndvlcKnCcUmae7QXal8633","name":"read","arguments":"{\"file_path\": \"a.txt\"}"},{"type":"tool-call","id":"call_01_Hw6AQjhf9gjxnOtppcGx0725","name":"read","arguments":"{\"file_path\": \"b.txt\"}"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":124,"outputTokens":103,"cacheReadTokens":7680,"reasoningTokens":27}},"sourceEventSeqs":[5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63],"surfaceOp":"append"}
+{"type":"tool/call","seq":65,"time":1784974101979,"data":{"turn":1,"step":1,"callId":"call_00_OsndvlcKnCcUmae7QXal8633","name":"read","arguments":"{\"file_path\": \"a.txt\"}"}}
+{"type":"tool/call","seq":66,"time":1784974101981,"data":{"turn":1,"step":1,"callId":"call_01_Hw6AQjhf9gjxnOtppcGx0725","name":"read","arguments":"{\"file_path\": \"b.txt\"}"}}
+{"type":"tool/result","seq":67,"time":1784974101985,"data":{"turn":1,"step":1,"callId":"call_00_OsndvlcKnCcUmae7QXal8633","content":[{"type":"text","text":"<path>{{cwd}}/workspace/a.txt</path>\n<type>file</type>\n<content>\n1: alpha\n\n(End of file - total 1 lines)\n</content>"}],"isError":false},"sourceEventSeqs":[65],"surfaceOp":"append"}
+{"type":"tool/result","seq":68,"time":1784974101986,"data":{"turn":1,"step":1,"callId":"call_01_Hw6AQjhf9gjxnOtppcGx0725","content":[{"type":"text","text":"<path>{{cwd}}/workspace/b.txt</path>\n<type>file</type>\n<content>\n1: beta\n\n(End of file - total 1 lines)\n</content>"}],"isError":false},"sourceEventSeqs":[66],"surfaceOp":"append"}
+{"type":"step/end","seq":69,"time":1784974101988,"data":{"turn":1,"step":1}}
+{"type":"step/start","seq":70,"time":1784974101988,"data":{"turn":1,"step":2}}
+{"type":"assistant/chunk","seq":71,"time":1784974102397,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":72,"time0":1784974102397,"data":{"turn":1,"step":2,"index":0,"dt":[108,29,1,0,0,30,30,1,0,0,0,29,0,0,0,0,1,30,0,0,0,33,1,0,26,1,31,1],"texts":["Both"," files"," have"," been"," read","."," a",".txt"," contains"," \"","alpha","\""," and"," b",".txt"," contains"," \"","beta","\"."," I","'ll"," now"," reply"," with"," D","ONE"," as"," instructed","."]}}
+{"type":"assistant/chunk","seq":101,"time":1784974102749,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":1,"blockType":"text"}}}
+{"type":"assistant/chunk","seq":102,"time":1784974102749,"data":{"turn":1,"step":2,"chunk":{"type":"text-delta","index":1,"text":"D"}}}
+{"type":"assistant/chunk","seq":103,"time":1784974102749,"data":{"turn":1,"step":2,"chunk":{"type":"text-delta","index":1,"text":"ONE"}}}
+{"type":"assistant/chunk","seq":104,"time":1784974102749,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"Both files have been read. a.txt contains \"alpha\" and b.txt contains \"beta\". I'll now reply with DONE as instructed."}}}}
+{"type":"assistant/chunk","seq":105,"time":1784974102749,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":1,"block":{"type":"text","text":"DONE"}}}}
+{"type":"assistant/chunk","seq":106,"time":1784974102750,"data":{"turn":1,"step":2,"chunk":{"type":"usage","usage":{"inputTokens":215,"outputTokens":32,"cacheReadTokens":7808,"reasoningTokens":29}}}}
+{"type":"assistant/chunk","seq":107,"time":1784974102750,"data":{"turn":1,"step":2,"chunk":{"type":"finish","reason":{"kind":"stop"}}}}
+{"type":"assistant/message","seq":108,"time":1784974102750,"data":{"turn":1,"step":2,"content":[{"type":"reasoning","text":"Both files have been read. a.txt contains \"alpha\" and b.txt contains \"beta\". I'll now reply with DONE as instructed."},{"type":"text","text":"DONE"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":215,"outputTokens":32,"cacheReadTokens":7808,"reasoningTokens":29}},"sourceEventSeqs":[71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97,98,99,100,101,102,103,104,105,106,107],"surfaceOp":"append"}
+{"type":"step/end","seq":109,"time":1784974102751,"data":{"turn":1,"step":2}}
+{"type":"turn/end","seq":110,"time":1784974102751,"data":{"turn":1,"reason":{"kind":"completed"}}}

apps/web/tests/snapshots/seeded-history/ui.expected.md

@@ -0,0 +1,33 @@
+- banner:
+  - navigation "Session hierarchy":
+    - button "Use the read tool twice" [disabled]
+    - text: · 1 turns
+  - tablist:
+    - tab "Chat" [selected]
+    - tab "Trajectory"
+    - tab "Waterfall"
+- text: "Use the read tool twice in one assistant message: read a.txt and b.txt. Then reply with the single word DONE and stop."
+- button "Think The user wants me to read a.txt and b.txt, then reply with \"DONE\". Let me do both reads in parallel.":
+  - img
+  - text: Think The user wants me to read a.txt and b.txt, then reply with "DONE". Let me do both reads in parallel.
+- button:
+  - img
+- text: Read a.txt
+- button:
+  - img
+- text: Read b.txt
+- button "Think Both files have been read. a.txt contains \"alpha\" and b.txt contains \"beta\". I'll now reply with DONE as instructed.":
+  - img
+  - text: Think Both files have been read. a.txt contains "alpha" and b.txt contains "beta". I'll now reply with DONE as instructed.
+- paragraph: DONE
+- text: cache hit 98% · 15,962 tokens · 1 turns · 2 steps
+- textbox "Message the agent"
+- button "Add attachment":
+  - img
+- combobox "Access mode":
+  - option "Read-only" [selected]
+  - option "Read-write"
+- button "选择模型，当前 deepseek-v4-flash":
+  - text: deepseek-v4-flash
+  - img
+- button "Send message" [disabled]

apps/web/tests/snapshots/settings-chrome/dialog.expected.md

@@ -0,0 +1,30 @@
+- dialog "设置":
+  - navigation:
+    - text: 设置
+    - button "通用设置":
+      - img
+      - text: 通用设置
+    - button "模型":
+      - img
+      - text: 模型
+  - button "关闭":
+    - img
+    - text: 关闭
+  - text: 权限 选择默认权限模式
+  - button "Read only" [disabled]:
+    - text: Read only
+    - img
+  - text: 工具调用 Schema mode Traditional function calling — invoke tools one at a time Code mode Chain multiple tools with code — multi-step orchestration 语言
+  - button "中文":
+    - text: 中文
+    - img
+  - text: 外观
+  - button "浅色":
+    - img
+    - text: 浅色
+  - button "深色":
+    - img
+    - text: 深色
+  - button "跟随系统" [pressed]:
+    - img
+    - text: 跟随系统

apps/web/tests/snapshots/sidebar-scrollbar/geometry.expected.md

@@ -0,0 +1,33 @@
+# Sidebar session list scrollbar
+
+## Light palette
+
+- scrollbar-gutter: stable
+- ::-webkit-scrollbar width: 8px
+- ::-webkit-scrollbar-track background: rgba(0, 0, 0, 0)
+- scrollbar-width: auto
+- scrollbar-color: auto
+- ::-webkit-scrollbar-thumb:hover declarations: var(--dsh-scrollbar-thumb-hover)
+- --dsh-scrollbar-thumb: rgb(229, 229, 229)
+- --dsh-scrollbar-thumb-hover: rgb(212, 212, 212)
+- list overflows: true
+- reserved band: 8px
+- relative time covered by the bar: 0px
+- relative time ends inside the content area: true
+- content area ends before the border box: true
+
+## Dark palette
+
+- scrollbar-gutter: stable
+- ::-webkit-scrollbar width: 8px
+- ::-webkit-scrollbar-track background: rgba(0, 0, 0, 0)
+- scrollbar-width: auto
+- scrollbar-color: auto
+- ::-webkit-scrollbar-thumb:hover declarations: var(--dsh-scrollbar-thumb-hover)
+- --dsh-scrollbar-thumb: rgb(60, 60, 61)
+- --dsh-scrollbar-thumb-hover: rgb(84, 85, 87)
+- list overflows: true
+- reserved band: 8px
+- relative time covered by the bar: 0px
+- relative time ends inside the content area: true
+- content area ends before the border box: true

apps/web/tests/snapshots/steering/mid-steer.expected.md

@@ -0,0 +1,39 @@
+- banner:
+  - navigation "Session hierarchy":
+    - button "Use the ask_user_question tool to" [disabled]
+    - text: · 1 turns
+  - tablist:
+    - tab "Chat" [selected]
+    - tab "Trajectory"
+    - tab "Waterfall"
+- text: Use the ask_user_question tool to ask me exactly one question with id "checkpoint", question "Ready to continue?", header "Checkpoint", and options labeled "Yes" and "No". After I answer, reply with one short sentence acknowledging my answer and stop.
+- button "Think The user wants me to use the ask_user_question tool to ask them a specific question with the given parameters. Let me do exactly that.":
+  - img
+  - text: Think The user wants me to use the ask_user_question tool to ask them a specific question with the given parameters. Let me do exactly that.
+- button
+- text: "Tool call ask_user_question · {\"questions\": [{\"id\": \"checkpoint\", \"question\": \"Ready to continue?\", \"header\": \"Checkpoint\", \"options\": [{\"label\": \"Yes\"}, {\"label\": \"No\"}]}]} 等待回答（1 题）"
+- button "▸ 问题内容"
+- text: 请在原客户端处理（web 端作答后续里程碑提供） cache hit 98% · 7,946 tokens · 1 turns · 1 steps
+- region "Ready to continue?":
+  - text: Checkpoint
+  - heading "Ready to continue?" [level=2]
+  - text: 1 / 1
+  - button "上一题" [disabled]:
+    - img
+  - button "下一题" [disabled]:
+    - img
+  - button "放弃整组问题":
+    - img
+  - radiogroup:
+    - radio "Yes":
+      - text: 1 Yes
+      - img
+    - radio "No":
+      - text: 2 No
+      - img
+    - button "其他，请填写自定义答案":
+      - img
+      - text: 其他，请填写自定义答案
+  - status
+  - button "跳过本题"
+  - button "提交" [disabled]

apps/web/tests/snapshots/steering/session.jsonl

@@ -0,0 +1,31 @@
+{"type":"session","version":0,"id":"{{sessionId}}","createdAt":1785004180013,"cwd":"{{cwd}}/workspace"}
+{"type":"turn/start","seq":0,"time":1785004180030,"data":{"turn":1,"trigger":{"kind":"message","source":{"kind":"user","rpcId":"{{rpcId}}"}}}}
+{"type":"user/message","seq":1,"time":1785004180030,"data":{"content":[{"type":"text","text":"Use the ask_user_question tool to ask me exactly one question with id \"checkpoint\", question \"Ready to continue?\", header \"Checkpoint\", and options labeled \"Yes\" and \"No\". After I answer, reply with one short sentence acknowledging my answer and stop."}],"source":{"kind":"user","rpcId":"{{rpcId}}"}},"surfaceOp":"append"}
+{"type":"session/title","seq":2,"time":1785004180033,"data":{"title":"Use the ask_user_question tool to","messageSeqs":[1],"source":{"kind":"fallback"}}}
+{"type":"step/start","seq":3,"time":1785004180105,"data":{"turn":1,"step":1}}
+{"type":"request/header","seq":4,"time":1785004180106,"data":{"header":{"config":{"provider":"deepseek","model":"deepseek-v4-flash"},"system":"{{system}}","tools":"{{tools}}","messagePrefix":["{{messagePrefix}}"]},"reason":"initial"}}
+{"type":"assistant/chunk","seq":5,"time":1785004180696,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":6,"time0":1785004180697,"data":{"turn":1,"step":1,"index":0,"dt":[88,29,1,0,0,0,28,0,0,1,0,0,30,1,27,0,0,0,0,28,1,0,30,0,0,0,28,1],"texts":["The"," user"," wants"," me"," to"," use"," the"," ask","_user","_","question"," tool"," to"," ask"," them"," a"," specific"," question"," with"," the"," given"," parameters","."," Let"," me"," do"," exactly"," that","."]}}
+{"type":"assistant/chunk","seq":35,"time":1785004181077,"data":{"turn":1,"step":1,"chunk":{"type":"block-start","index":1,"blockType":"tool-call"}}}
+{"type":"tool-call-chunks","seq0":36,"time0":1785004181078,"data":{"turn":1,"step":1,"index":1,"dt":[27,1,0,0,0,28,1,0,0,29,1,0,0,0,0,28,1,0,0,0,0,29,0,0,0,0,1,28,0,0,0,0,1,28,0,0,0,0,0,28,0,1,0,0,0,28,30],"id":"call_00_sAvjivLShvnWVk0sPQPV7661","name":"ask_user_question","args":["","{","\"","questions","\"",": ","[","{\"","id","\":"," \"","check","point","\","," \"","question","\":"," \"","Ready"," to"," continue","?\","," \"","header","\":"," \"","Check","point","\","," \"","options","\":"," [","{\"","label","\":"," \"","Yes","\"},"," {\"","label","\":"," \"","No","\"","}]","}]","}"]}}
+{"type":"assistant/chunk","seq":84,"time":1785004181401,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user wants me to use the ask_user_question tool to ask them a specific question with the given parameters. Let me do exactly that."}}}}
+{"type":"assistant/chunk","seq":85,"time":1785004181401,"data":{"turn":1,"step":1,"chunk":{"type":"block-end","index":1,"block":{"type":"tool-call","id":"call_00_sAvjivLShvnWVk0sPQPV7661","name":"ask_user_question","arguments":"{\"questions\": [{\"id\": \"checkpoint\", \"question\": \"Ready to continue?\", \"header\": \"Checkpoint\", \"options\": [{\"label\": \"Yes\"}, {\"label\": \"No\"}]}]}"}}}}
+{"type":"assistant/chunk","seq":86,"time":1785004181401,"data":{"turn":1,"step":1,"chunk":{"type":"usage","usage":{"inputTokens":151,"outputTokens":115,"cacheReadTokens":7680,"reasoningTokens":29}}}}
+{"type":"assistant/chunk","seq":87,"time":1785004181402,"data":{"turn":1,"step":1,"chunk":{"type":"finish","reason":{"kind":"tool-calls"}}}}
+{"type":"assistant/message","seq":88,"time":1785004181406,"data":{"turn":1,"step":1,"content":[{"type":"reasoning","text":"The user wants me to use the ask_user_question tool to ask them a specific question with the given parameters. Let me do exactly that."},{"type":"tool-call","id":"call_00_sAvjivLShvnWVk0sPQPV7661","name":"ask_user_question","arguments":"{\"questions\": [{\"id\": \"checkpoint\", \"question\": \"Ready to continue?\", \"header\": \"Checkpoint\", \"options\": [{\"label\": \"Yes\"}, {\"label\": \"No\"}]}]}"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":151,"outputTokens":115,"cacheReadTokens":7680,"reasoningTokens":29}},"sourceEventSeqs":[5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87],"surfaceOp":"append"}
+{"type":"tool/call","seq":89,"time":1785004181407,"data":{"turn":1,"step":1,"callId":"call_00_sAvjivLShvnWVk0sPQPV7661","name":"ask_user_question","arguments":"{\"questions\": [{\"id\": \"checkpoint\", \"question\": \"Ready to continue?\", \"header\": \"Checkpoint\", \"options\": [{\"label\": \"Yes\"}, {\"label\": \"No\"}]}]}"}}
+{"type":"tool/result","seq":90,"time":1785004181867,"data":{"turn":1,"step":1,"callId":"call_00_sAvjivLShvnWVk0sPQPV7661","content":[{"type":"text","text":"{\"answers\":[{\"id\":\"checkpoint\",\"selected\":[\"Yes\"]}]}"}],"isError":false},"sourceEventSeqs":[89],"surfaceOp":"append"}
+{"type":"steering/message","seq":91,"time":1785004181867,"data":{"turn":1,"content":[{"type":"text","text":"Interjection: include the word BANANA in your final reply."}],"source":{"kind":"user","rpcId":"{{rpcId}}"}},"surfaceOp":"append"}
+{"type":"step/end","seq":92,"time":1785004181870,"data":{"turn":1,"step":1}}
+{"type":"step/start","seq":93,"time":1785004181870,"data":{"turn":1,"step":2}}
+{"type":"assistant/chunk","seq":94,"time":1785004182322,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":0,"blockType":"reasoning"}}}
+{"type":"reasoning-chunks","seq0":95,"time0":1785004182323,"data":{"turn":1,"step":2,"index":0,"dt":[129,28,1,0,0,28,1,29,0,0,30,1,27,0,0,0,29,1,0,0,0,0,28,1,0,29,64,0],"texts":["The"," user"," selected"," \"","Yes","\""," and"," wants"," me"," to"," include"," the"," word"," \"","B","AN","ANA","\""," in"," my"," final"," reply","."," Let"," me"," acknowledge"," their"," answer","."]}}
+{"type":"assistant/chunk","seq":124,"time":1785004182750,"data":{"turn":1,"step":2,"chunk":{"type":"block-start","index":1,"blockType":"text"}}}
+{"type":"text-chunks","seq0":125,"time0":1785004182750,"data":{"turn":1,"step":2,"index":1,"dt":[24,0,28,2,0,27,31,1,0,0],"texts":["Great",","," let","'s"," move"," forward","."," B","AN","ANA","!"]}}
+{"type":"assistant/chunk","seq":136,"time":1785004182892,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":0,"block":{"type":"reasoning","text":"The user selected \"Yes\" and wants me to include the word \"BANANA\" in my final reply. Let me acknowledge their answer."}}}}
+{"type":"assistant/chunk","seq":137,"time":1785004182893,"data":{"turn":1,"step":2,"chunk":{"type":"block-end","index":1,"block":{"type":"text","text":"Great, let's move forward. BANANA!"}}}}
+{"type":"assistant/chunk","seq":138,"time":1785004182893,"data":{"turn":1,"step":2,"chunk":{"type":"usage","usage":{"inputTokens":172,"outputTokens":41,"cacheReadTokens":7808,"reasoningTokens":29}}}}
+{"type":"assistant/chunk","seq":139,"time":1785004182893,"data":{"turn":1,"step":2,"chunk":{"type":"finish","reason":{"kind":"stop"}}}}
+{"type":"assistant/message","seq":140,"time":1785004182894,"data":{"turn":1,"step":2,"content":[{"type":"reasoning","text":"The user selected \"Yes\" and wants me to include the word \"BANANA\" in my final reply. Let me acknowledge their answer."},{"type":"text","text":"Great, let's move forward. BANANA!"}],"provenance":{"provider":"deepseek","model":"deepseek-v4-flash"},"usage":{"inputTokens":172,"outputTokens":41,"cacheReadTokens":7808,"reasoningTokens":29}},"sourceEventSeqs":[94,95,96,97,98,99,100,101,102,103,104,105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122,123,124,125,126,127,128,129,130,131,132,133,134,135,136,137,138,139],"surfaceOp":"append"}
+{"type":"step/end","seq":141,"time":1785004182895,"data":{"turn":1,"step":2}}
+{"type":"turn/end","seq":142,"time":1785004182895,"data":{"turn":1,"reason":{"kind":"completed"}}}

apps/web/tests/snapshots/steering/settled.expected.md

@@ -0,0 +1,30 @@
+- banner:
+  - navigation "Session hierarchy":
+    - button "Use the ask_user_question tool to" [disabled]
+    - text: · 1 turns
+  - tablist:
+    - tab "Chat" [selected]
+    - tab "Trajectory"
+    - tab "Waterfall"
+- text: Use the ask_user_question tool to ask me exactly one question with id "checkpoint", question "Ready to continue?", header "Checkpoint", and options labeled "Yes" and "No". After I answer, reply with one short sentence acknowledging my answer and stop.
+- button "Think The user wants me to use the ask_user_question tool to ask them a specific question with the given parameters. Let me do exactly that.":
+  - img
+  - text: Think The user wants me to use the ask_user_question tool to ask them a specific question with the given parameters. Let me do exactly that.
+- button:
+  - img
+- text: "Tool call ask_user_question · {\"questions\": [{\"id\": \"checkpoint\", \"question\": \"Ready to continue?\", \"header\": \"Checkpoint\", \"options\": [{\"label\": \"Yes\"}, {\"label\": \"No\"}]}]} 插话 Interjection: include the word BANANA in your final reply."
+- button "Think The user selected \"Yes\" and wants me to include the word \"BANANA\" in my final reply. Let me acknowledge their answer.":
+  - img
+  - text: Think The user selected "Yes" and wants me to include the word "BANANA" in my final reply. Let me acknowledge their answer.
+- paragraph: Great, let's move forward. BANANA!
+- text: cache hit 98% · 15,967 tokens · 1 turns · 2 steps
+- textbox "Message the agent"
+- button "Add attachment":
+  - img
+- combobox "Access mode":
+  - option "Read-only" [selected]
+  - option "Read-write"
+- button "选择模型，当前 deepseek-v4-flash":
+  - text: deepseek-v4-flash
+  - img
+- button "Send message" [disabled]

apps/web/tests/steering.e2e.ts

@@ -0,0 +1,173 @@
+// Web e2e scenario: mid-turn steering, end to end. The composer locks while a
+// turn runs, so the product UI has no steering gesture yet — the steer is
+// POSTed from the page itself over the same same-origin /api transport the
+// client uses (TODO(web-steer-composer): drive this through a composer
+// gesture once one exists). Everything downstream is product: the gateway
+// routes mode:'steer' to Agent.steer, the loop drains it at the step
+// boundary into a durable steering/message event, the SSE mux pushes it, and
+// the transcript renders the badged interjection bubble. The question
+// composer supplies the deterministic mid-turn window: while ask_user_question
+// blocks, the turn is provably running, so record and replay perform the
+// identical steer-then-answer sequence with zero timing dependence — and the
+// recorded final reply proves the steer reached the MODEL (it obeys an
+// instruction that only the steering message carries).
+import { readFile } from 'node:fs/promises'
+import { fileURLToPath } from 'node:url'
+import { join } from 'node:path'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
+import { parseSessionLog } from '@deepseek-ai/dsh-llm-replay'
+import type { SessionEvent } from '@deepseek-ai/dsh-session'
+import {
+  assertFixtureInventory, captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
+  launchWebScaffold, recordFixture, watchConsole, webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { connectFreshWorkspace, saveFailureShot } from './support.ts'
+
+const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/steering', import.meta.url))
+const FIXTURE = join(SNAPSHOT_DIR, 'session.jsonl')
+// Two goldens for the two distinct states this interaction produces: the
+// mid-turn moment (steer ACCEPTED but deliberately invisible — the loop
+// drains steering at the step boundary, so no interjection bubble exists
+// while the question still blocks the step) and the settled transcript
+// (badged bubble in place, final reply obeying it). The pair pins the
+// timing semantics visually: if the client ever starts rendering pending
+// steers eagerly, the mid-steer golden flips first.
+const MID_EXPECTED = join(SNAPSHOT_DIR, 'mid-steer.expected.md')
+const SETTLED_EXPECTED = join(SNAPSHOT_DIR, 'settled.expected.md')
+const MODE = webSnapshotMode()
+
+const PROMPT = 'Use the ask_user_question tool to ask me exactly one question with id "checkpoint", question "Ready to continue?", header "Checkpoint", and options labeled "Yes" and "No". After I answer, reply with one short sentence acknowledging my answer and stop.'
+const STEER = 'Interjection: include the word BANANA in your final reply.'
+
+/** Concatenated assistant text deltas — the model-visible reply body. */
+function assistantText(events: SessionEvent[]): string {
+  return events
+    .filter(e => e.type === 'assistant/chunk')
+    .map((e) => {
+      const chunk = (e as SessionEvent & { data: { chunk: { type: string; text?: string } } }).data.chunk
+      return chunk.type === 'text-delta' ? chunk.text ?? '' : ''
+    })
+    .join('')
+}
+
+describe('web e2e: mid-turn steering lands durably and visibly', () => {
+  let scaffold: WebScaffold
+  let browser: Browser
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+  let liveSessionId: string | undefined
+  const sessionEvents: SessionEvent[] = []
+
+  beforeAll(async () => {
+    scaffold = await launchWebScaffold(MODE === 'record' ? {} : { replayFixture: FIXTURE, paceMs: 15 })
+    scaffold.ctx.on('session/event', (session, event) => {
+      liveSessionId ??= session.id
+      sessionEvents.push(event)
+    })
+    browser = await chromium.launch()
+    page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    // Fresh world: connect a Workspace so the composer scenarios start live.
+    await connectFreshWorkspace(page)
+  }, 120_000)
+
+  afterAll(async () => {
+    await browser?.close()
+    await scaffold?.close()
+  })
+
+  it('steers during the blocked step; the interjection is logged, rendered, and obeyed', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-steering'))
+    if (MODE !== 'record') {
+      // The steer must NOT be a user/message — it lands as steering/message.
+      expect(fixtureUserPrompts(await readFile(FIXTURE, 'utf8'))).toEqual([PROMPT])
+    }
+    const input = page.locator('textarea').first()
+    await input.waitFor({ timeout: 10_000 })
+    const settled = scaffold.whenTurnSettled(MODE === 'record' ? 180_000 : 30_000)
+    await input.fill(PROMPT)
+    await input.press('Enter')
+
+    // The blocked composer is the mid-turn barrier: its presence proves the
+    // ask_user_question step is executing, i.e. the turn is running NOW.
+    const composer = page.locator('[data-question-key]')
+    await composer.waitFor({ timeout: MODE === 'record' ? 120_000 : 30_000 })
+
+    // Steer through the real wire from the page (same envelope + endpoint the
+    // web client's session.prompt uses). accepted:true is the transport proof.
+    expect(liveSessionId).toBeDefined()
+    const reply = await page.evaluate(async ({ sessionId, text }) => {
+      const response = await fetch('/api/session.prompt', {
+        method: 'POST',
+        headers: { 'content-type': 'application/json' },
+        body: JSON.stringify({
+          type: 'client-request',
+          rpcId: crypto.randomUUID(),
+          method: 'session.prompt',
+          payload: { sessionId, mode: 'steer', content: [{ type: 'text', text }] },
+        }),
+      })
+      return await response.json() as { result?: { ok?: boolean } }
+    }, { sessionId: liveSessionId!, text: STEER })
+    expect(reply.result?.ok).toBe(true)
+
+    if (MODE !== 'record') {
+      // Mid-turn golden: the ACCEPTED steer is durable in the inbox but the
+      // loop drains steering only at the step boundary, so no steering/message
+      // exists yet and no interjection bubble renders — the composer still
+      // blocks, alone. The DOM is stable here (no further SSE frames can
+      // arrive until the question is answered), making this state capturable.
+      expect(await page.getByText('插话').count()).toBe(0)
+      const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd)
+      await compareOrRefreshGolden(MID_EXPECTED, snapshot, MODE)
+    }
+
+    // Answer the composer; the tool result closes the step, the loop drains
+    // the steer as steering/message, and the steered continuation runs the
+    // final model call.
+    await composer.getByRole('radio', { name: 'Yes' }).click()
+    await composer.getByRole('radio', { name: 'Yes' }).press('Enter')
+    await settled
+
+    if (MODE === 'record') {
+      const sessionId = await settled
+      await recordFixture(scaffold, sessionId, FIXTURE)
+      // Fixture honesty: a recording where the live model ignored the steer
+      // would replay as a vacuous scenario — reject it and re-record instead.
+      const recorded = parseSessionLog(await readFile(FIXTURE, 'utf8'))
+      expect(recorded.filter(e => e.type === 'steering/message')).toHaveLength(1)
+      expect(assistantText(recorded)).toContain('BANANA')
+      return
+    }
+
+    // Durable: exactly one steering/message, inside turn 1, carrying the text.
+    const steerEvents = sessionEvents.filter(e => e.type === 'steering/message')
+    expect(steerEvents).toHaveLength(1)
+    expect((steerEvents[0] as SessionEvent & { data: { turn: number } }).data.turn).toBe(1)
+    expect(JSON.stringify(steerEvents[0])).toContain('BANANA')
+    const turnEnds = sessionEvents.filter(e => e.type === 'turn/end')
+    expect(turnEnds).toHaveLength(1)
+    expect((turnEnds[0] as SessionEvent & { data: { reason: { kind: string } } }).data.reason.kind).toBe('completed')
+
+    // Visible: the badged interjection bubble plus the reply that obeys it
+    // (steer text + final reply each contain the marker word).
+    await expect.poll(() => page.getByText('插话').count(), { timeout: 15_000 }).toBe(1)
+    await expect.poll(() => page.getByText('Interjection:', { exact: false }).count(), { timeout: 10_000 }).toBe(1)
+    await expect.poll(() => page.getByText('BANANA', { exact: false }).count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(2)
+    expect(await page.locator('[data-question-key]').count()).toBe(0)
+    // Settled golden: badge + interjection between the question round trip
+    // and the obeying reply, composer takeover gone.
+    const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd)
+    await compareOrRefreshGolden(SETTLED_EXPECTED, snapshot, MODE)
+    expect(tripwire.pageErrors).toEqual([])
+    expect(tripwire.warnings).toEqual([])
+  }, 200_000)
+
+  it.skipIf(MODE === 'record')('keeps the fixture inventory closed', async () => {
+    await assertFixtureInventory(SNAPSHOT_DIR, ['session.jsonl', 'mid-steer.expected.md', 'settled.expected.md'])
+  })
+})

apps/web/tests/support.ts

@@ -16,10 +16,7 @@ export function requireDist(): void {
   }
 }
 
-/**
- * OS-assigned free port, released before use. startWebServer echoes
- * options.port instead of the bound one, so passing 0 directly is unusable.
- */
+/** OS-assigned free port, released before use (the spawned `dsh web` needs a concrete --port). */
 export function probeFreePort(): Promise<number> {
   return new Promise((resolvePort, reject) => {
     const probe = createServer()
@@ -35,6 +32,30 @@ export function probeFreePort(): Promise<number> {
   })
 }
 
+/**
+ * Drive the hero's workspace picker through its create-by-name dialog until
+ * the live composer unlocks. A fresh world has no Workspace, so the boot
+ * lands in the locked view state (startup auto-selection has nothing to
+ * select); every scenario that types into the composer must connect one
+ * first. The default name 'workspace' keeps the session header cwd at
+ * <workspaceRoot>/workspace — the materialization proof several scenarios
+ * assert.
+ * @param page - the page under test.
+ * @param name - workspace name typed into the create dialog.
+ */
+export async function connectFreshWorkspace(page: Page, name = 'workspace'): Promise<void> {
+  await page.getByRole('button', { name: 'Choose workspace' }).click()
+  await page.getByRole('menuitem', { name: 'Create a new workspace' }).click()
+  const dialog = page.getByRole('dialog', { name: 'Create a new workspace' })
+  await dialog.waitFor({ timeout: 10_000 })
+  await dialog.getByLabel('New workspace name').fill(name)
+  await dialog.getByRole('button', { name: 'Create workspace' }).click()
+  // The pick connected the workspace: the blank session's live composer
+  // replaces the locked placeholder and enables.
+  await page.locator('textarea:enabled[placeholder="Describe what you want to build"]')
+    .waitFor({ timeout: 15_000 })
+}
+
 /** Failure evidence goes to the gitignored .artifacts/ (repo convention). */
 export async function saveFailureShot(page: Page, name: string): Promise<void> {
   const dir = fileURLToPath(new URL('../../../.artifacts', import.meta.url))

apps/web/tests/todo-display.snapshot.ts

@@ -0,0 +1,220 @@
+// @vitest-environment jsdom
+// Todo display snapshot over the BUILT client graph (the code-mode-fixture
+// idiom: real bundles via AppWebEntry, keyless FixtureApiClient transport).
+// Opens the fixture history session and pins the todo_write turn's two
+// surfaces: the dedicated TodoRow in the chat flow (keyed toolview, summary
+// derived from the call args) and the TodoPanel plan strip riding the
+// 'conversation.input.dock' slot (fed by the host `todos` projection via
+// useProjection, seeded by the tail history page), including the collapse
+// interaction and the next-turn clearance of the standing plan.
+import { readFileSync } from 'node:fs'
+import { join } from 'node:path'
+import { act, cleanup, fireEvent, screen, waitFor, within } from '@testing-library/react'
+import { afterEach, beforeEach, expect, it, vi } from 'vitest'
+import type { WebBootEntry } from '@deepseek-ai/dsh-client-modules/client'
+import { AppWebEntry } from '@deepseek-ai/dsh-client-web'
+
+const PLUGINS: readonly (WebBootEntry & { dir: string })[] = [
+  { id: '@deepseek-ai/dsh-client-connection', dir: 'connection', url: '/plugins/connection.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-runtime', dir: 'runtime', url: '/plugins/runtime.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-connection'], immediately: true },
+  { id: '@deepseek-ai/dsh-client-ui-theme', dir: 'ui-theme', url: '/plugins/ui-theme.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-locale', dir: 'locale', url: '/plugins/locale.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-ui-layout', dir: 'ui-layout', url: '/plugins/ui-layout.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-runtime'] },
+  { id: '@deepseek-ai/dsh-client-ui-sidebar', dir: 'ui-sidebar', url: '/plugins/ui-sidebar.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout'] },
+  { id: '@deepseek-ai/dsh-client-ui-conversation', dir: 'ui-conversation', url: '/plugins/ui-conversation.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout'] },
+  {
+    id: '@deepseek-ai/dsh-client-ui-workspace',
+    dir: 'ui-workspace',
+    url: '/plugins/ui-workspace.js',
+    rev: 'fx',
+    inject: [
+      '@deepseek-ai/dsh-client-runtime',
+      '@deepseek-ai/dsh-client-ui-conversation',
+      '@deepseek-ai/dsh-client-ui-sidebar',
+    ],
+  },
+]
+
+const bundles = new Map(PLUGINS.map(plugin => [
+  plugin.url,
+  readFileSync(join(process.cwd(), 'packages/client', plugin.dir, 'lib/client.js'), 'utf8'),
+]))
+
+interface FixtureWindow extends Window {
+  __DSH_BOOT__?: { rev: string; entries: WebBootEntry[] }
+  __ModuleLoader__?: unknown
+}
+
+class ResizeObserverStub {
+  observe(): void {}
+  disconnect(): void {}
+  unobserve(): void {}
+}
+
+const win = window as FixtureWindow
+let unmount: (() => void) | undefined
+
+beforeEach(() => {
+  localStorage.clear()
+  document.title = 'DeepSeek Harness'
+  vi.stubGlobal('ResizeObserver', ResizeObserverStub)
+  vi.stubGlobal('requestAnimationFrame', (callback: FrameRequestCallback) =>
+    setTimeout(() => { callback(0) }, 0) as unknown as number)
+  vi.stubGlobal('cancelAnimationFrame', (id: number) => { clearTimeout(id) })
+})
+
+afterEach(() => {
+  act(() => { unmount?.() })
+  unmount = undefined
+  cleanup()
+  delete win.__DSH_BOOT__
+  delete win.__ModuleLoader__
+  delete (globalThis as Record<string, unknown>).__fxTiming
+  document.body.innerHTML = ''
+  document.head.querySelectorAll('style[data-plugin]').forEach((style) => { style.remove() })
+  document.title = ''
+  history.replaceState(null, '', '/')
+  vi.unstubAllGlobals()
+})
+
+/** Boot the complete built client graph against the populated fixture branch. */
+function boot(): void {
+  history.replaceState(null, '', '/?fixture')
+  const root = document.createElement('div')
+  root.id = 'root'
+  document.body.appendChild(root)
+  win.__DSH_BOOT__ = { rev: 'fx', entries: PLUGINS.map(({ dir: _dir, ...plugin }) => plugin) }
+  act(() => {
+    const entry = new AppWebEntry(root, {
+      fetchBundle: (url) => {
+        const code = bundles.get(url)
+        return code === undefined ? Promise.reject(new Error(`missing built bundle ${url}`)) : Promise.resolve(code)
+      },
+      executeBundle: (code) => { (0, eval)(code) },
+    })
+    void entry.run()
+    unmount = () => { entry.dispose() }
+  })
+}
+
+/** Collapse decorative whitespace while preserving the text a user sees. */
+function visibleText(element: Element): string {
+  return (element.textContent ?? '').replace(/\s+/g, ' ').trim()
+}
+
+/** Open the fixture history session (the alpha log carrying the todo_write turn) and wait for its tail. */
+async function openFixtureSession(): Promise<void> {
+  const tree = await screen.findByRole('tree', { name: 'Sessions' }, { timeout: 10_000 })
+  // Anchor on the expandable Workspace group row: the title and the blank
+  // session row can both read "fixture", and the session-count meta shifts
+  // when a blank session joins the group.
+  const group = (await within(tree).findAllByText('fixture'))
+    .map(el => el.closest<HTMLElement>('[role="treeitem"]'))
+    .find(el => el?.getAttribute('aria-expanded') !== null)
+  if (group === null || group === undefined) throw new Error('fixture Workspace group missing')
+  if (group.getAttribute('aria-expanded') === 'false') {
+    fireEvent.click(within(group).getByText('fixture'))
+    await waitFor(() => {
+      expect(group.getAttribute('aria-expanded')).toBe('true')
+    })
+  }
+  const session = await within(tree).findByText('Fixture 历史会话')
+  fireEvent.click(session)
+  await waitFor(() => {
+    expect(document.querySelector('[data-sample="todo-row"]')).not.toBeNull()
+  }, { timeout: 10_000 })
+}
+
+it('renders the todo_write turn: dedicated tool row + the dock plan strip', async () => {
+  boot()
+  await openFixtureSession()
+
+  const row = document.querySelector('[data-sample="todo-row"]')
+  if (row === null) throw new Error('todo row missing')
+  const panel = document.querySelector('[data-testid="todo-panel"]')
+  if (panel === null) throw new Error('todo panel missing from the input dock')
+
+  // Header spans are adjacent inline nodes; textContent joins "To-dos" +
+  // "1/3…" with no space (visual gap is CSS gap: 10px, not a text node).
+  expect({
+    row: visibleText(row),
+    rowState: row.getAttribute('data-state'),
+    panelHeader: visibleText(panel.querySelector('button') ?? panel),
+    panelItems: [...panel.querySelectorAll('li')].map(item => ({
+      status: item.getAttribute('data-status'),
+      text: visibleText(item),
+    })),
+  }).toMatchInlineSnapshot(`
+    {
+      "panelHeader": "To-dos1/3 tasks · 1 in progress",
+      "panelItems": [
+        {
+          "status": "completed",
+          "text": "梳理需求",
+        },
+        {
+          "status": "in_progress",
+          "text": "实现 fixture 样本",
+        },
+        {
+          "status": "pending",
+          "text": "浏览器验收",
+        },
+      ],
+      "row": "更新任务清单1/3 已完成 · 实现 fixture 样本",
+      "rowState": "ok",
+    }
+  `)
+})
+
+it('collapses the plan strip to the count summary and restores it', async () => {
+  boot()
+  await openFixtureSession()
+
+  const panel = document.querySelector('[data-testid="todo-panel"]')
+  if (panel === null) throw new Error('todo panel missing from the input dock')
+  const header = panel.querySelector('button')
+  if (header === null) throw new Error('todo panel header missing')
+
+  fireEvent.click(header)
+  expect({
+    collapsedHeader: visibleText(header),
+    listGone: panel.querySelector('ul') === null,
+  }).toMatchInlineSnapshot(`
+    {
+      "collapsedHeader": "To-dos1/3 tasks · 1 in progress",
+      "listGone": true,
+    }
+  `)
+
+  fireEvent.click(header)
+  expect(panel.querySelectorAll('li')).toHaveLength(3)
+})
+
+it('hides the plan strip when the next turn starts', async () => {
+  boot()
+  await openFixtureSession()
+  expect(document.querySelector('[data-testid="todo-panel"]')).not.toBeNull()
+
+  const composer = await screen.findByPlaceholderText('Message the agent', {}, { timeout: 10_000 })
+  fireEvent.change(composer, { target: { value: '下一轮清空计划' } })
+  fireEvent.keyDown(composer, { key: 'Enter' })
+
+  await screen.findByText('下一轮清空计划', { exact: true }, { timeout: 10_000 })
+  await waitFor(() => {
+    expect(document.querySelector('[data-testid="todo-panel"]')).toBeNull()
+  }, { timeout: 10_000 })
+
+  expect({
+    promptVisible: screen.getByText('下一轮清空计划', { exact: true }).textContent,
+    panelGone: document.querySelector('[data-testid="todo-panel"]') === null,
+    // Historical todo_write row stays in the flow; only the dock strip clears.
+    rowStillPresent: document.querySelector('[data-sample="todo-row"]') !== null,
+  }).toMatchInlineSnapshot(`
+    {
+      "panelGone": true,
+      "promptVisible": "下一轮清空计划",
+      "rowStillPresent": true,
+    }
+  `)
+})

apps/web/tests/workspace-flow.snapshot.ts

@@ -0,0 +1,357 @@
+// @vitest-environment jsdom
+// Assembled keyless snapshots of the New Session flow under the agent-parity
+// model: startup auto-connects the recent Workspace's blank session when one
+// exists; without any Workspace the composer is locked in the pure view
+// state until one is chosen. Picking one materializes the full Session+Agent
+// (reuse-or-create of the workspace's blank session), the first ACCEPTED
+// prompt flips blank and surfaces the session in lists, and failures leave
+// no client-side transaction state: a failed attach keeps the view state
+// locked, a rejected prompt keeps the session blank with the draft restored.
+import { readFileSync } from 'node:fs'
+import { join } from 'node:path'
+import { act, cleanup, fireEvent, screen, waitFor, within } from '@testing-library/react'
+import { afterEach, beforeEach, expect, it, vi } from 'vitest'
+import type { WebBootEntry } from '@deepseek-ai/dsh-client-modules/client'
+import { AppWebEntry } from '@deepseek-ai/dsh-client-web'
+
+const PLUGINS: readonly (WebBootEntry & { dir: string })[] = [
+  { id: '@deepseek-ai/dsh-client-connection', dir: 'connection', url: '/plugins/connection.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-runtime', dir: 'runtime', url: '/plugins/runtime.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-connection'], immediately: true },
+  { id: '@deepseek-ai/dsh-client-ui-theme', dir: 'ui-theme', url: '/plugins/ui-theme.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-locale', dir: 'locale', url: '/plugins/locale.js', rev: 'fx', inject: [], immediately: true },
+  { id: '@deepseek-ai/dsh-client-ui-layout', dir: 'ui-layout', url: '/plugins/ui-layout.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-runtime'] },
+  { id: '@deepseek-ai/dsh-client-ui-sidebar', dir: 'ui-sidebar', url: '/plugins/ui-sidebar.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout'] },
+  { id: '@deepseek-ai/dsh-client-ui-settings', dir: 'ui-settings', url: '/plugins/ui-settings.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-sidebar'] },
+  { id: '@deepseek-ai/dsh-client-ui-settings-general', dir: 'ui-settings-general', url: '/plugins/ui-settings-general.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-settings', '@deepseek-ai/dsh-client-locale'] },
+  { id: '@deepseek-ai/dsh-client-ui-models', dir: 'ui-models', url: '/plugins/ui-models.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-settings'] },
+  { id: '@deepseek-ai/dsh-client-ui-conversation', dir: 'ui-conversation', url: '/plugins/ui-conversation.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-layout'] },
+  {
+    id: '@deepseek-ai/dsh-client-ui-workspace',
+    dir: 'ui-workspace',
+    url: '/plugins/ui-workspace.js',
+    rev: 'fx',
+    inject: [
+      '@deepseek-ai/dsh-client-runtime',
+      '@deepseek-ai/dsh-client-ui-conversation',
+      '@deepseek-ai/dsh-client-ui-sidebar',
+    ],
+  },
+  { id: '@deepseek-ai/dsh-client-ui-trajectory', dir: 'ui-trajectory', url: '/plugins/ui-trajectory.js', rev: 'fx', inject: ['@deepseek-ai/dsh-client-ui-conversation'] },
+]
+
+const bundles = new Map(PLUGINS.map(plugin => [
+  plugin.url,
+  readFileSync(join(process.cwd(), 'packages/client', plugin.dir, 'lib/client.js'), 'utf8'),
+]))
+
+interface FixtureWindow extends Window {
+  __DSH_BOOT__?: { rev: string; entries: WebBootEntry[] }
+  __ModuleLoader__?: unknown
+}
+
+class ResizeObserverStub {
+  observe(): void {}
+  disconnect(): void {}
+  unobserve(): void {}
+}
+
+const win = window as FixtureWindow
+let unmount: (() => void) | undefined
+
+beforeEach(() => {
+  localStorage.clear()
+  document.title = 'DeepSeek Harness'
+  vi.stubGlobal('ResizeObserver', ResizeObserverStub)
+  vi.stubGlobal('requestAnimationFrame', (callback: FrameRequestCallback) =>
+    setTimeout(() => { callback(0) }, 0) as unknown as number)
+  vi.stubGlobal('cancelAnimationFrame', (id: number) => { clearTimeout(id) })
+})
+
+afterEach(() => {
+  act(() => { unmount?.() })
+  unmount = undefined
+  cleanup()
+  delete win.__DSH_BOOT__
+  delete win.__ModuleLoader__
+  delete (globalThis as Record<string, unknown>).__fxTiming
+  document.body.innerHTML = ''
+  document.head.querySelectorAll('style[data-plugin]').forEach((style) => { style.remove() })
+  document.title = ''
+  history.replaceState(null, '', '/')
+  vi.unstubAllGlobals()
+})
+
+/** Boot the complete built client graph against one keyless fixture branch. */
+function boot(search: string): void {
+  history.replaceState(null, '', `/${search}`)
+  const root = document.createElement('div')
+  root.id = 'root'
+  document.body.appendChild(root)
+  win.__DSH_BOOT__ = { rev: 'fx', entries: PLUGINS.map(({ dir: _dir, ...plugin }) => plugin) }
+  act(() => {
+    const entry = new AppWebEntry(root, {
+      fetchBundle: (url) => {
+        const code = bundles.get(url)
+        return code === undefined ? Promise.reject(new Error(`missing built bundle ${url}`)) : Promise.resolve(code)
+      },
+      executeBundle: (code) => { (0, eval)(code) },
+    })
+    void entry.run()
+    unmount = () => { entry.dispose() }
+  })
+}
+
+/** Collapse decorative whitespace while preserving the text a user sees. */
+function visibleText(element: Element): string {
+  return (element.textContent ?? '').replace(/\s+/g, ' ').trim()
+}
+
+/** Identify the interactive Workspace chip (view state or blank-session hero) by its menu contract. */
+function workspaceChip(): HTMLElement {
+  const chip = screen.getAllByRole('button', { name: 'Choose workspace' })
+    .find(element => element.getAttribute('aria-haspopup') === 'menu')
+  if (chip === undefined) throw new Error('Workspace chip missing')
+  return chip
+}
+
+/** The locked view-state composer (no session yet). */
+async function findLockedComposer(): Promise<HTMLTextAreaElement> {
+  return await screen.findByPlaceholderText(
+    'Choose a workspace to start', {}, { timeout: 10_000 },
+  )
+}
+
+/** The live blank-session hero composer (session materialized). */
+async function findHeroComposer(): Promise<HTMLTextAreaElement> {
+  return await screen.findByPlaceholderText(
+    'Describe what you want to build', {}, { timeout: 10_000 },
+  )
+}
+
+/** Edit the machine-owned controlled input and assert the same-tick echo. */
+function setComposerText(composer: HTMLElement, value: string): void {
+  fireEvent.change(composer, { target: { value } })
+  expect((composer as HTMLTextAreaElement).value).toBe(value)
+}
+
+/** Drive the picker's create flow: chip → Create a new workspace → name dialog. */
+async function createWorkspaceViaPicker(name: string): Promise<void> {
+  fireEvent.click(workspaceChip())
+  fireEvent.click(await screen.findByRole('menuitem', { name: 'Create a new workspace' }))
+  const dialog = await screen.findByRole('dialog', { name: 'Create a new workspace' })
+  fireEvent.change(within(dialog).getByRole('textbox', { name: 'New workspace name' }), {
+    target: { value: name },
+  })
+  fireEvent.click(within(dialog).getByRole('button', { name: 'Create workspace' }))
+}
+
+/** Pick an existing Workspace row from the chip menu. */
+async function pickWorkspace(title: string): Promise<void> {
+  fireEvent.click(workspaceChip())
+  fireEvent.click(await screen.findByRole('menuitem', { name: title }))
+}
+
+it('locks the composer in the New Session view state until a Workspace is chosen', async () => {
+  boot('?fixture=empty')
+
+  const composer = await findLockedComposer()
+  const tree = screen.getByRole('tree', { name: 'Sessions' })
+
+  expect({
+    headline: visibleText(screen.getByText("Let's start building")),
+    chip: visibleText(workspaceChip()),
+    composerDisabled: composer.disabled,
+    sendDisabled: screen.getByRole<HTMLButtonElement>('button', { name: 'Send message' }).disabled,
+    sidebar: visibleText(tree),
+  }).toMatchInlineSnapshot(`
+    {
+      "chip": "Choose workspace",
+      "composerDisabled": true,
+      "headline": "Let's start building",
+      "sendDisabled": true,
+      "sidebar": "No sessions yet",
+    }
+  `)
+})
+
+it('selects the recent Workspace and opens its blank Session on first load', async () => {
+  boot('?fixture')
+
+  const composer = await findHeroComposer()
+  const tree = screen.getByRole('tree', { name: 'Sessions' })
+  await waitFor(() => { expect(within(tree).getByText('4 sessions')).toBeDefined() }, { timeout: 10_000 })
+
+  expect({
+    chip: visibleText(workspaceChip()),
+    composerDisabled: composer.disabled,
+    blankRow: within(tree).getByText('New Session').textContent,
+  }).toMatchInlineSnapshot(`
+    {
+      "blankRow": "New Session",
+      "chip": "fixture",
+      "composerDisabled": false,
+    }
+  `)
+})
+
+it('creating a Workspace materializes and lists its selected blank Session', async () => {
+  boot('?fixture=empty')
+
+  await findLockedComposer()
+  await createWorkspaceViaPicker('nova')
+
+  // The pick connected the workspace: full Session+Agent exists, composer live.
+  const composer = await findHeroComposer()
+  const tree = screen.getByRole('tree', { name: 'Sessions' })
+  await waitFor(() => { expect(within(tree).getByText('1 session')).toBeDefined() })
+  expect(within(tree).getByText('New Session')).toBeDefined()
+  const group = within(tree).getByText('1 session').closest('[role="treeitem"]')
+  if (group === null) throw new Error('created Workspace projection missing')
+
+  expect({
+    composerDisabled: composer.disabled,
+    chip: visibleText(workspaceChip()),
+    workspace: visibleText(group),
+  }).toMatchInlineSnapshot(`
+    {
+      "chip": "nova",
+      "composerDisabled": false,
+      "workspace": "nova1 session",
+    }
+  `)
+})
+
+it('New Session reuses the Workspace blank session and converts the single visible row', async () => {
+  boot('?fixture=empty')
+
+  await findLockedComposer()
+  await createWorkspaceViaPicker('nova')
+  await findHeroComposer()
+  const tree = screen.getByRole('tree', { name: 'Sessions' })
+  await waitFor(() => { expect(within(tree).getByText('1 session')).toBeDefined() }, { timeout: 10_000 })
+
+  // New Session resolves through the recent Workspace and reuses its blank
+  // session in place: no locked interlude, no second entity.
+  const newSessionButton = screen.getAllByRole('button', { name: 'New session' })
+    .find(button => visibleText(button) === 'New Session')
+  if (newSessionButton === undefined) throw new Error('New Session button missing')
+  fireEvent.click(newSessionButton)
+  const composer = await findHeroComposer()
+  await waitFor(() => { expect(within(tree).getByText('1 session')).toBeDefined() }, { timeout: 10_000 })
+
+  setComposerText(composer, 'first light')
+  fireEvent.keyDown(composer, { key: 'Enter' })
+
+  // Conversion: the accepted prompt flips blank without adding a second row.
+  await screen.findByText('first light', { exact: true }, { timeout: 10_000 })
+  await waitFor(() => { expect(within(tree).getByText('1 session')).toBeDefined() }, { timeout: 10_000 })
+  const group = within(tree).getByText('1 session').closest('[role="treeitem"]')
+  if (group === null) throw new Error('converted Session projection missing')
+
+  expect({
+    workspace: visibleText(group),
+    promptVisible: screen.getByText('first light', { exact: true }).textContent,
+  }).toMatchInlineSnapshot(`
+    {
+      "promptVisible": "first light",
+      "workspace": "nova1 session",
+    }
+  `)
+})
+
+it('a failed Workspace attach recovers by reusing the published blank session', async () => {
+  boot('?fixture&fixtureAttach=fail')
+
+  // The rejected startup connect surfaces the locked view state first: the
+  // failure leaves no client-side transaction state to unwind.
+  await findLockedComposer()
+
+  // The host published the session before rejecting attachment (blank, with
+  // the workspace cwd), so the next connect — retry or manual pick — reuses
+  // it instead of minting a duplicate, and the hero opens on it.
+  await pickWorkspace('fixture')
+  const composer = await findHeroComposer()
+  const tree = screen.getByRole('tree', { name: 'Sessions' })
+  const group = within(tree).getByText('3 sessions').closest('[role="treeitem"]')
+  if (group === null) throw new Error('fixture Workspace projection missing')
+
+  expect({
+    headline: visibleText(screen.getByText("Let's start building")),
+    composerDisabled: composer.disabled,
+    chip: visibleText(workspaceChip()),
+    workspace: visibleText(group),
+  }).toMatchInlineSnapshot(`
+    {
+      "chip": "fixture",
+      "composerDisabled": false,
+      "headline": "Let's start building",
+      "workspace": "fixture3 sessions",
+    }
+  `)
+})
+
+it('a rejected first prompt keeps the session blank and the draft in the machine', async () => {
+  boot('?fixture=empty&fixturePrompt=reject')
+
+  await findLockedComposer()
+  await createWorkspaceViaPicker('nova')
+  const composer = await findHeroComposer()
+
+  setComposerText(composer, 'do not lose this')
+  fireEvent.click(screen.getByRole('button', { name: 'Send message' }))
+
+  const alert = await screen.findByRole('alert', {}, { timeout: 10_000 })
+  // Failure restore rides the machine (no pendingPrompt transaction): the
+  // draft returns to the same resident textarea one render later. The
+  // attempt flips the composer out of the hero (engaging = retry chrome),
+  // but acceptance never happened: the session row stays New Session.
+  const retained = await screen.findByDisplayValue('do not lose this')
+  const tree = screen.getByRole('tree', { name: 'Sessions' })
+  const group = within(tree).getByText('1 session').closest('[role="treeitem"]')
+  if (group === null) throw new Error('rejected-send Workspace projection missing')
+
+  expect({
+    error: visibleText(alert),
+    prompt: (retained as HTMLTextAreaElement).value,
+    blankRow: within(tree).getByText('New Session').textContent,
+    workspace: visibleText(group),
+  }).toMatchInlineSnapshot(`
+    {
+      "blankRow": "New Session",
+      "error": "fixture: prompt rejected before acceptance (agent-busy)",
+      "prompt": "do not lose this",
+      "workspace": "nova1 session",
+    }
+  `)
+})
+
+it('switching Workspace before the first message carries the draft to the new blank session', async () => {
+  boot('?fixture')
+
+  const composer = await findHeroComposer()
+  setComposerText(composer, 'carry me')
+
+  // Switch = session switch: the new workspace's blank session takes over,
+  // the typed draft moves machine-to-machine, the old blank stays hidden.
+  await createWorkspaceViaPicker('nova')
+  await waitFor(() => { expect(visibleText(workspaceChip())).toBe('nova') }, { timeout: 10_000 })
+  const carried = await screen.findByDisplayValue('carry me')
+  const tree = screen.getByRole('tree', { name: 'Sessions' })
+  const fixtureGroup = within(tree).getByText('3 sessions').closest('[role="treeitem"]')
+  const novaGroup = within(tree).getByText('1 session').closest('[role="treeitem"]')
+  if (fixtureGroup === null || novaGroup === null) throw new Error('Workspace projections missing after switch')
+
+  expect({
+    chip: visibleText(workspaceChip()),
+    prompt: (carried as HTMLTextAreaElement).value,
+    fixtureWorkspace: visibleText(fixtureGroup),
+    novaWorkspace: visibleText(novaGroup),
+  }).toMatchInlineSnapshot(`
+    {
+      "chip": "nova",
+      "fixtureWorkspace": "fixture3 sessions",
+      "novaWorkspace": "nova1 session",
+      "prompt": "carry me",
+    }
+  `)
+})

apps/web/tests/workspace-management.e2e.ts

@@ -0,0 +1,368 @@
+// Web e2e scenarios: workspace management — the create-by-name dialog, the
+// rename round trip over the real wire (workspace.rename RPC + durable
+// registry), duplicate-name pre-check, the flat "In one list" view with its
+// persisted group-by preference, and the session hover card. Zero model
+// calls: workspace.create/rename are host RPCs with no model involvement,
+// and the one session row the flat/hover scenarios need comes from a seeded
+// fixture (the seeded-history seed reused verbatim — no new recording).
+import { mkdir, readFile, stat, writeFile } from 'node:fs/promises'
+import { fileURLToPath } from 'node:url'
+import { join } from 'node:path'
+import type { Browser, Page } from 'playwright'
+import { chromium } from 'playwright'
+import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
+import { SessionId } from '@deepseek-ai/dsh-session'
+import {
+  acknowledgeReloadConnectionLoss, assertFixtureInventory, launchWebScaffold, seedSession, watchConsole,
+  webSnapshotMode, type WebScaffold,
+} from './scaffold.ts'
+import { saveFailureShot } from './support.ts'
+
+const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/workspace-management', import.meta.url))
+// The seed is another scenario's committed fixture, reused read-only: this
+// spec needs any one cold session row, not new recorded content.
+const SEED = fileURLToPath(new URL('./snapshots/seeded-history/seed.jsonl', import.meta.url))
+const MODE = webSnapshotMode()
+const SEED_ID = 'workspace-management-web-e2e'
+
+describe('web e2e: workspace management (create / rename / flat view / hover card)', () => {
+  let scaffold: WebScaffold
+  let browser: Browser
+  let page: Page
+  let tripwire: ReturnType<typeof watchConsole>
+  let pickedDirectory: string | null = null
+
+  beforeAll(async () => {
+    scaffold = await launchWebScaffold({})
+    scaffold.ctx.apiProxy.host.pickDirectory = request => Promise.resolve({
+      rpcId: request.rpcId,
+      result: { ok: true, value: { path: pickedDirectory } },
+    })
+    // Seed one cold session (Ungrouped bucket) for the flat view + hover card.
+    const sessionCwd = join(scaffold.workspaceCwd, 'workspace')
+    await mkdir(sessionCwd, { recursive: true })
+    await writeFile(join(sessionCwd, 'a.txt'), 'alpha\n')
+    await writeFile(join(sessionCwd, 'b.txt'), 'beta\n')
+    await seedSession(scaffold, await readFile(SEED, 'utf8'), SEED_ID)
+    browser = await chromium.launch()
+    page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
+    tripwire = watchConsole(page)
+    await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+  }, 120_000)
+
+  afterAll(async () => {
+    await browser?.close()
+    await scaffold?.close()
+  })
+
+  it('creates two workspaces by name through the region-header dialog', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-ws-create'))
+    const createByName = async (name: string): Promise<void> => {
+      await page.getByRole('button', { name: 'Create workspace' }).click()
+      await page.getByRole('menuitem', { name: 'Create a new workspace' }).click()
+      const dialog = page.getByRole('dialog', { name: 'Create a new workspace' })
+      await dialog.waitFor({ timeout: 10_000 })
+      await dialog.getByLabel('New workspace name').fill(name)
+      await dialog.getByRole('button', { name: 'Create workspace' }).click()
+      await expect.poll(() => page.getByRole('dialog', { name: 'Create a new workspace' }).count(), { timeout: 10_000 }).toBe(0)
+      // The real workspace materializes in the tree as a group row.
+      await expect.poll(() => page.getByText(name, { exact: true }).count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(1)
+    }
+    await createByName('alpha-ws')
+    await createByName('beta-ws')
+    // Durable on the host: both registered, newest first (create prepends).
+    const titles = scaffold.ctx.workspace.list().map(workspace => workspace.title)
+    expect(titles.slice(0, 2)).toEqual(['beta-ws', 'alpha-ws'])
+    expect(tripwire.pageErrors).toEqual([])
+  }, 90_000)
+
+  it('renames a workspace over the wire with a duplicate-name pre-check', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-ws-rename'))
+    // The actions button is display:none until its row hovers — hover the
+    // group row first, then the revealed button becomes actionable.
+    await page.locator('[role="treeitem"]').filter({ hasText: 'alpha-ws' }).first().hover()
+    await page.getByRole('button', { name: 'Workspace actions for alpha-ws' }).click()
+    await page.getByRole('menuitem', { name: 'Rename' }).click()
+    const dialog = page.getByRole('dialog', { name: 'Rename workspace' })
+    await dialog.waitFor({ timeout: 10_000 })
+    const input = dialog.getByLabel('Workspace name')
+    // Client pre-check: a name colliding with another live workspace raises
+    // the inline alert and blocks the primary button before any wire call.
+    await input.fill('beta-ws')
+    await expect.poll(() => dialog.getByRole('alert').count(), { timeout: 5_000 }).toBe(1)
+    expect(await dialog.getByRole('button', { name: 'Rename' }).isDisabled()).toBe(true)
+    // A fresh name goes through workspace.rename to the durable registry.
+    await input.fill('gamma-ws')
+    await expect.poll(() => dialog.getByRole('alert').count(), { timeout: 5_000 }).toBe(0)
+    await dialog.getByRole('button', { name: 'Rename' }).click()
+    await expect.poll(() => page.getByRole('dialog', { name: 'Rename workspace' }).count(), { timeout: 10_000 }).toBe(0)
+    await expect.poll(() => page.getByText('gamma-ws', { exact: true }).count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(1)
+    expect(await page.getByText('alpha-ws', { exact: true }).count()).toBe(0)
+    // Host durability, then reload: the projection is rebuilt from the wire.
+    expect(scaffold.ctx.workspace.list().map(workspace => workspace.title)).toContain('gamma-ws')
+    const warningStart = tripwire.warnings.length
+    await page.reload({ waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    acknowledgeReloadConnectionLoss(tripwire, warningStart)
+    await expect.poll(() => page.getByText('gamma-ws', { exact: true }).count(), { timeout: 15_000 }).toBeGreaterThanOrEqual(1)
+    expect(tripwire.pageErrors).toEqual([])
+  }, 90_000)
+
+  it('deletes only the Workspace registration and keeps its current Session, folder, and log', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-ws-delete'))
+    const slotConsoleErrors: string[] = []
+    const transientSlotErrors: string[] = []
+    page.on('console', (message) => {
+      if (message.type() === 'error' && /slot entry crashed/i.test(message.text())) {
+        slotConsoleErrors.push(message.text())
+      }
+    })
+    await page.exposeFunction('recordDshSlotError', (key: string) => {
+      if (!transientSlotErrors.includes(key)) transientSlotErrors.push(key)
+    })
+    await page.evaluate(() => {
+      const target = window as unknown as { recordDshSlotError(key: string): Promise<void> }
+      const seen = new Set<string>()
+      const collect = (): void => {
+        for (const node of document.querySelectorAll<HTMLElement>('[data-slot-error]')) {
+          const key = node.dataset.slotError ?? ''
+          if (!seen.has(key)) {
+            seen.add(key)
+            void target.recordDshSlotError(key)
+          }
+        }
+      }
+      new MutationObserver(collect).observe(document.documentElement, { childList: true, subtree: true })
+      collect()
+    })
+    // Register the scaffold's existing project directory through the real UI.
+    pickedDirectory = scaffold.workspaceCwd
+    await page.getByRole('button', { name: 'Create workspace' }).click()
+    await page.getByRole('menuitem', { name: 'Open local folder…' }).click()
+
+    await expect.poll(
+      () => scaffold.ctx.workspace.resolveByPath(scaffold.workspaceCwd),
+      { timeout: 10_000 },
+    ).not.toBeUndefined()
+    const workspace = await scaffold.ctx.workspace.resolveByPath(scaffold.workspaceCwd)
+    if (workspace === undefined) throw new Error('GUI did not register the existing project directory')
+    await workspace.attachSession(SessionId(SEED_ID))
+    const header = (await scaffold.ctx.sessionPersistence.list())
+      .find(candidate => candidate.id === SEED_ID)
+    if (header === undefined) throw new Error('seeded Session log disappeared before deletion')
+    const logLocation = scaffold.ctx.sessionPersistence.locate(header)
+    if (logLocation === undefined) throw new Error('JSONL persistence did not expose the seeded log path')
+    expect(await readFile(join(scaffold.workspaceCwd, 'workspace', 'a.txt'), 'utf8')).toBe('alpha\n')
+    await stat(logLocation.path)
+
+    // Open the seeded (first/accounted) Session so deletion must preserve the
+    // current selection while it moves into Ungrouped.
+    const groupRow = page.locator('[role="treeitem"]').filter({ hasText: workspace.title }).first()
+    await groupRow.waitFor({ timeout: 10_000 })
+    const groupSection = groupRow.locator('..')
+    if (await groupSection.locator('[role="treeitem"]').count() < 2) await groupRow.click()
+    await expect.poll(
+      () => groupSection.locator('[role="treeitem"]').count(),
+      { timeout: 10_000 },
+    ).toBeGreaterThanOrEqual(2)
+    const seededRow = groupSection.locator('[role="treeitem"]').nth(1)
+    await seededRow.click()
+    await expect.poll(() => seededRow.getAttribute('aria-selected'), { timeout: 10_000 }).toBe('true')
+
+    await groupRow.hover()
+    await page.getByRole('button', { name: `Workspace actions for ${workspace.title}` }).click()
+    await page.getByRole('menuitem', { name: 'Delete workspace' }).click()
+    const dialog = page.getByRole('dialog', { name: 'Delete workspace' })
+    await dialog.waitFor({ timeout: 10_000 })
+    const copy = await dialog.textContent()
+    expect(copy).toContain('workspace list')
+    expect(copy).toContain('folder and session logs will be kept')
+    expect(copy).toContain('sessions will appear under Ungrouped')
+    await dialog.getByRole('button', { name: 'Delete workspace' }).click()
+    await expect.poll(() => dialog.count(), { timeout: 10_000 }).toBe(0)
+
+    expect(scaffold.ctx.workspace.get(workspace.id)).toBeUndefined()
+    await expect.poll(
+      () => page.getByRole('button', { name: `Workspace actions for ${workspace.title}` }).count(),
+      { timeout: 10_000 },
+    ).toBe(0)
+    await expect.poll(() => page.getByText('Ungrouped', { exact: true }).count(), { timeout: 10_000 })
+      .toBeGreaterThanOrEqual(1)
+    await expect.poll(
+      () => page.locator('[role="treeitem"][aria-selected="true"]').count(),
+      { timeout: 10_000 },
+    ).toBe(1)
+    expect(await readFile(join(scaffold.workspaceCwd, 'workspace', 'a.txt'), 'utf8')).toBe('alpha\n')
+    await stat(logLocation.path)
+    expect((await scaffold.ctx.sessionPersistence.inspect(SessionId(SEED_ID))).events.length).toBeGreaterThan(0)
+
+    // Re-registering the exact deleted path immediately, without a reload, is
+    // a supported reversible flow. It creates a fresh Workspace id without
+    // re-adopting the retained Session.
+    pickedDirectory = scaffold.workspaceCwd
+    await page.getByRole('button', { name: 'Create workspace' }).click()
+    await page.getByRole('menuitem', { name: 'Open local folder…' }).click()
+    await expect.poll(
+      () => scaffold.ctx.workspace.resolveByPath(scaffold.workspaceCwd),
+      { timeout: 10_000 },
+    ).not.toBeUndefined()
+    const reregistered = await scaffold.ctx.workspace.resolveByPath(scaffold.workspaceCwd)
+    expect(reregistered?.id).toBeDefined()
+    expect(reregistered?.id).not.toBe(workspace.id)
+    expect(reregistered?.sessionIds).toEqual([])
+    await expect.poll(() => page.getByText('Ungrouped', { exact: true }).count(), { timeout: 10_000 })
+      .toBeGreaterThanOrEqual(1)
+    expect(await readFile(join(scaffold.workspaceCwd, 'workspace', 'a.txt'), 'utf8')).toBe('alpha\n')
+    await stat(logLocation.path)
+
+    // Restore the deleted-registry state so reload still verifies deletion
+    // persistence independently of the successful re-registration above.
+    if (reregistered === undefined) throw new Error('same-path re-registration did not materialize')
+    await scaffold.ctx.workspace.delete(reregistered.id)
+    await expect.poll(
+      () => page.getByRole('button', { name: `Workspace actions for ${reregistered.title}` }).count(),
+      { timeout: 10_000 },
+    ).toBe(0)
+
+    const warningStart = tripwire.warnings.length
+    await page.reload({ waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    acknowledgeReloadConnectionLoss(tripwire, warningStart)
+    await expect.poll(() => page.getByText('Ungrouped', { exact: true }).count(), { timeout: 15_000 })
+      .toBeGreaterThanOrEqual(1)
+    await expect.poll(
+      () => page.locator('[role="treeitem"][aria-selected="true"]').count(),
+      { timeout: 15_000 },
+    ).toBe(1)
+    expect(scaffold.ctx.workspace.get(workspace.id)).toBeUndefined()
+    expect(await readFile(join(scaffold.workspaceCwd, 'workspace', 'a.txt'), 'utf8')).toBe('alpha\n')
+    await stat(logLocation.path)
+    expect((await scaffold.ctx.sessionPersistence.inspect(SessionId(SEED_ID))).events.length).toBeGreaterThan(0)
+
+    expect(transientSlotErrors).toEqual([])
+    expect(slotConsoleErrors).toEqual([])
+    expect(tripwire.pageErrors).toEqual([])
+  }, 90_000)
+
+  it('reuses a deleted title for a different new directory without any transient error surface', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-ws-reuse-title'))
+    const title = 'same-name'
+    const oldPath = join(scaffold.workspaceCwd, 'adopted', title)
+    await mkdir(oldPath, { recursive: true })
+    const transientErrors: string[] = []
+    const consoleErrors: string[] = []
+    page.on('console', (message) => {
+      if (message.type() === 'error') consoleErrors.push(message.text())
+    })
+    await page.exposeFunction('recordDshTransientWorkspaceError', (message: string) => {
+      if (!transientErrors.includes(message)) transientErrors.push(message)
+    })
+    await page.evaluate(() => {
+      const target = window as unknown as {
+        recordDshTransientWorkspaceError(message: string): Promise<void>
+      }
+      const collect = (): void => {
+        for (const node of document.querySelectorAll<HTMLElement>('[data-slot-error], [role="alert"]')) {
+          const message = node.dataset.slotError ?? node.textContent?.trim() ?? ''
+          if (message !== '') void target.recordDshTransientWorkspaceError(message)
+        }
+      }
+      new MutationObserver(collect).observe(document.documentElement, { childList: true, subtree: true })
+      collect()
+    })
+
+    pickedDirectory = oldPath
+    await page.getByRole('button', { name: 'Create workspace' }).click()
+    await page.getByRole('menuitem', { name: 'Open local folder…' }).click()
+    await expect.poll(
+      () => scaffold.ctx.workspace.resolveByPath(oldPath),
+      { timeout: 10_000 },
+    ).not.toBeUndefined()
+    const oldWorkspace = await scaffold.ctx.workspace.resolveByPath(oldPath)
+    if (oldWorkspace === undefined) throw new Error('old same-name Workspace was not registered')
+
+    const oldRow = page.locator('[role="treeitem"]').filter({ hasText: title }).first()
+    await oldRow.hover()
+    await page.getByRole('button', { name: `Workspace actions for ${title}` }).click()
+    await page.getByRole('menuitem', { name: 'Delete workspace' }).click()
+    await page.getByRole('dialog', { name: 'Delete workspace' })
+      .getByRole('button', { name: 'Delete workspace' }).click()
+    await expect.poll(() => scaffold.ctx.workspace.get(oldWorkspace.id), { timeout: 10_000 }).toBeUndefined()
+
+    await page.getByRole('button', { name: 'Create workspace' }).click()
+    await page.getByRole('menuitem', { name: 'Create a new workspace' }).click()
+    const create = page.getByRole('dialog', { name: 'Create a new workspace' })
+    await create.getByLabel('New workspace name').fill(title)
+    await create.getByRole('button', { name: 'Create workspace' }).click()
+    await expect.poll(() => create.count(), { timeout: 10_000 }).toBe(0)
+    const fresh = scaffold.ctx.workspace.list().find(workspace => workspace.title === title)
+    expect(fresh?.id).toBeDefined()
+    expect(fresh?.id).not.toBe(oldWorkspace.id)
+    expect(fresh?.path).toBe(join(scaffold.workspaceCwd, title))
+    expect(transientErrors).toEqual([])
+    expect(consoleErrors).toEqual([])
+    expect(tripwire.pageErrors).toEqual([])
+  }, 90_000)
+
+  it('switches to the flat "In one list" view and persists the preference', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-ws-flat'))
+    // Grouped default: workspace group rows render (the seeded session sits
+    // under Ungrouped; the created workspaces are empty groups).
+    await expect.poll(() => page.getByText('Workspaces', { exact: true }).count(), { timeout: 10_000 }).toBe(1)
+    await page.getByRole('button', { name: 'Group by' }).click()
+    await page.getByRole('menuitem', { name: 'In one list' }).click()
+    // Flat mode: the section label flips and the seeded session is a
+    // top-level row with no group headers above it.
+    await expect.poll(() => page.getByText('Sessions', { exact: true }).count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(1)
+    await expect.poll(() => page.getByText('Ungrouped', { exact: true }).count(), { timeout: 5_000 }).toBe(0)
+    await expect.poll(() => page.locator('[role="treeitem"]').count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(1)
+    expect(await page.evaluate(() => localStorage.getItem('dsh.workspace.view'))).toContain('flat')
+    // Persisted across reload; then restore grouped for inter-spec hygiene.
+    const warningStart = tripwire.warnings.length
+    await page.reload({ waitUntil: 'load' })
+    await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
+    acknowledgeReloadConnectionLoss(tripwire, warningStart)
+    await expect.poll(() => page.getByText('Ungrouped', { exact: true }).count(), { timeout: 15_000 }).toBe(0)
+    await page.getByRole('button', { name: 'Group by' }).click()
+    await page.getByRole('menuitem', { name: 'WorkSpace' }).click()
+    await expect.poll(() => page.getByText('Ungrouped', { exact: true }).count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(1)
+    expect(tripwire.pageErrors).toEqual([])
+  }, 90_000)
+
+  it('shows the session hover card after a dwell on the row', async () => {
+    onTestFailed(() => saveFailureShot(page, 'web-e2e-ws-hover'))
+    // Expand Ungrouped to reveal the seeded session row, then dwell on it
+    // (the card opens after a 500ms hover delay, portaled to body).
+    const ungroupedRow = page.getByText('Ungrouped', { exact: true }).locator('..').locator('..')
+    const ungroupedSection = ungroupedRow.locator('..')
+    // Initial-current auto-expansion can race this following test's gesture;
+    // converge on expanded rather than assuming which update wins first.
+    await expect.poll(async () => {
+      if (await ungroupedRow.getAttribute('aria-expanded') !== 'true') {
+        await page.getByText('Ungrouped', { exact: true }).click()
+        await page.waitForTimeout(50)
+      }
+      return await ungroupedRow.getAttribute('aria-expanded')
+    }, { timeout: 5_000 }).toBe('true')
+    // The only visible child is the non-blank persisted Session; the blank
+    // Session created while adopting the Workspace remains hidden.
+    const sessionRow = ungroupedSection.locator('[role="treeitem"]').nth(1)
+    await sessionRow.waitFor({ timeout: 10_000 })
+    await sessionRow.hover()
+    // Card content: the full title plus the Idle status line (display-only
+    // card; no aria role — text anchors are the stable selector).
+    await expect.poll(() => page.getByText('Idle', { exact: true }).count(), { timeout: 5_000 }).toBeGreaterThanOrEqual(1)
+    // Leaving the anchor closes it with no delay.
+    await page.getByRole('button', { name: '设置' }).hover()
+    await expect.poll(() => page.getByText('Idle', { exact: true }).count(), { timeout: 5_000 }).toBe(0)
+    expect(tripwire.pageErrors).toEqual([])
+  }, 60_000)
+
+  it.skipIf(MODE === 'record')('issued zero model calls and stayed clean', async () => {
+    expect(tripwire.warnings).toEqual([])
+    // This spec mints no fixture directory contents of its own; the seed it
+    // reuses is owned (and inventory-guarded) by seeded-history.
+    await assertFixtureInventory(SNAPSHOT_DIR, ['.gitkeep'])
+  })
+})