| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283 |
- // Web e2e scenario: message IconActions + clocks. Cold-seeds a deterministic
- // completed-turn-tail fork case with an unchanged resume header (zero model
- // calls) and pins the settled conversation aria after the footers are
- // focus-revealed — the surface package jsdom tests cannot substitute for
- // (docs/testing.md snapshot rule).
- import { mkdir, readFile, writeFile } from 'node:fs/promises'
- import { join } from 'node:path'
- 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 { SessionId } from '@deepseek-ai/dsh-session'
- import {
- assertFixtureInventory, captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
- launchWebScaffold, parseSeedFixture, renderSeedFixture, seedSession, watchConsole, webSnapshotMode, type WebScaffold,
- } from './scaffold.ts'
- import { newEnglishPage, saveFailureShot } from './support.ts'
- const SNAPSHOT_DIR = fileURLToPath(new URL('../../../snapshots/web/message-actions', import.meta.url))
- // Borrowed read-only: this scenario needs any settled user+assistant pair, not
- // a new recording (workspace-management / sidebar-scrollbar pattern).
- const SEED = fileURLToPath(new URL('../../../snapshots/web/seeded-history/session.v3.jsonl', import.meta.url))
- const UI_EXPECTED = join(SNAPSHOT_DIR, 'ui.expected.md')
- const FORK_EXPECTED = join(SNAPSHOT_DIR, 'fork.expected.md')
- const MODE = webSnapshotMode()
- const SEED_ID = 'message-actions-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.'
- const MID_TURN_TEXT = 'I will read both files before answering.'
- const SECOND_PROMPT = 'Now give the final answer.'
- /**
- * Adapt the borrowed recording into response -> tools -> interrupted Think,
- * followed by one ordinary completed response. The first response keeps
- * copy/clock but is not a legal branch point; the second is the real turn tail.
- * @param raw - Recorded seeded-history JSONL.
- * @returns A contiguous, closed two-turn fixture.
- */
- function completedTailFixture(raw: string): string {
- const decoded = parseSeedFixture(raw)
- const stepTwoStart = decoded.events.findIndex(event =>
- event.type === 'step/start' && event.data.turn === 1 && event.data.step === 2)
- if (stepTwoStart < 0) throw new Error('borrowed fixture has no step-two start')
- const kept = decoded.events.slice(0, stepTwoStart + 1).map((event) => {
- if (event.type !== 'assistant/message' || event.data.turn !== 1 || event.data.step !== 1) return event
- const finish = event.data.stream.findIndex(record =>
- record.type === 'chunk' && record.chunk.type === 'finish')
- if (finish < 0) throw new Error('borrowed step-one Assistant message has no finish record')
- const finishRecord = event.data.stream[finish]!
- if (finishRecord.type !== 'chunk') throw new Error('borrowed step-one finish is not a chunk record')
- const streamTime = finishRecord.time
- return {
- ...event,
- data: {
- ...event.data,
- message: {
- ...event.data.message,
- content: [...event.data.message.content, { type: 'text' as const, text: MID_TURN_TEXT }],
- },
- stream: [
- ...event.data.stream.slice(0, finish),
- { type: 'chunk' as const, time: streamTime, chunk: { type: 'block-start' as const, index: 3, blockType: 'text' as const } },
- { type: 'text-chunks' as const, time0: streamTime, index: 3, dt: [], texts: [MID_TURN_TEXT] },
- {
- type: 'chunk' as const,
- time: streamTime,
- chunk: { type: 'block-end' as const, index: 3, block: { type: 'text' as const, text: MID_TURN_TEXT } },
- },
- ...event.data.stream.slice(finish),
- ],
- },
- }
- })
- const inheritedHeader = kept.findLast(event => event.type === 'request/header')
- if (inheritedHeader?.type !== 'request/header') {
- throw new Error('borrowed recording has no request header')
- }
- let seq = (kept.at(-1)?.seq ?? -1) + 1
- let time = (kept.at(-1)?.time ?? -1) + 1
- const at = (event: Record<string, unknown>): { seq: number; time: number } & Record<string, unknown> => ({
- ...event,
- seq: seq++,
- time: time++,
- })
- const tail = [
- at({
- type: 'assistant/attempt',
- data: {
- turn: 1,
- step: 2,
- stream: [
- { type: 'chunk', time, chunk: { type: 'block-start', index: 0, blockType: 'reasoning' } },
- { type: 'reasoning-chunks', time0: time, index: 0, dt: [], texts: ['This path was interrupted.'] },
- {
- type: 'chunk',
- time,
- chunk: { type: 'block-end', index: 0, block: { type: 'reasoning', text: 'This path was interrupted.' } },
- },
- { type: 'chunk', time, chunk: { type: 'finish', reason: { kind: 'stop' } } },
- ],
- },
- }),
- at({ type: 'step/end', data: { turn: 1, step: 2 } }),
- at({ type: 'turn/end', data: { turn: 1, reason: { kind: 'aborted', reason: { kind: 'user' } } } }),
- at({ type: 'turn/start', data: { turn: 2 } }),
- at({
- type: 'user/message',
- data: {
- content: [{ type: 'text', text: SECOND_PROMPT }],
- source: { kind: 'user' },
- role: 'user',
- id: '{{message:98}}',
- },
- surfaceOp: 'append',
- }),
- at({ type: 'step/start', data: { turn: 2, step: 1 } }),
- at({ type: 'request/header', data: { header: inheritedHeader.data.header, reason: 'resume' } }),
- at({
- type: 'assistant/message',
- data: {
- turn: 2,
- step: 1,
- message: {
- role: 'assistant',
- content: [{ type: 'text', text: 'DONE' }],
- source: { kind: 'model', provider: 'deepseek-official', model: 'deepseek-v4-flash' },
- id: '{{message:99}}',
- },
- stream: [
- { type: 'chunk', time: 0, chunk: { type: 'block-start', index: 0, blockType: 'text' } },
- { type: 'text-chunks', time0: 0, index: 0, dt: [], texts: ['DONE'] },
- { type: 'chunk', time: 0, chunk: { type: 'block-end', index: 0, block: { type: 'text', text: 'DONE' } } },
- { type: 'chunk', time: 0, chunk: { type: 'finish', reason: { kind: 'stop' } } },
- ],
- },
- surfaceOp: 'append',
- }),
- at({ type: 'step/end', data: { turn: 2, step: 1 } }),
- at({ type: 'turn/end', data: { turn: 2, reason: { kind: 'completed' } } }),
- ]
- return renderSeedFixture(decoded.headerLine, [...kept, ...tail])
- }
- describe('web e2e: message IconActions and clocks on settled history', () => {
- let scaffold: WebScaffold
- let browser: Browser
- let page: Page
- let tripwire: ReturnType<typeof watchConsole>
- beforeAll(async () => {
- scaffold = await launchWebScaffold({})
- 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')
- const raw = completedTailFixture(await readFile(SEED, 'utf8'))
- expect(fixtureUserPrompts(raw), 'adapted seed must carry both prompts').toEqual([PROMPT, SECOND_PROMPT])
- expect(parseSeedFixture(raw).events.flatMap(event => event.type === 'request/header'
- ? [event.data.reason]
- : []), 'adapted seed must carry an unchanged resume header').toEqual(['initial', 'resume'])
- await seedSession(scaffold, raw, SEED_ID)
- browser = await chromium.launch()
- page = await newEnglishPage(browser)
- tripwire = watchConsole(page)
- await page.goto(scaffold.authenticatedUrl, { waitUntil: 'load' })
- await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
- }, 120_000)
- afterAll(async () => {
- await browser?.close()
- await scaffold?.close()
- })
- it.skipIf(MODE === 'record')('enables branch only on the completed transcript tail', async () => {
- onTestFailed(() => saveFailureShot(page, 'web-e2e-message-actions'))
- 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(MID_TURN_TEXT, { exact: true }).count(), { timeout: 15_000 }).toBe(1)
- await expect.poll(() => page.getByText('DONE', { exact: true }).count(), { timeout: 15_000 }).toBe(1)
- await expect.poll(
- () => page.getByRole('button', { name: 'System prompt', exact: true }).count(),
- { timeout: 10_000 },
- ).toBe(2)
- // Focus-reveal the footers (hover:hover keeps them opacity-hidden until
- // hover/focus-within). Branch renders only under assistant answers — user
- // bubbles carry none — and only a completed transcript tail enables it.
- const copyButtons = page.getByRole('button', { name: 'Copy' })
- await expect.poll(() => copyButtons.count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(4)
- await copyButtons.first().focus()
- const branchButtons = page.getByRole('button', { name: 'Branch into a new conversation' })
- await expect.poll(() => branchButtons.count(), { timeout: 5_000 }).toBe(2)
- await expect.poll(
- () => branchButtons.evaluateAll(buttons => buttons.map(button => button.getAttribute('aria-disabled'))),
- { timeout: 5_000 },
- ).toEqual(['true', null])
- await branchButtons.first().focus()
- await expect.poll(() => page.getByRole('tooltip').textContent(), { timeout: 5_000 })
- .toBe('Available only on the last message of a completed turn')
- await expect.poll(() => page.getByRole('button', { name: 'Edit' }).count(), { timeout: 5_000 }).toBe(0)
- }, 60_000)
- it.skipIf(MODE === 'record')('matches the conversation aria golden with IconActions and clocks', async () => {
- onTestFailed(() => saveFailureShot(page, 'web-e2e-message-actions-aria'))
- await page.getByRole('button', { name: /^Select model, current/ })
- .waitFor({ timeout: 10_000 })
- await page.getByText(/Cache hit \d+%/u).first().waitFor({ timeout: 10_000 })
- // Keep a footer focused so opacity-hidden actions stay in the a11y tree
- // as an active/focused control during the capture.
- await page.getByRole('button', { name: 'Copy' }).first().focus()
- const snapshot = (await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd))
- .split(SEED_ID).join('{{seededId}}')
- await compareOrRefreshGolden(UI_EXPECTED, snapshot, MODE)
- })
- it.skipIf(MODE === 'record')('forks through the settled-message and session-row actions', async () => {
- onTestFailed(() => saveFailureShot(page, 'web-e2e-message-fork'))
- // The last message action belongs to the completed second-turn assistant.
- await page.getByRole('button', { name: 'Branch into a new conversation' }).last().click()
- await expect.poll(
- () => scaffold.ctx.agents.list().find(agent => agent.session.header.parentSession === SessionId(SEED_ID)),
- { timeout: 15_000 },
- ).toBeDefined()
- await expect.poll(
- () => page.locator('[role="treeitem"]').count(),
- { timeout: 10_000 },
- ).toBe(3)
- await expect.poll(
- () => page.locator('[role="treeitem"][aria-selected="true"]').count(),
- { timeout: 10_000 },
- ).toBe(1)
- await expect.poll(
- () => page.locator('[role="treeitem"][aria-selected="true"]').textContent(),
- { timeout: 10_000 },
- ).toContain('Use the read tool twice (1)')
- // The row action owns a distinct ui-workspace injection from the message
- // action above, so exercise both through the loaded app before capture.
- const sourceRow = page.locator('[role="treeitem"][aria-selected="true"]')
- const rowBox = await sourceRow.boundingBox()
- if (rowBox === null) throw new Error('fork source row has no layout box')
- const actionButton = sourceRow.locator('button[aria-label^="Session actions for "]')
- await sourceRow.hover({ position: { x: rowBox.width - 16, y: rowBox.height / 2 } })
- await expect.poll(() => actionButton.isVisible(), { timeout: 2_000 }).toBe(true)
- const buttonBox = await actionButton.boundingBox()
- if (buttonBox === null) throw new Error('fork source row action has no layout box')
- await page.mouse.click(buttonBox.x + buttonBox.width / 2, buttonBox.y + buttonBox.height / 2)
- await page.getByRole('menuitem', { name: 'Fork session' }).click()
- await expect.poll(
- () => scaffold.ctx.agents.list().filter(agent => agent.session.header.parentSession !== undefined).length,
- { timeout: 15_000 },
- ).toBe(2)
- await expect.poll(
- () => page.locator('[role="treeitem"]').count(),
- { timeout: 10_000 },
- ).toBe(4)
- await expect.poll(
- () => page.locator('[role="treeitem"][aria-selected="true"]').count(),
- { timeout: 10_000 },
- ).toBe(1)
- // The child row is published before its inherited title rename settles;
- // wait for that second RPC projection before freezing the ARIA tree.
- await expect.poll(
- () => page.locator('[role="treeitem"][aria-selected="true"]').textContent(),
- { timeout: 10_000 },
- ).toContain('Use the read tool twice (2)')
- const tree = await captureStableAria(
- page,
- '[role="tree"][aria-label="Sessions"]',
- scaffold.workspaceCwd,
- )
- await compareOrRefreshGolden(FORK_EXPECTED, tree, MODE)
- })
- it.skipIf(MODE === 'record')('issued zero model calls and kept a closed inventory', async () => {
- expect(tripwire.pageErrors).toEqual([])
- expect(tripwire.warnings).toEqual([])
- await assertFixtureInventory(SNAPSHOT_DIR, ['fork.expected.md', 'ui.expected.md'])
- })
- })
|