access-confirmation.e2e.ts 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307
  1. // Web e2e scenario: both current-session permission pickers expose the shipped
  2. // experimental Auto entry and gate it behind the same locale-aware, in-page risk
  3. // confirmation. Full access keeps its existing gate. Zero model calls: the
  4. // scenario boots the shipped Web composition and exercises the real process
  5. // catalog, permission projection, client command path, HTTP RPC, and pushed
  6. // update.
  7. import { fileURLToPath } from 'node:url'
  8. import { join } from 'node:path'
  9. import type { Browser, Page } from 'playwright'
  10. import { chromium } from 'playwright'
  11. import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
  12. import {
  13. assertFixtureInventory, captureStableAria, compareOrRefreshGolden,
  14. launchWebScaffold, watchConsole, webSnapshotMode, type WebScaffold,
  15. } from './scaffold.ts'
  16. import {
  17. ZH_BROWSER_LOCALE, connectFreshWorkspaceZh, saveFailureShot, writeComposerDraft,
  18. } from './support.ts'
  19. import { AUTO_REVIEW_FIXTURE, captureAutoReviewState } from './auto-review-fixture.ts'
  20. const SNAPSHOT_DIR = fileURLToPath(new URL('./expected/access-confirmation', import.meta.url))
  21. const CURRENT_SESSION_PICKER_EXPECTED = join(SNAPSHOT_DIR, 'current-session-picker.expected.md')
  22. const SLASH_PICKER_EXPECTED = join(SNAPSHOT_DIR, 'slash-picker.expected.md')
  23. const AUTO_CONFIRMATION_EXPECTED = join(SNAPSHOT_DIR, 'auto-confirmation.expected.md')
  24. const UI_EXPECTED = join(SNAPSHOT_DIR, 'ui.expected.md')
  25. const MODE = webSnapshotMode()
  26. describe('web e2e: experimental Auto and Full access confirmation', () => {
  27. let scaffold: WebScaffold
  28. let browser: Browser
  29. let page: Page
  30. let tripwire: ReturnType<typeof watchConsole>
  31. beforeAll(async () => {
  32. scaffold = await launchWebScaffold(AUTO_REVIEW_FIXTURE)
  33. // CI uses Playwright's pinned browser. A developer may point this one
  34. // scenario at an installed Chromium when the matching browser download
  35. // is temporarily unavailable.
  36. const executablePath = process.env.DSH_PLAYWRIGHT_EXECUTABLE_PATH
  37. browser = await chromium.launch(executablePath === undefined ? {} : { executablePath })
  38. // Keep the Chinese surface via {@link ZH_BROWSER_LOCALE}: the golden pins
  39. // the actual registered dictionary rather than a test-local translation
  40. // callback.
  41. page = await browser.newPage({ viewport: { width: 1680, height: 1000 }, locale: ZH_BROWSER_LOCALE, colorScheme: 'light' })
  42. tripwire = watchConsole(page)
  43. await page.goto(scaffold.authenticatedUrl, { waitUntil: 'load' })
  44. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  45. await connectFreshWorkspaceZh(page, scaffold.workspaceCwd)
  46. }, 120_000)
  47. afterAll(async () => {
  48. await browser?.close()
  49. await scaffold?.close()
  50. })
  51. it('matches the three confirmed Auto entry states and gates both visible picks', async () => {
  52. onTestFailed(() => saveFailureShot(page, 'web-e2e-auto-review-entry'))
  53. const access = page.locator('button[aria-label^="访问模式"]').first()
  54. await access.waitFor({ timeout: 10_000 })
  55. expect(await access.getAttribute('aria-label')).toBe('访问模式,当前:工作区内修改')
  56. await access.click()
  57. const currentMenu = page.getByRole('menu')
  58. await currentMenu.waitFor({ timeout: 10_000 })
  59. expect(await currentMenu.getByRole('menuitem').allTextContents())
  60. .toEqual(['仅可查看', '工作区内修改', '完全权限', 'Auto reviewEXP'])
  61. await captureAutoReviewState(page, 'experimental-current-session-picker')
  62. const currentSnapshot = await captureStableAria(page, '[role="menu"]', scaffold.workspaceCwd)
  63. await compareOrRefreshGolden(CURRENT_SESSION_PICKER_EXPECTED, currentSnapshot, MODE)
  64. const currentTriggerBox = await access.boundingBox()
  65. const currentMenuBox = await currentMenu.boundingBox()
  66. expect(currentTriggerBox).not.toBeNull()
  67. expect(currentMenuBox).not.toBeNull()
  68. expect(Math.abs(currentMenuBox!.width - 218)).toBeLessThan(1)
  69. expect(currentMenuBox!.width).toBeGreaterThan(currentTriggerBox!.width)
  70. expect(Math.abs(currentTriggerBox!.y - currentMenuBox!.y - currentMenuBox!.height - 4)).toBeLessThan(1)
  71. await currentMenu.getByRole('menuitem', { name: 'Auto review EXP' }).click()
  72. const autoDialog = page.getByRole('dialog', { name: '确认启用 Auto review(实验)?' })
  73. await autoDialog.waitFor({ timeout: 10_000 })
  74. const autoEnable = autoDialog.getByRole('button', { name: '启用 Auto review' })
  75. expect(await autoEnable.isDisabled()).toBe(true)
  76. expect(await autoDialog.getByText(/不使用沙箱/).count()).toBe(1)
  77. expect(await autoDialog.getByText(/误放行或误拒绝/).count()).toBe(1)
  78. expect(await autoDialog.getByText(/额外 token/).count()).toBe(1)
  79. expect(await autoDialog.evaluate(node => node.parentElement?.parentElement === document.body)).toBe(true)
  80. await captureAutoReviewState(page, 'experimental-confirmation')
  81. const confirmationSnapshot = await captureStableAria(page, '[role="dialog"]', scaffold.workspaceCwd)
  82. await compareOrRefreshGolden(AUTO_CONFIRMATION_EXPECTED, confirmationSnapshot, MODE)
  83. await autoDialog.getByRole('button', { name: '取消' }).click()
  84. await expect.poll(() => autoDialog.count()).toBe(0)
  85. expect(await access.getAttribute('aria-label')).toBe('访问模式,当前:工作区内修改')
  86. const input = page.locator('[data-composer-input]').first()
  87. await writeComposerDraft(page, input, '/permission')
  88. const suggestions = page.getByRole('listbox', { name: '触发候选建议' })
  89. await suggestions.waitFor({ timeout: 10_000 })
  90. await input.press('Escape')
  91. await expect.poll(() => suggestions.count()).toBe(0)
  92. await input.press('Enter')
  93. const slashPicker = page.locator('[aria-label="/permission 选项"]')
  94. await slashPicker.waitFor({ timeout: 10_000 })
  95. const slashRows = slashPicker.getByRole('option')
  96. expect(await slashRows.count()).toBe(4)
  97. expect(await slashPicker.getByRole('option', { name: 'Auto review EXP' }).count()).toBe(1)
  98. await captureAutoReviewState(page, 'experimental-slash-picker')
  99. const slashSnapshot = await captureStableAria(page, '[aria-label="/permission 选项"]', scaffold.workspaceCwd)
  100. await compareOrRefreshGolden(SLASH_PICKER_EXPECTED, slashSnapshot, MODE)
  101. const slashPickerBox = await slashPicker.boundingBox()
  102. const composerBox = await page.locator('[data-composer-card]').first().boundingBox()
  103. expect(slashPickerBox).not.toBeNull()
  104. expect(composerBox).not.toBeNull()
  105. expect(slashPickerBox!.width).toBeGreaterThanOrEqual(220)
  106. expect(composerBox!.width - slashPickerBox!.width).toBeGreaterThan(1)
  107. expect(Math.abs(composerBox!.y - slashPickerBox!.y - slashPickerBox!.height - 4)).toBeLessThan(1)
  108. await slashPicker.getByRole('option', { name: 'Auto review EXP' }).click()
  109. const slashDialog = page.getByRole('dialog', { name: '确认启用 Auto review(实验)?' })
  110. await slashDialog.waitFor({ timeout: 10_000 })
  111. expect(await slashDialog.count()).toBe(1)
  112. expect(await slashPicker.count()).toBe(0)
  113. await slashDialog.getByRole('checkbox', { name: '我已了解这些风险,并愿意继续' }).check()
  114. await slashDialog.getByRole('button', { name: '启用 Auto review' }).click()
  115. await expect.poll(() => access.getAttribute('aria-label'), { timeout: 10_000 })
  116. .toBe('访问模式,当前:Auto review EXP')
  117. expect(await slashDialog.count()).toBe(0)
  118. expect(await input.textContent()).toBe('')
  119. await captureAutoReviewState(page, 'experimental-current-session')
  120. // Leave the shared page in the baseline state for the Full-access
  121. // regression below. An explicitly argued command must not show a second
  122. // confirmation.
  123. await writeComposerDraft(page, input, '/permission workspace-write')
  124. await input.press('Enter')
  125. await expect.poll(() => access.getAttribute('aria-label'), { timeout: 10_000 })
  126. .toBe('访问模式,当前:工作区内修改')
  127. expect(await page.getByRole('dialog').count()).toBe(0)
  128. expect(tripwire.pageErrors).toEqual([])
  129. }, 60_000)
  130. it('requires acknowledgement before the composer picker can enable Full access', async () => {
  131. onTestFailed(() => saveFailureShot(page, 'web-e2e-full-access-confirmation'))
  132. const access = page.locator('button[aria-label^="访问模式"]').first()
  133. await access.waitFor({ timeout: 10_000 })
  134. expect(await access.getAttribute('aria-label')).toBe('访问模式,当前:工作区内修改')
  135. await access.click()
  136. await page.getByRole('menuitem', { name: '完全权限' }).click()
  137. const dialog = page.getByRole('dialog', { name: '确认启用完全权限?' })
  138. await dialog.waitFor({ timeout: 10_000 })
  139. const enable = dialog.getByRole('button', { name: '启用完全权限' })
  140. expect(await enable.isDisabled()).toBe(true)
  141. // The modal is in this page's body (not a native/new window) and escapes
  142. // the sticky composer's stacking context.
  143. expect(await dialog.evaluate(node => node.parentElement?.parentElement === document.body)).toBe(true)
  144. const snapshot = await captureStableAria(page, '[role="dialog"]', scaffold.workspaceCwd)
  145. await compareOrRefreshGolden(UI_EXPECTED, snapshot, MODE)
  146. await dialog.getByRole('checkbox', { name: '我已了解风险,并愿意继续' }).check()
  147. expect(await enable.isEnabled()).toBe(true)
  148. await enable.click()
  149. await expect.poll(() => access.getAttribute('aria-label'), { timeout: 10_000 })
  150. .toBe('访问模式,当前:完全权限')
  151. expect(await dialog.count()).toBe(0)
  152. expect(tripwire.pageErrors).toEqual([])
  153. }, 60_000)
  154. it('keeps all permission names readable with a collapsed narrow trigger', async () => {
  155. await page.setViewportSize({ width: 420, height: 1000 })
  156. const access = page.locator('button[aria-label^="访问模式"]').first()
  157. const composer = page.locator('[data-composer-card]').first()
  158. await expect.poll(async () => (await composer.boundingBox())!.width).toBeLessThanOrEqual(460)
  159. await expect.poll(async () => (await access.boundingBox())!.width).toBeLessThan(60)
  160. await access.click()
  161. const menu = page.getByRole('menu')
  162. await menu.waitFor()
  163. await captureAutoReviewState(page, 'experimental-narrow-menu')
  164. const menuBox = (await menu.boundingBox())!
  165. expect(menuBox.width).toBeGreaterThanOrEqual(218)
  166. expect(menuBox.width).toBeLessThanOrEqual(360)
  167. expect(menuBox.x).toBeGreaterThanOrEqual(0)
  168. expect(menuBox.x + menuBox.width).toBeLessThanOrEqual(420)
  169. for (const name of ['仅可查看', '工作区内修改', '完全权限', 'Auto review']) {
  170. expect(await menu.getByText(name, { exact: true }).evaluate(node => node.scrollWidth <= node.clientWidth)).toBe(true)
  171. }
  172. await page.keyboard.press('Escape')
  173. const input = page.locator('[data-composer-input]').first()
  174. await writeComposerDraft(page, input, '/permission')
  175. await input.press('Escape')
  176. await input.press('Enter')
  177. const slash = page.locator('[aria-label="/permission 选项"]')
  178. await slash.waitFor()
  179. await captureAutoReviewState(page, 'experimental-narrow-slash')
  180. const slashBox = (await slash.boundingBox())!
  181. expect(slashBox.width).toBeGreaterThanOrEqual(220)
  182. expect(slashBox.x).toBeGreaterThanOrEqual(0)
  183. expect(slashBox.x + slashBox.width).toBeLessThanOrEqual(420)
  184. expect(await slash.evaluate(node => getComputedStyle(node).minWidth)).toBe('min(220px, 100%)')
  185. expect(await slash.evaluate(node => getComputedStyle(node).maxWidth)).toBe('100%')
  186. for (const name of ['仅可查看', '工作区内修改', '完全权限', 'Auto review']) {
  187. expect(await slash.getByText(name, { exact: true }).evaluate(node => node.scrollWidth <= node.clientWidth)).toBe(true)
  188. }
  189. await page.keyboard.press('Escape')
  190. expect(tripwire.pageErrors).toEqual([])
  191. })
  192. it('refreshes both pickers through unload and reinstall without restoring Auto', async () => {
  193. await page.setViewportSize({ width: 1680, height: 1000 })
  194. const input = page.locator('[data-composer-input]').first()
  195. const access = page.locator('button[aria-label^="访问模式"]').first()
  196. await writeComposerDraft(page, input, '/permission auto')
  197. await input.press('Enter')
  198. await expect.poll(() => access.getAttribute('aria-label')).toBe('访问模式,当前:Auto review EXP')
  199. expect(await page.getByRole('dialog').count()).toBe(0)
  200. await writeComposerDraft(page, input, '/permission')
  201. await input.press('Escape')
  202. await input.press('Enter')
  203. const slash = page.locator('[aria-label="/permission 选项"]')
  204. await slash.waitFor()
  205. expect(await slash.getByRole('option').count()).toBe(4)
  206. const entry = [...scaffold.ctx.loader.entries()].find(row => row.options.id === 'auto-review')
  207. if (entry === undefined) throw new Error('experimental Auto integration is absent')
  208. await entry.update({ disabled: true })
  209. await scaffold.ctx.loader.await()
  210. await expect.poll(() => access.getAttribute('aria-label')).toBe('访问模式,当前:完全权限')
  211. await expect.poll(() => slash.count()).toBe(0)
  212. expect(await input.textContent()).toBe('/permission')
  213. await input.press('Enter')
  214. await slash.waitFor()
  215. expect(await slash.getByRole('option').count()).toBe(3)
  216. expect(await slash.getByText('Auto review', { exact: true }).count()).toBe(0)
  217. await page.keyboard.press('Escape')
  218. await access.click()
  219. await expect.poll(() => page.getByRole('menuitem').allTextContents())
  220. .toEqual(['仅可查看', '工作区内修改', '完全权限'])
  221. await captureAutoReviewState(page, 'uninstalled-current-session-picker')
  222. await page.keyboard.press('Escape')
  223. await entry.update({ disabled: false })
  224. await scaffold.ctx.loader.await()
  225. await access.click()
  226. await expect.poll(() => page.getByRole('menuitem').allTextContents())
  227. .toEqual(['仅可查看', '工作区内修改', '完全权限', 'Auto reviewEXP'])
  228. expect(await access.getAttribute('aria-label')).toBe('访问模式,当前:完全权限')
  229. await captureAutoReviewState(page, 'reinstalled-current-session-picker')
  230. await page.keyboard.press('Escape')
  231. await writeComposerDraft(page, input, '/permission')
  232. await input.press('Escape')
  233. await input.press('Enter')
  234. await slash.waitFor()
  235. expect(await slash.getByRole('option').count()).toBe(4)
  236. await page.keyboard.press('Escape')
  237. expect(tripwire.pageErrors).toEqual([])
  238. })
  239. it('keeps its snapshot inventory closed', async () => {
  240. expect(tripwire.warnings).toEqual([])
  241. await assertFixtureInventory(SNAPSHOT_DIR, [
  242. 'auto-confirmation.expected.md',
  243. 'current-session-picker.expected.md',
  244. 'slash-picker.expected.md',
  245. 'ui.expected.md',
  246. ])
  247. })
  248. })
  249. describe('web e2e: default permission choices', () => {
  250. let scaffold: WebScaffold
  251. let browser: Browser
  252. let page: Page
  253. beforeAll(async () => {
  254. scaffold = await launchWebScaffold()
  255. browser = await chromium.launch()
  256. page = await browser.newPage({ viewport: { width: 1680, height: 1000 }, locale: ZH_BROWSER_LOCALE, colorScheme: 'light' })
  257. await page.goto(scaffold.authenticatedUrl, { waitUntil: 'load' })
  258. await connectFreshWorkspaceZh(page, scaffold.workspaceCwd)
  259. }, 120_000)
  260. afterAll(async () => {
  261. await browser?.close()
  262. await scaffold?.close()
  263. })
  264. it('offers only the three standard modes in both pickers', async () => {
  265. const access = page.locator('button[aria-label^="访问模式"]').first()
  266. await access.click()
  267. await expect.poll(() => page.getByRole('menuitem').allTextContents())
  268. .toEqual(['仅可查看', '工作区内修改', '完全权限'])
  269. await captureAutoReviewState(page, 'default-current-session-picker')
  270. await page.keyboard.press('Escape')
  271. const input = page.locator('[data-composer-input]').first()
  272. await writeComposerDraft(page, input, '/permission')
  273. await input.press('Escape')
  274. await input.press('Enter')
  275. const slash = page.locator('[aria-label="/permission 选项"]')
  276. await slash.waitFor()
  277. expect(await slash.getByRole('option').count()).toBe(3)
  278. expect(await slash.getByText('Auto review', { exact: true }).count()).toBe(0)
  279. await captureAutoReviewState(page, 'default-slash-picker')
  280. })
  281. })