settings-chrome.e2e.ts 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459
  1. // Web e2e scenarios: the settings surface — the modal shell (trigger, nav,
  2. // section switching, both close paths), the Appearance preference row (the
  3. // real theme gesture — click 深色 and the whole cascade runs: ThemeService preference -> Host settings
  4. // -> theme/change -> ui-layout's presenter -> body attribute -> alias token +
  5. // browser theme-color metadata)
  6. // the Language row and busy-state Enter preference (both Host-backed), plus
  7. // Permission as the persisted default for subsequently created sessions.
  8. // Zero model calls: everything is pure client + persistence state on a blank
  9. // frame, so there is no fixture and a stray stream would fail loud on the
  10. // open llm seam.
  11. import { readFile } from 'node:fs/promises'
  12. import { fileURLToPath } from 'node:url'
  13. import type { Browser, Page } from 'playwright'
  14. import { chromium } from 'playwright'
  15. import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
  16. import { join } from 'node:path'
  17. import { SessionId } from '@deepseek-ai/dsh-session'
  18. import {
  19. acknowledgeReloadConnectionLoss, assertFixtureInventory, captureStableAria, compareOrRefreshGolden,
  20. launchWebScaffold, watchConsole, webSnapshotMode, type WebScaffold,
  21. } from './scaffold.ts'
  22. import { ZH_BROWSER_LOCALE, saveFailureShot } from './support.ts'
  23. const SNAPSHOT_DIR = fileURLToPath(new URL('./snapshots/settings-chrome', import.meta.url))
  24. const DIALOG_EXPECTED = join(SNAPSHOT_DIR, 'dialog.expected.md')
  25. const MODE = webSnapshotMode()
  26. describe('web e2e: settings modal and General preferences', () => {
  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({})
  33. browser = await chromium.launch()
  34. // Chinese browser: the shared page asserts the localized settings surface
  35. // the client derives from it (the English default has its own spec below).
  36. page = await browser.newPage({ viewport: { width: 1680, height: 1000 }, locale: ZH_BROWSER_LOCALE })
  37. tripwire = watchConsole(page)
  38. await page.goto(scaffold.baseUrl, { waitUntil: 'load' })
  39. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  40. }, 120_000)
  41. afterAll(async () => {
  42. await browser?.close()
  43. await scaffold?.close()
  44. })
  45. it('opens the settings dialog, switches sections, and closes by every path', async () => {
  46. onTestFailed(() => saveFailureShot(page, 'web-e2e-settings-shell'))
  47. const trigger = page.getByRole('button', { name: '设置', exact: true })
  48. expect(await trigger.getAttribute('aria-haspopup')).toBe('dialog')
  49. expect(await trigger.getAttribute('aria-expanded')).toBe('false')
  50. await trigger.click()
  51. const dialog = page.getByRole('dialog', { name: '设置' })
  52. await dialog.waitFor({ timeout: 10_000 })
  53. expect(await trigger.getAttribute('aria-expanded')).toBe('true')
  54. // General is active by default; Permission, Language and Appearance are functional.
  55. expect(await dialog.getByRole('button', { name: '通用设置' }).getAttribute('aria-current')).toBe('true')
  56. await dialog.getByRole('button', { name: 'Workspace Write' }).waitFor({ timeout: 10_000 })
  57. await expect.poll(() => dialog.getByText('语言', { exact: true }).count(), { timeout: 5_000 }).toBe(1)
  58. await expect.poll(() => dialog.getByText('外观', { exact: true }).count(), { timeout: 5_000 }).toBe(1)
  59. const openDocument = dialog.getByRole('button', { name: '打开配置文件' })
  60. await openDocument.waitFor({ timeout: 10_000 })
  61. let openRequests = 0
  62. await page.route('**/api/settings.openDocument', async (route) => {
  63. const envelope = route.request().postDataJSON() as {
  64. rpcId: string
  65. payload: Record<string, never>
  66. }
  67. expect(envelope.payload).toEqual({})
  68. openRequests += 1
  69. await route.fulfill({
  70. status: 200,
  71. contentType: 'application/json',
  72. body: JSON.stringify({
  73. type: 'server-response',
  74. rpcId: envelope.rpcId,
  75. result: { ok: true, value: { opened: true } },
  76. }),
  77. })
  78. })
  79. await openDocument.click()
  80. await expect.poll(() => openRequests, { timeout: 5_000 }).toBe(1)
  81. await expect.poll(() => openDocument.isEnabled(), { timeout: 5_000 }).toBe(true)
  82. await page.unroute('**/api/settings.openDocument')
  83. // Golden of the freshly opened dialog (default zh, General active).
  84. const snapshot = await captureStableAria(page, '[role="dialog"]', scaffold.workspaceCwd)
  85. await compareOrRefreshGolden(DIALOG_EXPECTED, snapshot, MODE)
  86. // Section switch: aria-current moves (the Models page itself has its own scenario file).
  87. await dialog.getByRole('button', { name: '模型' }).click()
  88. await expect.poll(() => dialog.getByRole('button', { name: '模型' }).getAttribute('aria-current'), { timeout: 5_000 }).toBe('true')
  89. expect(await dialog.getByRole('button', { name: '通用设置' }).getAttribute('aria-current')).toBeNull()
  90. // Close path 1: Escape.
  91. await page.keyboard.press('Escape')
  92. await expect.poll(() => page.getByRole('dialog', { name: '设置' }).count(), { timeout: 5_000 }).toBe(0)
  93. expect(await trigger.getAttribute('aria-expanded')).toBe('false')
  94. // Close path 2: the header close button (focus lands there on open).
  95. await trigger.click()
  96. await page.getByRole('dialog', { name: '设置' }).getByRole('button', { name: '关闭' }).click()
  97. await expect.poll(() => page.getByRole('dialog', { name: '设置' }).count(), { timeout: 5_000 }).toBe(0)
  98. expect(tripwire.pageErrors).toEqual([])
  99. }, 60_000)
  100. it('stores Permission as the default for future sessions without changing an existing session', async () => {
  101. onTestFailed(() => saveFailureShot(page, 'web-e2e-settings-permission'))
  102. const existing = scaffold.ctx.sessions.create(SessionId('settings-permission-before'))
  103. expect(existing.events.find(event => event.type === 'permission/preset')?.data)
  104. .toEqual({ preset: 'workspace-write' })
  105. await page.getByRole('button', { name: '设置', exact: true }).click()
  106. const dialog = page.getByRole('dialog', { name: '设置' })
  107. await dialog.waitFor({ timeout: 10_000 })
  108. const selector = dialog.getByRole('button', { name: 'Workspace Write' })
  109. await selector.waitFor({ timeout: 10_000 })
  110. await expect.poll(() => selector.isEnabled(), { timeout: 5_000 }).toBe(true)
  111. await selector.click()
  112. await page.getByRole('menuitem', { name: 'Read Only' }).click()
  113. await dialog.getByRole('button', { name: 'Read Only' }).waitFor({ timeout: 10_000 })
  114. const document = await readFile(join(scaffold.harnessHome, 'settings.yaml'), 'utf8')
  115. expect(document).toContain('permission:')
  116. expect(document).toContain('defaultPreset: read-only')
  117. expect(existing.events.find(event => event.type === 'permission/preset')?.data)
  118. .toEqual({ preset: 'workspace-write' })
  119. const created = scaffold.ctx.sessions.create(SessionId('settings-permission-after'))
  120. expect(created.events.map(event => [event.type, event.data])).toEqual([
  121. ['permission/preset', { preset: 'read-only' }],
  122. ['sandbox/mode', { mode: 'read-only' }],
  123. ['approval/policy', { policy: 'ask' }],
  124. ])
  125. await dialog.getByRole('button', { name: 'Read Only' }).click()
  126. await page.getByRole('menuitem', { name: 'Full access' }).click()
  127. const confirmation = page.getByRole('dialog', { name: '确认启用 Full access?' })
  128. const enable = confirmation.getByRole('button', { name: '启用 Full access' })
  129. expect(await enable.isDisabled()).toBe(true)
  130. await confirmation.getByRole('checkbox').click()
  131. await enable.click()
  132. await dialog.getByRole('button', { name: 'Full access' }).waitFor({ timeout: 10_000 })
  133. const confirmedDocument = await readFile(join(scaffold.harnessHome, 'settings.yaml'), 'utf8')
  134. expect(confirmedDocument).toContain('defaultPreset: danger-full-access')
  135. const confirmed = scaffold.ctx.sessions.create(SessionId('settings-permission-confirmed'))
  136. expect(confirmed.events.map(event => [event.type, event.data])).toEqual([
  137. ['permission/preset', { preset: 'danger-full-access' }],
  138. ['sandbox/mode', { mode: 'danger-full-access' }],
  139. ['approval/policy', { policy: 'never' }],
  140. ])
  141. await page.keyboard.press('Escape')
  142. expect(tripwire.pageErrors).toEqual([])
  143. }, 60_000)
  144. it('uses the persisted dark preference while plugins are still loading', async () => {
  145. onTestFailed(() => saveFailureShot(page, 'web-e2e-settings-boot-theme'))
  146. await page.emulateMedia({ colorScheme: 'light' })
  147. await page.getByRole('button', { name: '设置', exact: true }).click()
  148. const initialDialog = page.getByRole('dialog', { name: '设置' })
  149. const darkCube = initialDialog.getByRole('button', { name: '深色' })
  150. await darkCube.click()
  151. await expect.poll(() => darkCube.getAttribute('aria-pressed'), { timeout: 5_000 }).toBe('true')
  152. await expect.poll(async () => readFile(join(scaffold.harnessHome, 'settings.yaml'), 'utf8'), { timeout: 5_000 })
  153. .toMatch(/ui-theme:\n\s+preference: dark/)
  154. await page.keyboard.press('Escape')
  155. // Hold real plugin bundles so the shell-owned loading page remains observable.
  156. const pluginPattern = '**/plugins/**'
  157. let releaseBundles = (): void => {}
  158. const bundlesReleased = new Promise<void>((resolve) => { releaseBundles = resolve })
  159. await page.route(pluginPattern, async (route) => {
  160. await bundlesReleased
  161. await route.continue()
  162. })
  163. const warningStart = tripwire.warnings.length
  164. let reload: ReturnType<Page['reload']> | undefined
  165. try {
  166. reload = page.reload({ waitUntil: 'domcontentloaded' })
  167. const loading = page.getByText('Loading plugins…', { exact: true })
  168. await loading.waitFor({ timeout: 10_000 })
  169. const state = await loading.evaluate((element) => {
  170. const boot = element.parentElement?.parentElement
  171. if (boot === undefined || boot === null) throw new Error('loading hint is detached from the boot page')
  172. return {
  173. attr: document.body.hasAttribute('data-ds-dark-theme'),
  174. background: getComputedStyle(boot).backgroundColor,
  175. colorScheme: document.documentElement.style.colorScheme,
  176. }
  177. })
  178. expect(state).toEqual({
  179. attr: true,
  180. background: 'rgb(21, 21, 23)',
  181. colorScheme: 'dark',
  182. })
  183. } finally {
  184. releaseBundles()
  185. await reload
  186. await page.unroute(pluginPattern)
  187. }
  188. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  189. acknowledgeReloadConnectionLoss(tripwire, warningStart)
  190. await page.getByRole('button', { name: '设置', exact: true }).click()
  191. const restoredDialog = page.getByRole('dialog', { name: '设置' })
  192. const systemCube = restoredDialog.getByRole('button', { name: '跟随系统' })
  193. await systemCube.click()
  194. await expect.poll(() => systemCube.getAttribute('aria-pressed'), { timeout: 5_000 }).toBe('true')
  195. await expect.poll(() => page.evaluate(() => document.body.hasAttribute('data-ds-dark-theme')), {
  196. timeout: 5_000,
  197. }).toBe(false)
  198. await page.keyboard.press('Escape')
  199. expect(tripwire.pageErrors).toEqual([])
  200. }, 90_000)
  201. it('flips the theme through the Appearance cubes and persists across reload and a distinct port', async () => {
  202. onTestFailed(() => saveFailureShot(page, 'web-e2e-settings-appearance'))
  203. interface ThemeState {
  204. attr: boolean
  205. background: string
  206. /** Pre-migration localStorage key; the Host-backed world never writes it. */
  207. legacy: string | null
  208. themeColor: string | null
  209. themeColorCount: number
  210. token: string
  211. }
  212. const readState = async (target: Page = page): Promise<ThemeState> => await target.evaluate(() => {
  213. const metas = document.head.querySelectorAll<HTMLMetaElement>('meta[name="theme-color"]')
  214. const computed = getComputedStyle(document.body)
  215. return {
  216. attr: document.body.hasAttribute('data-ds-dark-theme'),
  217. background: computed.backgroundColor,
  218. legacy: localStorage.getItem('dsh.theme'),
  219. themeColor: metas[0]?.content ?? null,
  220. themeColorCount: metas.length,
  221. token: computed.getPropertyValue('--dsw-alias-bg-base').trim(),
  222. }
  223. })
  224. const expectThemeColorSynchronized = (state: ThemeState): void => {
  225. expect(state.themeColorCount).toBe(1)
  226. expect(state.background).not.toBe('rgba(0, 0, 0, 0)')
  227. expect(state.themeColor).toBe(state.background)
  228. }
  229. // Pin the OS scheme to light so the default `system` preference resolves
  230. // light and the dark flip below is unambiguously the gesture's doing.
  231. await page.emulateMedia({ colorScheme: 'light' })
  232. const light = await readState()
  233. expect(light.attr).toBe(false)
  234. expectThemeColorSynchronized(light)
  235. await page.getByRole('button', { name: '设置', exact: true }).click()
  236. const dialog = page.getByRole('dialog', { name: '设置' })
  237. await dialog.waitFor({ timeout: 10_000 })
  238. const darkCube = dialog.getByRole('button', { name: '深色' })
  239. expect(await darkCube.getAttribute('aria-pressed')).toBe('false')
  240. await darkCube.click()
  241. // The full cascade: pressed state, Host-backed preference, body attribute,
  242. // alias token flip — all from one real user gesture.
  243. await expect.poll(() => darkCube.getAttribute('aria-pressed'), { timeout: 5_000 }).toBe('true')
  244. const dark = await readState()
  245. expect(dark.attr).toBe(true)
  246. expect(dark.legacy).toBeNull()
  247. expect(dark.token).not.toBe(light.token)
  248. expectThemeColorSynchronized(dark)
  249. await expect.poll(async () => readFile(join(scaffold.harnessHome, 'settings.yaml'), 'utf8'), { timeout: 5_000 })
  250. .toMatch(/ui-theme:\n\s+preference: dark/)
  251. await page.keyboard.press('Escape')
  252. // Reload: the preference survives the background Host read + presenter update.
  253. const warningStart = tripwire.warnings.length
  254. await page.reload({ waitUntil: 'load' })
  255. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  256. acknowledgeReloadConnectionLoss(tripwire, warningStart)
  257. await page.emulateMedia({ colorScheme: 'light' })
  258. await expect.poll(async () => (await readState()).attr, { timeout: 5_000 }).toBe(true)
  259. const reloaded = await readState()
  260. expect(reloaded.legacy).toBeNull()
  261. expectThemeColorSynchronized(reloaded)
  262. // A second live Host binds another ephemeral port but shares the same
  263. // user-settings home. Its fresh origin has no theme localStorage and still
  264. // converges to dark before the settings dialog opens.
  265. const second = await launchWebScaffold({ harnessHome: scaffold.harnessHome })
  266. const secondPage = await browser.newPage({ viewport: { width: 1680, height: 1000 }, locale: ZH_BROWSER_LOCALE })
  267. const secondTripwire = watchConsole(secondPage)
  268. try {
  269. expect(second.baseUrl).not.toBe(scaffold.baseUrl)
  270. await secondPage.emulateMedia({ colorScheme: 'light' })
  271. await secondPage.goto(second.baseUrl, { waitUntil: 'load' })
  272. await secondPage.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  273. await expect.poll(async () => (await readState(secondPage)).attr, { timeout: 5_000 }).toBe(true)
  274. const secondState = await readState(secondPage)
  275. expect(secondState.legacy).toBeNull()
  276. expectThemeColorSynchronized(secondState)
  277. expect(secondTripwire.pageErrors).toEqual([])
  278. expect(secondTripwire.warnings).toEqual([])
  279. } finally {
  280. await secondPage.close()
  281. await second.close()
  282. }
  283. // `system` follows the emulated OS scheme (dark stays dark, light clears).
  284. await page.getByRole('button', { name: '设置', exact: true }).click()
  285. const systemCube = page.getByRole('dialog', { name: '设置' }).getByRole('button', { name: '跟随系统' })
  286. await systemCube.click()
  287. await expect.poll(() => systemCube.getAttribute('aria-pressed'), { timeout: 5_000 }).toBe('true')
  288. await expect.poll(async () => (await readState()).attr, { timeout: 5_000 }).toBe(false)
  289. expectThemeColorSynchronized(await readState())
  290. await page.emulateMedia({ colorScheme: 'dark' })
  291. await expect.poll(async () => (await readState()).attr, { timeout: 5_000 }).toBe(true)
  292. expectThemeColorSynchronized(await readState())
  293. // Restore for the specs that follow: light preference beats the emulated
  294. // dark OS scheme, leaving the shared page in the light default.
  295. await page.getByRole('dialog', { name: '设置' }).getByRole('button', { name: '浅色' }).click()
  296. await expect.poll(async () => (await readState()).attr, { timeout: 5_000 }).toBe(false)
  297. expectThemeColorSynchronized(await readState())
  298. await page.keyboard.press('Escape')
  299. expect(tripwire.pageErrors).toEqual([])
  300. }, 90_000)
  301. it('persists the busy-state Enter behavior across reload and a distinct port', async () => {
  302. onTestFailed(() => saveFailureShot(page, 'web-e2e-settings-enter-behavior'))
  303. await page.getByRole('button', { name: '设置', exact: true }).click()
  304. const dialog = page.getByRole('dialog', { name: '设置' })
  305. await dialog.waitFor({ timeout: 10_000 })
  306. await dialog.getByRole('button', { name: '排队发送' }).click()
  307. await page.getByRole('menuitem', { name: '插话发送' }).click()
  308. await dialog.getByRole('button', { name: '插话发送' }).waitFor({ timeout: 10_000 })
  309. expect(await page.evaluate(() => localStorage.getItem('dsh.conversation.busyEnter'))).toBeNull()
  310. await expect.poll(async () => readFile(join(scaffold.harnessHome, 'settings.yaml'), 'utf8'), { timeout: 5_000 })
  311. .toMatch(/ui-conversation:\n\s+busyEnter: steer/)
  312. await page.keyboard.press('Escape')
  313. const warningStart = tripwire.warnings.length
  314. await page.reload({ waitUntil: 'load' })
  315. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  316. acknowledgeReloadConnectionLoss(tripwire, warningStart)
  317. await page.getByRole('button', { name: '设置', exact: true }).click()
  318. const reloaded = page.getByRole('dialog', { name: '设置' })
  319. await reloaded.getByRole('button', { name: '插话发送' }).waitFor({ timeout: 10_000 })
  320. const second = await launchWebScaffold({ harnessHome: scaffold.harnessHome })
  321. const secondPage = await browser.newPage({ viewport: { width: 1680, height: 1000 }, locale: ZH_BROWSER_LOCALE })
  322. const secondTripwire = watchConsole(secondPage)
  323. try {
  324. expect(second.baseUrl).not.toBe(scaffold.baseUrl)
  325. await secondPage.goto(second.baseUrl, { waitUntil: 'load' })
  326. await secondPage.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  327. await secondPage.getByRole('button', { name: '设置', exact: true }).click()
  328. await secondPage.getByRole('dialog', { name: '设置' })
  329. .getByRole('button', { name: '插话发送' }).waitFor({ timeout: 10_000 })
  330. expect(await secondPage.evaluate(() => localStorage.getItem('dsh.conversation.busyEnter'))).toBeNull()
  331. expect(secondTripwire.pageErrors).toEqual([])
  332. expect(secondTripwire.warnings).toEqual([])
  333. } finally {
  334. await secondPage.close()
  335. await second.close()
  336. }
  337. await reloaded.getByRole('button', { name: '插话发送' }).click()
  338. await page.getByRole('menuitem', { name: '排队发送' }).click()
  339. await reloaded.getByRole('button', { name: '排队发送' }).waitFor({ timeout: 10_000 })
  340. expect(await page.evaluate(() => localStorage.getItem('dsh.conversation.busyEnter'))).toBeNull()
  341. await expect.poll(async () => readFile(join(scaffold.harnessHome, 'settings.yaml'), 'utf8'), { timeout: 5_000 })
  342. .toMatch(/ui-conversation:\n\s+busyEnter: queue/)
  343. await page.keyboard.press('Escape')
  344. expect(tripwire.pageErrors).toEqual([])
  345. }, 90_000)
  346. it('persists the settings language across reload and a distinct port', async () => {
  347. onTestFailed(() => saveFailureShot(page, 'web-e2e-settings-language'))
  348. await page.getByRole('button', { name: '设置', exact: true }).click()
  349. const zhDialog = page.getByRole('dialog', { name: '设置' })
  350. await zhDialog.waitFor({ timeout: 10_000 })
  351. // The Language selector pill shows the active locale's own name.
  352. const selector = zhDialog.getByRole('button', { name: '中文' })
  353. expect(await selector.getAttribute('aria-haspopup')).toBe('menu')
  354. await selector.click()
  355. await page.getByRole('menuitem', { name: 'English' }).click()
  356. // The settings-owned copy re-registers localized: dialog title, nav,
  357. // Appearance labels. (Only the settings namespaces are localized —
  358. // the rest of the app's copy is intentionally out of this row's scope.)
  359. const enDialog = page.getByRole('dialog', { name: 'Settings' })
  360. await enDialog.waitFor({ timeout: 10_000 })
  361. expect(await enDialog.getByRole('button', { name: 'General' }).getAttribute('aria-current')).toBe('true')
  362. await expect.poll(() => enDialog.getByText('Appearance', { exact: true }).count(), { timeout: 5_000 }).toBe(1)
  363. expect(await page.evaluate(() => localStorage.getItem('dsh.locale'))).toBeNull()
  364. await expect.poll(async () => readFile(join(scaffold.harnessHome, 'settings.yaml'), 'utf8'), { timeout: 5_000 })
  365. .toMatch(/locale:\n\s+preference: en/)
  366. // Reload keeps English; then restore zh so shared page state (and the
  367. // other specs' 设置-anchored selectors + goldens) see the default again.
  368. const warningStart = tripwire.warnings.length
  369. await page.reload({ waitUntil: 'load' })
  370. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  371. acknowledgeReloadConnectionLoss(tripwire, warningStart)
  372. const enTrigger = page.getByRole('button', { name: 'Settings' })
  373. await enTrigger.waitFor({ timeout: 10_000 })
  374. // A Chinese browser on another port still receives the explicit English
  375. // preference from the shared Host settings document.
  376. const second = await launchWebScaffold({ harnessHome: scaffold.harnessHome })
  377. const secondPage = await browser.newPage({ viewport: { width: 1680, height: 1000 }, locale: ZH_BROWSER_LOCALE })
  378. const secondTripwire = watchConsole(secondPage)
  379. try {
  380. expect(second.baseUrl).not.toBe(scaffold.baseUrl)
  381. await secondPage.goto(second.baseUrl, { waitUntil: 'load' })
  382. await secondPage.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  383. await secondPage.getByRole('button', { name: 'Settings', exact: true }).click()
  384. await secondPage.getByRole('dialog', { name: 'Settings' })
  385. .getByRole('button', { name: 'English' }).waitFor({ timeout: 10_000 })
  386. expect(await secondPage.evaluate(() => localStorage.getItem('dsh.locale'))).toBeNull()
  387. expect(secondTripwire.pageErrors).toEqual([])
  388. expect(secondTripwire.warnings).toEqual([])
  389. } finally {
  390. await secondPage.close()
  391. await second.close()
  392. }
  393. await enTrigger.click()
  394. await page.getByRole('dialog', { name: 'Settings' }).getByRole('button', { name: 'English' }).click()
  395. await page.getByRole('menuitem', { name: '中文' }).click()
  396. await page.getByRole('dialog', { name: '设置' }).waitFor({ timeout: 10_000 })
  397. expect(await page.evaluate(() => localStorage.getItem('dsh.locale'))).toBeNull()
  398. await expect.poll(async () => readFile(join(scaffold.harnessHome, 'settings.yaml'), 'utf8'), { timeout: 5_000 })
  399. .toMatch(/locale:\n\s+preference: zh/)
  400. await page.keyboard.press('Escape')
  401. expect(tripwire.pageErrors).toEqual([])
  402. }, 90_000)
  403. it('opens an English browser in English without any stored preference', async () => {
  404. // A fresh Host home has no locale preference, so its surface follows the
  405. // browser rather than the product fallback.
  406. const fresh = await launchWebScaffold({})
  407. const enPage = await browser.newPage({ viewport: { width: 1680, height: 1000 }, locale: 'en-US' })
  408. const enTripwire = watchConsole(enPage)
  409. onTestFailed(() => saveFailureShot(enPage, 'web-e2e-settings-browser-language'))
  410. try {
  411. await enPage.goto(fresh.baseUrl, { waitUntil: 'load' })
  412. await enPage.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  413. expect(await enPage.evaluate(() => localStorage.getItem('dsh.locale'))).toBeNull()
  414. await enPage.getByRole('button', { name: 'Settings', exact: true }).click()
  415. const dialog = enPage.getByRole('dialog', { name: 'Settings' })
  416. await dialog.waitFor({ timeout: 10_000 })
  417. await dialog.getByRole('button', { name: 'English' }).waitFor({ timeout: 10_000 })
  418. // This page has no closing inventory spec to sweep its console, so the
  419. // scenario clears both tripwire channels itself.
  420. expect(enTripwire.pageErrors).toEqual([])
  421. expect(enTripwire.warnings).toEqual([])
  422. } finally {
  423. await enPage.close()
  424. await fresh.close()
  425. }
  426. }, 90_000)
  427. it.skipIf(MODE === 'record')('keeps the fixture inventory closed', async () => {
  428. expect(tripwire.warnings).toEqual([])
  429. await assertFixtureInventory(SNAPSHOT_DIR, ['dialog.expected.md'])
  430. })
  431. })