rail-search-expand.e2e.ts 3.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. // Web e2e scenario: the collapsed rail's search control in the real event
  2. // order. The rail click flips the sidebar wide and mounts WorkspaceBrowser's
  3. // outside-click dismissal listener during its own React dispatch; the same
  4. // click then keeps bubbling to document with the unmounted rail button as its
  5. // target — outside searchRoot. The package-level jsdom test cannot replay
  6. // that continuation (fireEvent does not re-bubble through listeners mounted
  7. // mid-dispatch), so the guard that keeps the gesture alive
  8. // (.agents/notes/implemented/bug-fix/2026-08-18-rail-search-outside-click-self-dismissal.md)
  9. // is pinned here, in the assembled application under a real browser click.
  10. //
  11. // Zero model calls: collapsing the sidebar and expanding the search are pure
  12. // client layout gestures; the scenario needs no session content at all.
  13. import type { Browser, Page } from 'playwright'
  14. import { chromium } from 'playwright'
  15. import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
  16. import { launchWebScaffold, watchConsole, type WebScaffold } from './scaffold.ts'
  17. import { newEnglishPage, saveFailureShot } from './support.ts'
  18. /** WorkspaceBrowser's rail-search focus delay (EXPAND_SLIDE_MS) plus flush headroom. */
  19. const FOCUS_SETTLE_MS = 600
  20. describe('web e2e: rail search click survives its own document-level bubble', () => {
  21. let scaffold: WebScaffold
  22. let browser: Browser
  23. let page: Page
  24. let tripwire: ReturnType<typeof watchConsole>
  25. beforeAll(async () => {
  26. scaffold = await launchWebScaffold({})
  27. browser = await chromium.launch()
  28. page = await newEnglishPage(browser)
  29. tripwire = watchConsole(page)
  30. await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
  31. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  32. }, 120_000)
  33. afterAll(async () => {
  34. await browser?.close()
  35. await scaffold?.close()
  36. })
  37. it('expands the search and lands focus in the input from one rail click', async () => {
  38. onTestFailed(() => saveFailureShot(page, 'web-e2e-rail-search-expand'))
  39. await page.getByRole('button', { name: 'Collapse sidebar' }).click()
  40. const railSearch = page.getByRole('button', { name: 'Search sessions' })
  41. // The wide chrome stays mounted through the 150ms collapse crossfade; the
  42. // rail control (no aria-expanded) replaces it at settle.
  43. await expect.poll(async () => railSearch.getAttribute('aria-expanded'), { timeout: 10_000 }).toBeNull()
  44. // The one real click under test: it must expand the sidebar AND leave the
  45. // search expanded after its own bubble reaches document.
  46. await railSearch.click()
  47. const wideSearch = page.getByRole('button', { name: 'Search sessions' })
  48. await expect.poll(async () => wideSearch.getAttribute('aria-expanded'), { timeout: 10_000 }).toBe('true')
  49. const input = page.getByPlaceholder('Search sessions...')
  50. await expect.poll(
  51. async () => input.evaluate(el => document.activeElement === el),
  52. { timeout: FOCUS_SETTLE_MS + 10_000 },
  53. ).toBe(true)
  54. // The guard ends with the gesture: a genuine outside click on an empty
  55. // query dismisses the expanded search as before.
  56. await page.getByRole('button', { name: 'New session' }).first().click()
  57. await expect.poll(async () => wideSearch.getAttribute('aria-expanded'), { timeout: 10_000 }).toBe('false')
  58. expect(tripwire.pageErrors).toEqual([])
  59. }, 60_000)
  60. })