message-actions.e2e.ts 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. // Web e2e scenario: message IconActions + clocks. Cold-seeds the seeded-history
  2. // fixture (zero model calls) and pins the settled conversation aria after the
  3. // user/assistant footers are focus-revealed — the surface package jsdom tests
  4. // 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 {
  12. assertFixtureInventory, captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
  13. launchWebScaffold, seedSession, watchConsole, webSnapshotMode, type WebScaffold,
  14. } from './scaffold.ts'
  15. import { saveFailureShot } from './support.ts'
  16. const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/message-actions', import.meta.url))
  17. // Borrowed read-only: this scenario needs any settled user+assistant pair, not
  18. // a new recording (workspace-management / sidebar-scrollbar pattern).
  19. const SEED = fileURLToPath(new URL('./snapshots/seeded-history/seed.jsonl', import.meta.url))
  20. const UI_EXPECTED = join(SNAPSHOT_DIR, 'ui.expected.md')
  21. const MODE = webSnapshotMode()
  22. const SEED_ID = 'message-actions-web-e2e'
  23. 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.'
  24. describe('web e2e: message IconActions and clocks on settled history', () => {
  25. let scaffold: WebScaffold
  26. let browser: Browser
  27. let page: Page
  28. let tripwire: ReturnType<typeof watchConsole>
  29. beforeAll(async () => {
  30. scaffold = await launchWebScaffold({})
  31. const sessionCwd = join(scaffold.workspaceCwd, 'workspace')
  32. await mkdir(sessionCwd, { recursive: true })
  33. await writeFile(join(sessionCwd, 'a.txt'), 'alpha\n')
  34. await writeFile(join(sessionCwd, 'b.txt'), 'beta\n')
  35. const raw = await readFile(SEED, 'utf8')
  36. expect(fixtureUserPrompts(raw), 'borrowed seed must carry the drive prompt').toEqual([PROMPT])
  37. await seedSession(scaffold, raw, SEED_ID)
  38. browser = await chromium.launch()
  39. page = await browser.newPage({ viewport: { width: 1680, height: 1000 } })
  40. tripwire = watchConsole(page)
  41. await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
  42. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  43. }, 120_000)
  44. afterAll(async () => {
  45. await browser?.close()
  46. await scaffold?.close()
  47. })
  48. it.skipIf(MODE === 'record')('lists the seeded session and reveals user/assistant IconActions', async () => {
  49. onTestFailed(() => saveFailureShot(page, 'web-e2e-message-actions'))
  50. const groupRow = page.locator('[role="treeitem"]').first()
  51. await groupRow.waitFor({ timeout: 15_000 })
  52. await groupRow.click()
  53. const sessionRow = page.locator('[role="treeitem"]').nth(1)
  54. await sessionRow.waitFor({ timeout: 10_000 })
  55. await sessionRow.click()
  56. await expect.poll(() => page.getByText('DONE', { exact: true }).count(), { timeout: 15_000 }).toBe(1)
  57. // Focus-reveal the footers (hover:hover keeps them opacity-hidden until
  58. // hover/focus-within). User has three actions; each finalized assistant
  59. // text node has copy + branch.
  60. const copyButtons = page.getByRole('button', { name: '复制' })
  61. await expect.poll(() => copyButtons.count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(2)
  62. await copyButtons.first().focus()
  63. await expect.poll(() => page.getByRole('button', { name: '在新对话中分支' }).count(), { timeout: 5_000 })
  64. .toBeGreaterThanOrEqual(2)
  65. await expect.poll(() => page.getByRole('button', { name: '编辑' }).count(), { timeout: 5_000 }).toBe(1)
  66. }, 60_000)
  67. it.skipIf(MODE === 'record')('matches the conversation aria golden with IconActions and clocks', async () => {
  68. onTestFailed(() => saveFailureShot(page, 'web-e2e-message-actions-aria'))
  69. await page.getByRole('button', {
  70. name: '选择模型,当前 deepseek-v4-flash',
  71. }).waitFor({ timeout: 10_000 })
  72. // Keep a footer focused so opacity-hidden actions stay in the a11y tree
  73. // as an active/focused control during the capture.
  74. await page.getByRole('button', { name: '复制' }).first().focus()
  75. const snapshot = (await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd))
  76. .split(SEED_ID).join('{{seededId}}')
  77. await compareOrRefreshGolden(UI_EXPECTED, snapshot, MODE)
  78. })
  79. it.skipIf(MODE === 'record')('issued zero model calls and kept a closed inventory', async () => {
  80. expect(tripwire.pageErrors).toEqual([])
  81. expect(tripwire.warnings).toEqual([])
  82. await assertFixtureInventory(SNAPSHOT_DIR, ['ui.expected.md'])
  83. })
  84. })