steering.e2e.ts 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395
  1. // Web e2e scenarios for both steering entry points: QueueDock strictly
  2. // transfers one queued occurrence, while the complementary composer gestures
  3. // choose Queue or Steer. The question tool supplies a deterministic pending-
  4. // steering snapshot before the step can drain.
  5. import { readFile } from 'node:fs/promises'
  6. import { fileURLToPath } from 'node:url'
  7. import { join } from 'node:path'
  8. import type { Browser, Page } from 'playwright'
  9. import { chromium } from 'playwright'
  10. import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
  11. import { parseSessionLog } from '@deepseek-ai/dsh-llm-replay'
  12. import type { SessionEvent } from '@deepseek-ai/dsh-session'
  13. import {
  14. assertFixtureInventory, captureStableAria, compareOrRefreshGolden, fixtureUserPrompts,
  15. launchWebScaffold, recordFixture, watchConsole, webSnapshotMode, type WebScaffold,
  16. } from './scaffold.ts'
  17. import { connectFreshWorkspace, newEnglishPage, saveFailureShot } from './support.ts'
  18. const SNAPSHOT_DIR = fileURLToPath(new URL('../../../snapshots/web/steering', import.meta.url))
  19. const FIXTURE = join(SNAPSHOT_DIR, 'session.jsonl')
  20. // Two goldens pin the transient Host projection and its durable handoff: the
  21. // mid-turn state renders accepted steering from the Session control queue while the
  22. // question blocks admission, then the settled state renders the same message
  23. // from user/message beside the reply that obeys it.
  24. const MID_EXPECTED = join(SNAPSHOT_DIR, 'mid-steer.expected.md')
  25. const SETTLED_EXPECTED = join(SNAPSHOT_DIR, 'settled.expected.md')
  26. const MODE = webSnapshotMode()
  27. // The question composer replaces the textarea, so fill → Queue row → Steer
  28. // starts only after request/context and must finish before the first replay
  29. // chunk. The compact canonical call plus 500 ms pacing gives loaded CI enough
  30. // time without stretching a long provider-authored chunk sequence.
  31. const REPLAY_PACE_MS = 500
  32. 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.'
  33. const STEER = 'Interjection: include the word BANANA in your final reply.'
  34. // Empty-draft flush scenario: an override-only fixture. The whole-script
  35. // replacement answers both model calls of a FRESH session (no recorded
  36. // session.jsonl exists — call 0 keeps the turn open with a question-tool
  37. // call, call 1 is the reply after both steerings drain).
  38. const STEER_ALL_DIR = fileURLToPath(new URL('./expected/steer-all', import.meta.url))
  39. const STEER_ALL_FIXTURE = join(STEER_ALL_DIR, 'session.jsonl')
  40. const STEER_ALL_OVERRIDE = join(STEER_ALL_DIR, 'replay.override.json')
  41. const STEER_ALL_MID = join(STEER_ALL_DIR, 'mid-steer.expected.md')
  42. const STEER_ALL_SETTLED = join(STEER_ALL_DIR, 'settled.expected.md')
  43. const STEER_ONE = 'Interjection: include the word BANANA in your final reply.'
  44. const STEER_TWO = 'Interjection: include the word ORANGE in your final reply.'
  45. /** Concatenated assistant text deltas — the model-visible reply body. */
  46. function assistantText(events: SessionEvent[]): string {
  47. return events
  48. .filter(e => e.type === 'assistant/chunk')
  49. .map((e) => {
  50. const chunk = (e as SessionEvent & { data: { chunk: { type: string; text?: string } } }).data.chunk
  51. return chunk.type === 'text-delta' ? chunk.text ?? '' : ''
  52. })
  53. .join('')
  54. }
  55. /** Claimed user messages whose payload contains the exact scenario text. */
  56. function claimedMessages(events: readonly SessionEvent[], text: string): SessionEvent<'user/message'>[] {
  57. return events.filter((event): event is SessionEvent<'user/message'> =>
  58. event.type === 'user/message' && JSON.stringify(event.data.content).includes(text))
  59. }
  60. describe('web e2e: mid-turn steering lands durably and visibly', () => {
  61. let scaffold: WebScaffold
  62. let browser: Browser
  63. let page: Page
  64. let tripwire: ReturnType<typeof watchConsole>
  65. const sessionEvents: SessionEvent[] = []
  66. beforeAll(async () => {
  67. scaffold = await launchWebScaffold(MODE === 'record'
  68. ? {}
  69. : { replayFixture: FIXTURE, paceMs: REPLAY_PACE_MS, compareReplaySession: true })
  70. scaffold.ctx.on('session/event', (_session, event) => { sessionEvents.push(event) })
  71. browser = await chromium.launch()
  72. page = await newEnglishPage(browser)
  73. tripwire = watchConsole(page)
  74. await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
  75. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  76. // Fresh world: connect a Workspace so the composer scenarios start live.
  77. await connectFreshWorkspace(page, scaffold.workspaceCwd)
  78. }, 120_000)
  79. afterAll(async () => {
  80. await browser?.close()
  81. await scaffold?.close()
  82. })
  83. it('strictly steers one queued row; the interjection is logged, rendered, and obeyed', async () => {
  84. onTestFailed(() => saveFailureShot(page, 'web-e2e-steering'))
  85. if (MODE !== 'record') {
  86. // The steer lands as a durable user/message, so the inventory holds
  87. // both the opening prompt and the later same-turn steer.
  88. expect(fixtureUserPrompts(await readFile(FIXTURE, 'utf8'))).toEqual([PROMPT, STEER])
  89. }
  90. const input = page.locator('textarea').first()
  91. await input.waitFor({ timeout: 10_000 })
  92. const settled = scaffold.whenTurnSettled(MODE === 'record' ? 180_000 : 30_000)
  93. await input.fill(PROMPT)
  94. await input.press('Enter')
  95. await expect.poll(
  96. () => sessionEvents.some(event => event.type === 'request/context'),
  97. { timeout: 10_000 },
  98. ).toBe(true)
  99. // Enter remains the Queue gesture. The row action then atomically moves
  100. // this exact occurrence into the current turn's steering outbox.
  101. await input.fill(STEER)
  102. await input.press('Enter')
  103. const queuedRow = page.getByRole('listitem').filter({ hasText: STEER })
  104. await queuedRow.waitFor({ timeout: 10_000 })
  105. const steerButton = queuedRow.getByRole('button', { name: 'Steer queued message' })
  106. await expect.poll(() => steerButton.isEnabled(), { timeout: 10_000 }).toBe(true)
  107. await steerButton.click({ timeout: 10_000 })
  108. const pendingSteering = page.locator('[data-pending-steering]').filter({ hasText: STEER })
  109. // A timeout while the Queue row remains means strict steer lost to a
  110. // closing window (`steer-unavailable`); inspect replay pacing first.
  111. await pendingSteering.waitFor({ timeout: 10_000 })
  112. // The blocked composer keeps steering pending long enough to observe the
  113. // Host-authoritative mirror before the loop admits it durably.
  114. const composer = page.locator('[data-question-key]')
  115. await composer.waitFor({ timeout: MODE === 'record' ? 120_000 : 30_000 })
  116. if (MODE !== 'record') {
  117. expect(await page.getByText(STEER, { exact: true }).count()).toBe(1)
  118. expect(await pendingSteering.count()).toBe(1)
  119. expect(await page.getByRole('button', { name: 'Edit queued message' }).count()).toBe(0)
  120. const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd)
  121. await compareOrRefreshGolden(MID_EXPECTED, snapshot, MODE)
  122. }
  123. // Answer the composer; the tool result closes the step, the loop drains
  124. // the steer as user/message, and the steered continuation runs the
  125. // final model call.
  126. await composer.getByRole('radio', { name: 'Yes' }).click()
  127. await composer.getByRole('radio', { name: 'Yes' }).press('Enter')
  128. await settled
  129. if (MODE === 'record') {
  130. const sessionId = await settled
  131. await recordFixture(scaffold, sessionId, FIXTURE)
  132. // Fixture honesty: a recording where the live model ignored the steer
  133. // would replay as a vacuous scenario — reject it and re-record instead.
  134. const recorded = parseSessionLog(await readFile(FIXTURE, 'utf8'))
  135. expect(claimedMessages(recorded, STEER)).toHaveLength(1)
  136. expect(assistantText(recorded)).toContain('BANANA')
  137. return
  138. }
  139. // Durable: exactly one claimed user/message carrying the steering text.
  140. const steerEvents = claimedMessages(sessionEvents, STEER)
  141. expect(steerEvents).toHaveLength(1)
  142. expect(JSON.stringify(steerEvents[0])).toContain('BANANA')
  143. const turnEnds = sessionEvents.filter(e => e.type === 'turn/end')
  144. expect(turnEnds).toHaveLength(1)
  145. expect((turnEnds[0] as SessionEvent & { data: { reason: { kind: string } } }).data.reason.kind).toBe('completed')
  146. // Visible: the plain steering bubble plus the reply that obeys it
  147. // (steer text + final reply each contain the marker word).
  148. await expect.poll(() => page.getByText(STEER, { exact: true }).count(), { timeout: 15_000 }).toBe(1)
  149. expect(await pendingSteering.count()).toBe(0)
  150. await expect.poll(() => page.getByText('BANANA', { exact: false }).count(), { timeout: 10_000 }).toBeGreaterThanOrEqual(2)
  151. expect(await page.locator('[data-question-key]').count()).toBe(0)
  152. // Settled golden: steer text between the question round trip and the
  153. // obeying reply, composer takeover gone.
  154. const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd)
  155. await compareOrRefreshGolden(SETTLED_EXPECTED, snapshot, MODE)
  156. expect(tripwire.pageErrors).toEqual([])
  157. expect(tripwire.warnings).toEqual([])
  158. }, 200_000)
  159. it.skipIf(MODE === 'record')('keeps the fixture inventory closed', async () => {
  160. await assertFixtureInventory(SNAPSHOT_DIR, ['session.jsonl', 'mid-steer.expected.md', 'settled.expected.md'])
  161. })
  162. })
  163. describe('web e2e: composer shortcut steers directly', () => {
  164. let scaffold: WebScaffold
  165. let browser: Browser
  166. let page: Page
  167. let tripwire: ReturnType<typeof watchConsole>
  168. const sessionEvents: SessionEvent[] = []
  169. beforeAll(async () => {
  170. scaffold = await launchWebScaffold({ replayFixture: FIXTURE, paceMs: REPLAY_PACE_MS, compareReplaySession: false })
  171. scaffold.ctx.on('session/event', (_session, event) => { sessionEvents.push(event) })
  172. browser = await chromium.launch()
  173. page = await newEnglishPage(browser)
  174. tripwire = watchConsole(page)
  175. await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
  176. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  177. await connectFreshWorkspace(page, scaffold.workspaceCwd)
  178. }, 120_000)
  179. afterAll(async () => {
  180. await browser?.close()
  181. await scaffold?.close()
  182. })
  183. it.skipIf(MODE === 'record')('uses Cmd+Enter without creating a Queue row', async () => {
  184. onTestFailed(() => saveFailureShot(page, 'web-e2e-composer-steering'))
  185. expect(fixtureUserPrompts(await readFile(FIXTURE, 'utf8'))).toEqual([PROMPT, STEER])
  186. const input = page.locator('textarea').first()
  187. await input.waitFor({ timeout: 10_000 })
  188. const settled = scaffold.whenTurnSettled(30_000)
  189. await input.fill(PROMPT)
  190. await input.press('Enter')
  191. await page.getByRole('button', { name: 'Stop generating' }).waitFor({ timeout: 10_000 })
  192. await input.fill(STEER)
  193. await input.press('Meta+Enter')
  194. await expect.poll(() => input.inputValue(), { timeout: 5_000 }).toBe('')
  195. expect(await page.locator('[data-queue-dock]').count()).toBe(0)
  196. const composer = page.locator('[data-question-key]')
  197. await composer.waitFor({ timeout: 30_000 })
  198. const pendingSteering = page.locator('[data-pending-steering]').filter({ hasText: STEER })
  199. await pendingSteering.waitFor({ timeout: 10_000 })
  200. await composer.getByRole('radio', { name: 'Yes' }).click()
  201. await composer.getByRole('radio', { name: 'Yes' }).press('Enter')
  202. await settled
  203. const steerEvents = claimedMessages(sessionEvents, STEER)
  204. expect(steerEvents).toHaveLength(1)
  205. await expect.poll(() => page.getByText(STEER, { exact: true }).count(), { timeout: 15_000 }).toBe(1)
  206. expect(await pendingSteering.count()).toBe(0)
  207. await expect.poll(() => page.getByText('BANANA', { exact: false }).count(), { timeout: 10_000 })
  208. .toBeGreaterThanOrEqual(2)
  209. expect(tripwire.pageErrors).toEqual([])
  210. expect(tripwire.warnings).toEqual([])
  211. }, 90_000)
  212. })
  213. describe('web e2e: composer shortcut follows the swapped busy behavior', () => {
  214. let scaffold: WebScaffold
  215. let browser: Browser
  216. let page: Page
  217. let tripwire: ReturnType<typeof watchConsole>
  218. const sessionEvents: SessionEvent[] = []
  219. beforeAll(async () => {
  220. scaffold = await launchWebScaffold({ replayFixture: FIXTURE, paceMs: REPLAY_PACE_MS, compareReplaySession: false })
  221. scaffold.ctx.on('session/event', (_session, event) => { sessionEvents.push(event) })
  222. browser = await chromium.launch()
  223. page = await newEnglishPage(browser)
  224. tripwire = watchConsole(page)
  225. await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
  226. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  227. await connectFreshWorkspace(page, scaffold.workspaceCwd)
  228. }, 120_000)
  229. afterAll(async () => {
  230. await browser?.close()
  231. await scaffold?.close()
  232. })
  233. it.skipIf(MODE === 'record')('queues Cmd+Enter when plain Enter is configured to Steer', async () => {
  234. onTestFailed(() => saveFailureShot(page, 'web-e2e-composer-swapped-shortcut'))
  235. await page.getByRole('button', { name: 'Settings', exact: true }).click()
  236. const dialog = page.getByRole('dialog', { name: 'Settings' })
  237. await dialog.getByRole('button', { name: 'Queue' }).click()
  238. await page.getByRole('menuitem', { name: 'Steer' }).click()
  239. await dialog.getByRole('button', { name: 'Steer' }).waitFor({ timeout: 10_000 })
  240. await page.keyboard.press('Escape')
  241. const input = page.locator('textarea').first()
  242. const settled = scaffold.whenTurnSettled(30_000)
  243. await input.fill(PROMPT)
  244. await input.press('Enter')
  245. await page.getByRole('button', { name: 'Stop generating' }).waitFor({ timeout: 10_000 })
  246. const queuedText = 'Queued by the complementary Cmd+Enter shortcut.'
  247. await input.fill(queuedText)
  248. await input.press('Meta+Enter')
  249. const queuedRow = page.locator('[data-queue-dock]').getByRole('listitem').filter({ hasText: queuedText })
  250. await queuedRow.getByText(queuedText, { exact: true }).waitFor({ timeout: 10_000 })
  251. expect(await page.locator('[data-pending-steering]').filter({ hasText: queuedText }).count()).toBe(0)
  252. expect(claimedMessages(sessionEvents, queuedText)).toHaveLength(0)
  253. // Remove the asserted Queue row, then finish the recorded question turn
  254. // so replay teardown still proves that every fixture call was consumed.
  255. await queuedRow.getByRole('button', { name: 'Remove queued message' }).click()
  256. const composer = page.locator('[data-question-key]')
  257. await composer.waitFor({ timeout: 30_000 })
  258. await composer.getByRole('radio', { name: 'Yes' }).click()
  259. await composer.getByRole('radio', { name: 'Yes' }).press('Enter')
  260. await settled
  261. expect(tripwire.pageErrors).toEqual([])
  262. expect(tripwire.warnings).toEqual([])
  263. }, 90_000)
  264. })
  265. describe('web e2e: empty-draft Cmd+Enter steers the whole queue', () => {
  266. let scaffold: WebScaffold
  267. let browser: Browser
  268. let page: Page
  269. let tripwire: ReturnType<typeof watchConsole>
  270. const sessionEvents: SessionEvent[] = []
  271. beforeAll(async () => {
  272. // The scenario boots a fresh session against the override-only fixture;
  273. // the replay.override.json sidecar replaces the derived script, so the
  274. // (deliberately absent) session.jsonl is never read.
  275. scaffold = await launchWebScaffold({
  276. replayFixture: STEER_ALL_FIXTURE,
  277. replayOverride: STEER_ALL_OVERRIDE,
  278. paceMs: REPLAY_PACE_MS,
  279. })
  280. scaffold.ctx.on('session/event', (_session, event) => { sessionEvents.push(event) })
  281. browser = await chromium.launch()
  282. page = await newEnglishPage(browser)
  283. tripwire = watchConsole(page)
  284. await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
  285. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  286. await connectFreshWorkspace(page, scaffold.workspaceCwd)
  287. await page.getByText('Standard mode', { exact: true }).waitFor({ timeout: 10_000 })
  288. }, 120_000)
  289. afterAll(async () => {
  290. await browser?.close()
  291. await scaffold?.close()
  292. })
  293. it.skipIf(MODE === 'record')('queues two messages, then flushes both with an empty-draft Cmd+Enter', async () => {
  294. onTestFailed(() => saveFailureShot(page, 'web-e2e-steer-all'))
  295. const input = page.locator('textarea').first()
  296. await input.waitFor({ timeout: 10_000 })
  297. const settled = scaffold.whenTurnSettled(30_000)
  298. // Call 0 streams a question-tool call; the fills must land inside the
  299. // first replay window, before the question composer replaces the textarea.
  300. await input.fill(PROMPT)
  301. await input.press('Enter')
  302. await input.fill(STEER_ONE)
  303. await input.press('Enter')
  304. await input.fill(STEER_TWO)
  305. await input.press('Enter')
  306. const dock = page.locator('[data-queue-dock]')
  307. // Both messages queued: the two-row dock shows a collapsed count header,
  308. // and Playwright text matching skips the hidden rows — expand the list,
  309. // then assert each row's content.
  310. await dock.getByText('2 queued messages').waitFor({ timeout: 10_000 })
  311. await dock.getByRole('button').click()
  312. await dock.getByText(STEER_ONE, { exact: true }).waitFor({ timeout: 10_000 })
  313. await dock.getByText(STEER_TWO, { exact: true }).waitFor({ timeout: 10_000 })
  314. expect(await page.locator('[data-pending-steering]').count()).toBe(0)
  315. // Empty draft + Cmd+Enter: both queued rows steer in FIFO order, the dock
  316. // empties, and the pending steering renders at the conversation tail.
  317. await input.press('Meta+Enter')
  318. await expect.poll(
  319. () => page.locator('[data-pending-steering]').filter({ hasText: /BANANA|ORANGE/ }).count(),
  320. { timeout: 10_000 },
  321. ).toBe(2)
  322. expect(await page.locator('[data-queue-dock]').count()).toBe(0)
  323. // The reasoning row streams independently of the steering handoff. Wait
  324. // for the block to settle so the mid snapshot does not race its transient
  325. // visually-hidden Running label while the question keeps the turn open.
  326. await page.locator('[data-variant="think"][data-state="ok"]').first().waitFor({ timeout: 10_000 })
  327. const mid = await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd)
  328. await compareOrRefreshGolden(STEER_ALL_MID, mid, MODE)
  329. // Answer the question; the step closes, the loop drains both steerings
  330. // into one next-step request, and the final reply obeys both markers.
  331. const composer = page.locator('[data-question-key]')
  332. await composer.waitFor({ timeout: 30_000 })
  333. await composer.getByRole('radio', { name: 'Yes' }).click()
  334. await composer.getByRole('radio', { name: 'Yes' }).press('Enter')
  335. await settled
  336. const first = claimedMessages(sessionEvents, STEER_ONE)
  337. const second = claimedMessages(sessionEvents, STEER_TWO)
  338. expect(first).toHaveLength(1)
  339. expect(second).toHaveLength(1)
  340. expect(assistantText(sessionEvents)).toContain('BANANA')
  341. expect(assistantText(sessionEvents)).toContain('ORANGE')
  342. await expect.poll(() => page.getByText(STEER_ONE, { exact: true }).count(), { timeout: 15_000 }).toBe(1)
  343. await expect.poll(() => page.getByText(STEER_TWO, { exact: true }).count(), { timeout: 15_000 }).toBe(1)
  344. expect(await page.locator('[data-pending-steering]').count()).toBe(0)
  345. const snapshot = await captureStableAria(page, '[class*="centerCol"]', scaffold.workspaceCwd)
  346. await compareOrRefreshGolden(STEER_ALL_SETTLED, snapshot, MODE)
  347. expect(tripwire.pageErrors).toEqual([])
  348. expect(tripwire.warnings).toEqual([])
  349. }, 200_000)
  350. it.skipIf(MODE === 'record')('keeps the fixture inventory closed', async () => {
  351. await assertFixtureInventory(STEER_ALL_DIR, [
  352. 'replay.override.json', 'mid-steer.expected.md', 'settled.expected.md',
  353. ])
  354. })
  355. })