message-actions.e2e.ts 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200
  1. // Web e2e scenario: message IconActions + clocks. Cold-seeds a deterministic
  2. // completed-turn-tail fork case (zero model calls) and pins the settled
  3. // conversation aria after the footers are focus-revealed — the surface package
  4. // jsdom tests cannot substitute for (docs/testing.md snapshot rule).
  5. import { mkdir, readFile, writeFile } from 'node:fs/promises'
  6. import { join } from 'node:path'
  7. import { fileURLToPath } from 'node:url'
  8. import type { Browser, Page } from 'playwright'
  9. import { chromium } from 'playwright'
  10. import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
  11. import { SessionId } from '@deepseek-ai/dsh-session'
  12. import {
  13. assertFixtureInventory, captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
  14. launchWebScaffold, parseSeedFixture, renderSeedFixture, seedSession, watchConsole, webSnapshotMode, type WebScaffold,
  15. } from './scaffold.ts'
  16. import { newEnglishPage, saveFailureShot } from './support.ts'
  17. const SNAPSHOT_DIR = fileURLToPath(new URL('../../../snapshots/web/message-actions', import.meta.url))
  18. // Borrowed read-only: this scenario needs any settled user+assistant pair, not
  19. // a new recording (workspace-management / sidebar-scrollbar pattern).
  20. const SEED = fileURLToPath(new URL('../../../snapshots/web/seeded-history/session.jsonl', import.meta.url))
  21. const UI_EXPECTED = join(SNAPSHOT_DIR, 'ui.expected.md')
  22. const FORK_EXPECTED = join(SNAPSHOT_DIR, 'fork.expected.md')
  23. const MODE = webSnapshotMode()
  24. const SEED_ID = 'message-actions-web-e2e'
  25. 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.'
  26. const MID_TURN_TEXT = 'I will read both files before answering.'
  27. const SECOND_PROMPT = 'Now give the final answer.'
  28. /**
  29. * Adapt the borrowed recording into response -> tools -> interrupted Think,
  30. * followed by one ordinary completed response. The first response keeps
  31. * copy/clock but is not a legal branch point; the second is the real turn tail.
  32. * @param raw - Recorded seeded-history JSONL.
  33. * @returns A contiguous, closed two-turn fixture.
  34. */
  35. function completedTailFixture(raw: string): string {
  36. const decoded = parseSeedFixture(raw)
  37. const kept = decoded.events.filter(event => event.seq < 101).map((event) => {
  38. if (event.type === 'assistant/message' && event.seq === 64) {
  39. const data = event.data as unknown as { content?: unknown[] }
  40. const content = data.content
  41. if (!Array.isArray(content)) throw new Error('borrowed step-one assistant message has no content')
  42. return {
  43. ...event,
  44. data: { ...data, content: [...content.slice(0, 1), { type: 'text', text: MID_TURN_TEXT }, ...content.slice(1)] },
  45. }
  46. }
  47. return event
  48. })
  49. let seq = kept.length
  50. let time = (kept.at(-1)?.time ?? -1) + 1
  51. const at = (event: Record<string, unknown>): { seq: number; time: number } & Record<string, unknown> => ({
  52. ...event,
  53. seq: seq++,
  54. time: time++,
  55. })
  56. const tail = [
  57. at({ type: 'step/end', data: { turn: 1, step: 2 } }),
  58. at({ type: 'turn/end', data: { turn: 1, reason: { kind: 'aborted' } } }),
  59. at({ type: 'turn/start', data: { turn: 2, trigger: { kind: 'message', source: { kind: 'user', rpcId: '{{rpcId}}' } } } }),
  60. at({ type: 'user/message', data: { content: [{ type: 'text', text: SECOND_PROMPT }], source: { kind: 'user', rpcId: '{{rpcId}}' } }, surfaceOp: 'append' }),
  61. at({ type: 'step/start', data: { turn: 2, step: 1 } }),
  62. at({ type: 'assistant/message', data: { turn: 2, step: 1, content: [{ type: 'text', text: 'DONE' }], provenance: { provider: 'deepseek-official', model: 'deepseek-v4-flash' } }, sourceEventSeqs: [], surfaceOp: 'append' }),
  63. at({ type: 'step/end', data: { turn: 2, step: 1 } }),
  64. at({ type: 'turn/end', data: { turn: 2, reason: { kind: 'completed' } } }),
  65. ]
  66. return renderSeedFixture(decoded.headerLine, [...kept, ...tail])
  67. }
  68. describe('web e2e: message IconActions and clocks on settled history', () => {
  69. let scaffold: WebScaffold
  70. let browser: Browser
  71. let page: Page
  72. let tripwire: ReturnType<typeof watchConsole>
  73. beforeAll(async () => {
  74. scaffold = await launchWebScaffold({})
  75. const sessionCwd = join(scaffold.workspaceCwd, 'workspace')
  76. await mkdir(sessionCwd, { recursive: true })
  77. await writeFile(join(sessionCwd, 'a.txt'), 'alpha\n')
  78. await writeFile(join(sessionCwd, 'b.txt'), 'beta\n')
  79. const raw = completedTailFixture(await readFile(SEED, 'utf8'))
  80. expect(fixtureUserPrompts(raw), 'adapted seed must carry both prompts').toEqual([PROMPT, SECOND_PROMPT])
  81. await seedSession(scaffold, raw, SEED_ID)
  82. browser = await chromium.launch()
  83. page = await newEnglishPage(browser)
  84. tripwire = watchConsole(page)
  85. await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
  86. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  87. }, 120_000)
  88. afterAll(async () => {
  89. await browser?.close()
  90. await scaffold?.close()
  91. })
  92. it.skipIf(MODE === 'record')('enables branch only on the completed transcript tail', async () => {
  93. onTestFailed(() => saveFailureShot(page, 'web-e2e-message-actions'))
  94. const groupRow = page.locator('[role="treeitem"]').first()
  95. await groupRow.waitFor({ timeout: 15_000 })
  96. await groupRow.click()
  97. const sessionRow = page.locator('[role="treeitem"]').nth(1)
  98. await sessionRow.waitFor({ timeout: 10_000 })
  99. await sessionRow.click()
  100. await expect.poll(() => page.getByText(MID_TURN_TEXT, { exact: true }).count(), { timeout: 15_000 }).toBe(1)
  101. await expect.poll(() => page.getByText('DONE', { exact: true }).count(), { timeout: 15_000 }).toBe(1)
  102. // Focus-reveal the footers (hover:hover keeps them opacity-hidden until
  103. // hover/focus-within). Branch renders only under assistant answers — user
  104. // bubbles carry none — and only a completed transcript tail enables it.
  105. const copyButtons = page.getByRole('button', { name: 'Copy' })
  106. await expect.poll(() => copyButtons.count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(4)
  107. await copyButtons.first().focus()
  108. const branchButtons = page.getByRole('button', { name: 'Branch into a new conversation' })
  109. await expect.poll(() => branchButtons.count(), { timeout: 5_000 }).toBe(2)
  110. await expect.poll(
  111. () => branchButtons.evaluateAll(buttons => buttons.map(button => button.getAttribute('aria-disabled'))),
  112. { timeout: 5_000 },
  113. ).toEqual(['true', null])
  114. await branchButtons.first().focus()
  115. await expect.poll(() => page.getByRole('tooltip').textContent(), { timeout: 5_000 })
  116. .toBe('Available only on the last message of a completed turn')
  117. await expect.poll(() => page.getByRole('button', { name: 'Edit' }).count(), { timeout: 5_000 }).toBe(0)
  118. }, 60_000)
  119. it.skipIf(MODE === 'record')('matches the conversation aria golden with IconActions and clocks', async () => {
  120. onTestFailed(() => saveFailureShot(page, 'web-e2e-message-actions-aria'))
  121. await page.getByRole('button', { name: /^Select model, current/ })
  122. .waitFor({ timeout: 10_000 })
  123. await page.getByText(/Cache hit \d+%/u).first().waitFor({ timeout: 10_000 })
  124. // Keep a footer focused so opacity-hidden actions stay in the a11y tree
  125. // as an active/focused control during the capture.
  126. await page.getByRole('button', { name: 'Copy' }).first().focus()
  127. const snapshot = (await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd))
  128. .split(SEED_ID).join('{{seededId}}')
  129. await compareOrRefreshGolden(UI_EXPECTED, snapshot, MODE)
  130. })
  131. it.skipIf(MODE === 'record')('forks through the settled-message and session-row actions', async () => {
  132. onTestFailed(() => saveFailureShot(page, 'web-e2e-message-fork'))
  133. // The last message action belongs to the completed second-turn assistant.
  134. await page.getByRole('button', { name: 'Branch into a new conversation' }).last().click()
  135. await expect.poll(
  136. () => scaffold.ctx.agents.list().find(agent => agent.session.header.parentSession === SessionId(SEED_ID)),
  137. { timeout: 15_000 },
  138. ).toBeDefined()
  139. await expect.poll(
  140. () => page.locator('[role="treeitem"]').count(),
  141. { timeout: 10_000 },
  142. ).toBe(3)
  143. await expect.poll(
  144. () => page.locator('[role="treeitem"][aria-selected="true"]').count(),
  145. { timeout: 10_000 },
  146. ).toBe(1)
  147. // The row action owns a distinct ui-workspace injection from the message
  148. // action above, so exercise both through the loaded app before capture.
  149. const sourceRow = page.locator('[role="treeitem"][aria-selected="true"]')
  150. const rowBox = await sourceRow.boundingBox()
  151. if (rowBox === null) throw new Error('fork source row has no layout box')
  152. const actionButton = sourceRow.locator('button[aria-label^="Session actions for "]')
  153. await sourceRow.hover({ position: { x: rowBox.width - 16, y: rowBox.height / 2 } })
  154. await expect.poll(() => actionButton.isVisible(), { timeout: 2_000 }).toBe(true)
  155. const buttonBox = await actionButton.boundingBox()
  156. if (buttonBox === null) throw new Error('fork source row action has no layout box')
  157. await page.mouse.click(buttonBox.x + buttonBox.width / 2, buttonBox.y + buttonBox.height / 2)
  158. await page.getByRole('menuitem', { name: 'Fork session' }).click()
  159. await expect.poll(
  160. () => scaffold.ctx.agents.list().filter(agent => agent.session.header.parentSession !== undefined).length,
  161. { timeout: 15_000 },
  162. ).toBe(2)
  163. await expect.poll(
  164. () => page.locator('[role="treeitem"]').count(),
  165. { timeout: 10_000 },
  166. ).toBe(4)
  167. await expect.poll(
  168. () => page.locator('[role="treeitem"][aria-selected="true"]').count(),
  169. { timeout: 10_000 },
  170. ).toBe(1)
  171. // The child row is published before its inherited title rename settles;
  172. // wait for that second RPC projection before freezing the ARIA tree.
  173. await expect.poll(
  174. () => page.locator('[role="treeitem"][aria-selected="true"]').textContent(),
  175. { timeout: 10_000 },
  176. ).toContain('Use the read tool twice (2)')
  177. const tree = await captureStableAria(
  178. page,
  179. '[role="tree"][aria-label="Sessions"]',
  180. scaffold.workspaceCwd,
  181. )
  182. await compareOrRefreshGolden(FORK_EXPECTED, tree, MODE)
  183. })
  184. it.skipIf(MODE === 'record')('issued zero model calls and kept a closed inventory', async () => {
  185. expect(tripwire.pageErrors).toEqual([])
  186. expect(tripwire.warnings).toEqual([])
  187. await assertFixtureInventory(SNAPSHOT_DIR, ['fork.expected.md', 'ui.expected.md'])
  188. })
  189. })