onboarding-usable-provider.e2e.ts 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. // Keyless browser e2e: a user who configures some OTHER provider is not asked
  2. // for the official DeepSeek key again, and the first-run setup card is a card
  3. // they can close. The shipped DeepSeek adapter stays mounted without a
  4. // credential throughout, so the only thing that ends onboarding here is the
  5. // pi-ai route the user configures through the real wire. Zero model calls:
  6. // configuration is pure settings/credentials/llm-domain traffic.
  7. import { readFile } from 'node:fs/promises'
  8. import { fileURLToPath } from 'node:url'
  9. import { join } from 'node:path'
  10. import type { Browser, Page } from 'playwright'
  11. import { chromium } from 'playwright'
  12. import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
  13. import {
  14. acknowledgeReloadConnectionLoss, assertFixtureInventory, captureStableAria, compareOrRefreshGolden,
  15. launchWebScaffold, watchConsole, webSnapshotMode, type WebScaffold,
  16. } from './scaffold.ts'
  17. import { ZH_BROWSER_LOCALE, saveFailureShot } from './support.ts'
  18. const SNAPSHOT_DIR = fileURLToPath(new URL('./expected/onboarding-usable-provider', import.meta.url))
  19. const DISMISSED_EXPECTED = join(SNAPSHOT_DIR, 'dismissed.expected.md')
  20. const MODE = webSnapshotMode()
  21. const CREDENTIAL_STEP = '添加一个 API Key 开始使用'
  22. describe.skipIf(MODE === 'record')('web e2e: another usable provider ends first-run onboarding', () => {
  23. let scaffold: WebScaffold
  24. let browser: Browser
  25. let page: Page
  26. let tripwire: ReturnType<typeof watchConsole>
  27. beforeAll(async () => {
  28. scaffold = await launchWebScaffold({ deepSeekMissingCredential: true })
  29. browser = await chromium.launch()
  30. // The scenario asserts the shipped Chinese copy, so the browser asks for it.
  31. page = await browser.newPage({ viewport: { width: 1440, height: 960 }, locale: ZH_BROWSER_LOCALE })
  32. tripwire = watchConsole(page)
  33. await page.goto(scaffold.authenticatedUrl, { waitUntil: 'load' })
  34. await page.waitForSelector('[class*="frame"]', { timeout: 30_000 })
  35. }, 120_000)
  36. afterAll(async () => {
  37. await browser?.close()
  38. await scaffold?.close()
  39. })
  40. it('closes the setup card without discarding the add card beside it', async () => {
  41. onTestFailed(() => saveFailureShot(page, 'web-e2e-onboarding-setup-card-cancel'))
  42. const credentialStep = page.getByRole('dialog', { name: CREDENTIAL_STEP })
  43. await credentialStep.waitFor({ timeout: 15_000 })
  44. await credentialStep.getByRole('button', { name: '稍后配置' }).click()
  45. await credentialStep.waitFor({ state: 'detached', timeout: 15_000 })
  46. await page.getByRole('button', { name: '设置', exact: true }).click()
  47. const settings = page.getByRole('dialog', { name: '设置' })
  48. await settings.waitFor({ timeout: 10_000 })
  49. // Dismissing the onboarding step leaves Settings closed, so enter the
  50. // Models section explicitly before exercising its normal cards.
  51. await settings.getByRole('button', { name: '模型' }).click()
  52. const setupKey = settings.getByRole('textbox', { name: 'API 密钥', exact: true })
  53. await setupKey.waitFor({ timeout: 10_000 })
  54. const add = settings.getByRole('button', { name: '添加提供方' })
  55. await expect.poll(async () => add.isEnabled(), { timeout: 10_000 }).toBe(true)
  56. await add.click()
  57. const pick = settings.getByLabel('提供方')
  58. await pick.waitFor({ timeout: 10_000 })
  59. await pick.selectOption('minimax-cn')
  60. await expect.poll(
  61. async () => settings.getByRole('textbox', { name: 'API 密钥', exact: true }).count(),
  62. { timeout: 10_000 },
  63. ).toBe(2)
  64. // Cancelling the setup card must not close the independent add-provider
  65. // draft beside it.
  66. await settings.getByRole('button', { name: '取消', exact: true }).first().click()
  67. expect(await settings.getByLabel('提供方').count()).toBe(1)
  68. await expect.poll(
  69. async () => settings.getByRole('textbox', { name: 'API 密钥', exact: true }).count(),
  70. { timeout: 10_000 },
  71. ).toBe(1)
  72. await settings.getByRole('button', { name: '编辑 DeepSeek (deepseek-official)' }).waitFor({ timeout: 10_000 })
  73. const dismissed = await captureStableAria(page, '[role="dialog"]', scaffold.workspaceCwd)
  74. await compareOrRefreshGolden(DISMISSED_EXPECTED, dismissed, MODE)
  75. expect(tripwire.warnings).toEqual([])
  76. expect(tripwire.pageErrors).toEqual([])
  77. }, 60_000)
  78. it('stops prompting for DeepSeek once the other provider can serve requests', async () => {
  79. onTestFailed(() => saveFailureShot(page, 'web-e2e-onboarding-other-provider'))
  80. const settings = page.getByRole('dialog', { name: '设置' })
  81. await settings.getByRole('textbox', { name: 'API 密钥', exact: true }).fill('sk-e2e-minimax')
  82. await settings.getByRole('button', { name: '保存', exact: true }).click()
  83. await settings.getByText('已保存 minimax-cn。', { exact: true }).waitFor({ timeout: 15_000 })
  84. // Only minimax-cn is reachable; DeepSeek still holds no credential.
  85. const document = await readFile(join(scaffold.harnessHome, 'settings.yaml'), 'utf8')
  86. expect(document).toContain('apiKeyEnv: MINIMAX_CN_API_KEY')
  87. const credentials = await readFile(join(scaffold.harnessHome, '.credentials.yaml'), 'utf8')
  88. expect(credentials).toContain('MINIMAX_CN_API_KEY: sk-e2e-minimax')
  89. expect(credentials).not.toContain('DEEPSEEK_API_KEY')
  90. const warningsBefore = tripwire.warnings.length
  91. await page.reload({ waitUntil: 'load' })
  92. acknowledgeReloadConnectionLoss(tripwire, warningsBefore)
  93. await page.waitForSelector('[class*="frame"]', { timeout: 15_000 })
  94. // The regression: the step read only the official route's credential, so a
  95. // fully configured user was taken over on every blank session.
  96. await expect.poll(
  97. async () => page.getByRole('dialog', { name: CREDENTIAL_STEP }).count(),
  98. { timeout: 10_000 },
  99. ).toBe(0)
  100. expect(await page.locator('#root').evaluate(root => (root as HTMLElement).inert)).toBe(false)
  101. // The Models page agrees: DeepSeek stays a row rather than reopening its
  102. // setup card over a user who already has somewhere to send a request.
  103. await page.getByRole('button', { name: '设置', exact: true }).click()
  104. await settings.waitFor({ timeout: 10_000 })
  105. await settings.getByRole('button', { name: '模型' }).click()
  106. await settings.getByRole('button', { name: '编辑 DeepSeek (deepseek-official)' }).waitFor({ timeout: 10_000 })
  107. expect(await settings.getByRole('textbox', { name: 'API 密钥', exact: true }).count()).toBe(0)
  108. expect((await page.content()).includes('sk-e2e-minimax')).toBe(false)
  109. expect(tripwire.pageErrors).toEqual([])
  110. }, 60_000)
  111. it('keeps the fixture inventory closed', async () => {
  112. await assertFixtureInventory(SNAPSHOT_DIR, ['dismissed.expected.md'])
  113. })
  114. })