plugin-manager.e2e.ts 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206
  1. // Web e2e scenario: the plugin manager page behind the sidebar's Plugins entry over a scaffold
  2. // profile runtime: installed packages and bundle enablement. Zero model calls: everything is
  3. // client state plus the profile files and the settings document, so there is
  4. // no fixture and a stray stream would fail loud on the open llm seam.
  5. import { readFile } from 'node:fs/promises'
  6. import { fileURLToPath } from 'node:url'
  7. import type { Browser, Page } from 'playwright'
  8. import { chromium } from 'playwright'
  9. import { afterAll, beforeAll, describe, expect, it, onTestFailed } from 'vitest'
  10. import { join } from 'node:path'
  11. import {
  12. assertFixtureInventory, captureStableAria, compareOrRefreshGolden,
  13. launchWebScaffold, watchConsole, webSnapshotMode, type WebScaffold,
  14. } from './scaffold.ts'
  15. import { ZH_BROWSER_LOCALE, saveFailureShot } from './support.ts'
  16. const SNAPSHOT_DIR = fileURLToPath(new URL('./expected/plugin-manager', import.meta.url))
  17. const MANAGER_EXPECTED = join(SNAPSHOT_DIR, 'manager.expected.md')
  18. const LIVE_EXPECTED = join(SNAPSHOT_DIR, 'live-enabled.expected.md')
  19. const FIXTURE_PLUGINS = fileURLToPath(new URL('./fixtures/plugins', import.meta.url))
  20. const MODE = webSnapshotMode()
  21. describe('web e2e: plugin manager', () => {
  22. let scaffold: WebScaffold
  23. let browser: Browser
  24. let page: Page
  25. let tripwire: ReturnType<typeof watchConsole>
  26. beforeAll(async () => {
  27. scaffold = await launchWebScaffold({
  28. profileRuntime: {
  29. packages: [
  30. { dir: join(FIXTURE_PLUGINS, 'fixture-bundle') },
  31. { dir: join(FIXTURE_PLUGINS, 'fixture-plain-plugin') },
  32. ],
  33. },
  34. })
  35. browser = await chromium.launch()
  36. page = await browser.newPage({ viewport: { width: 1680, height: 1000 }, locale: ZH_BROWSER_LOCALE })
  37. tripwire = watchConsole(page)
  38. await page.goto(scaffold.authenticatedUrl, { 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. /** Close any open settings dialog, so the sidebar and the main column are clickable. */
  46. async function closeSettings() {
  47. if (await page.getByRole('dialog', { name: '设置' }).count() > 0) {
  48. await page.keyboard.press('Escape')
  49. await expect.poll(() => page.getByRole('dialog', { name: '设置' }).count(), { timeout: 5_000 }).toBe(0)
  50. }
  51. }
  52. /** Select the sidebar's Plugins entry and wait for the management page in the main column. */
  53. async function openPluginsPanel() {
  54. await closeSettings()
  55. await page.getByRole('navigation', { name: '全局面板' }).getByRole('button', { name: '插件', exact: true }).click()
  56. const panel = page.locator('[data-plugin-panel]')
  57. await panel.getByRole('heading', { name: '插件管理' }).waitFor({ timeout: 10_000 })
  58. return panel
  59. }
  60. /** One file under the harness home, or the empty string while it does not exist. */
  61. async function homeFile(...segments: string[]): Promise<string> {
  62. return readFile(join(scaffold.harnessHome, ...segments), 'utf8').catch(() => '')
  63. }
  64. it('lists the profile packages with their switches', async () => {
  65. onTestFailed(() => saveFailureShot(page, 'web-e2e-plugin-manager-list'))
  66. const panel = await openPluginsPanel()
  67. await panel.getByText('示例组合包', { exact: true }).waitFor({ timeout: 20_000 })
  68. // Non-bundle packages remain installed, folded under their own group, and expose their uninstall on the detail page.
  69. expect(await panel.getByText('示例插件', { exact: true }).count()).toBe(0)
  70. const toggle = panel.getByRole('switch', { name: '启用 示例组合包' })
  71. expect(await toggle.getAttribute('aria-checked')).toBe('false')
  72. expect(await panel.getByRole('switch', { name: '启用 示例插件' }).count()).toBe(0)
  73. expect(await panel.getByRole('button', { name: '加入全局' }).count()).toBe(0)
  74. expect(await panel.getByRole('button', { name: '卸载 示例插件' }).count()).toBe(0)
  75. const others = panel.getByRole('button', { name: '非插件包依赖', exact: true })
  76. expect(await others.getAttribute('aria-expanded')).toBe('false')
  77. expect(await panel.getByRole('button', { name: '查看 示例插件' }).count()).toBe(0)
  78. await others.click()
  79. expect(await panel.getByText('示例插件', { exact: true }).count()).toBe(1)
  80. await panel.getByRole('button', { name: '查看 示例插件' }).click()
  81. await panel.getByRole('button', { name: '卸载 示例插件' }).waitFor({ timeout: 5_000 })
  82. await panel.getByText('此包未提供组合包 patch,可通过 Cordis 配置手动加载模块。', { exact: true }).waitFor({ timeout: 5_000 })
  83. await panel.getByRole('button', { name: '返回插件列表' }).click()
  84. await expect.poll(() => panel.getByRole('button', { name: '卸载 示例插件' }).count(), { timeout: 5_000 }).toBe(0)
  85. const snapshot = await captureStableAria(page, '[data-plugin-panel]', scaffold.workspaceCwd)
  86. await compareOrRefreshGolden(MANAGER_EXPECTED, snapshot, MODE)
  87. expect(tripwire.pageErrors).toEqual([])
  88. }, 60_000)
  89. it('checks a spec before installing it and words what the check refused', async () => {
  90. onTestFailed(() => saveFailureShot(page, 'web-e2e-plugin-manager-install'))
  91. const panel = await openPluginsPanel()
  92. await panel.getByRole('button', { name: '添加插件', exact: true }).click()
  93. const dialog = page.getByRole('dialog', { name: '添加插件' })
  94. await dialog.waitFor({ timeout: 10_000 })
  95. const field = dialog.getByRole('textbox', { name: '包名或地址' })
  96. const install = dialog.getByRole('button', { name: '安装', exact: true })
  97. expect(await install.isDisabled()).toBe(true)
  98. // A name the list already shows is refused without asking the Host.
  99. await field.fill('@fixture/bundle')
  100. await install.click()
  101. await dialog.getByRole('alert').waitFor({ timeout: 5_000 })
  102. expect(await dialog.getByRole('alert').textContent()).toBe('该插件已安装')
  103. // A path the Host cannot read as a package is refused with its reason, and the spec stays editable.
  104. await field.fill(join(scaffold.harnessHome, 'no-such-plugin'))
  105. await install.click()
  106. await expect.poll(() => dialog.getByRole('alert').textContent(), { timeout: 10_000 }).toBe('该路径不存在或不是有效的插件包')
  107. expect(await field.isDisabled()).toBe(false)
  108. // A name the registry would refuse never reaches it.
  109. await field.fill('Not A Package')
  110. await install.click()
  111. await expect.poll(() => dialog.getByRole('alert').textContent(), { timeout: 10_000 }).toContain('无法识别这个包名或地址')
  112. await dialog.getByRole('button', { name: '关闭' }).click()
  113. await expect.poll(() => page.getByRole('dialog', { name: '添加插件' }).count(), { timeout: 5_000 }).toBe(0)
  114. expect(tripwire.pageErrors).toEqual([])
  115. }, 60_000)
  116. it('enables a bundle into the profile manifest and reports the restart it waits for', async () => {
  117. onTestFailed(() => saveFailureShot(page, 'web-e2e-plugin-manager-enable'))
  118. const panel = await openPluginsPanel()
  119. const toggle = panel.getByRole('switch', { name: '启用 示例组合包' })
  120. await toggle.waitFor({ timeout: 20_000 })
  121. await toggle.click()
  122. await expect.poll(async () => (await homeFile('profiles', 'scaffold', 'package.json')).includes('"@fixture/bundle"'), {
  123. timeout: 10_000,
  124. }).toBe(true)
  125. const manifest = JSON.parse(await homeFile('profiles', 'scaffold', 'package.json')) as {
  126. dsh: { profile: { bundles: string[] } }
  127. }
  128. expect(manifest.dsh.profile.bundles).toEqual(['@fixture/bundle'])
  129. // A startup-applied profile: the switch is on, and the banner names the package.
  130. await expect.poll(() => toggle.getAttribute('aria-checked'), { timeout: 10_000 }).toBe('true')
  131. await panel.getByText('以下更改会在下次启动生效:示例组合包').waitFor({ timeout: 10_000 })
  132. expect(await panel.getByText('需重启', { exact: true }).count()).toBe(1)
  133. // The pack's page lists its rows from its static declarations. A profile that applies
  134. // patches at its next start keeps them read-only: no row switch.
  135. await panel.getByRole('button', { name: '查看 示例组合包' }).click()
  136. await panel.locator('[data-plugin-row]', { hasText: 'fixture-row' }).waitFor({ timeout: 10_000 })
  137. expect(await panel.getByRole('switch', { name: '启用组件 fixture-row' }).count()).toBe(0)
  138. await panel.getByRole('button', { name: '返回插件列表' }).click()
  139. expect(tripwire.pageErrors).toEqual([])
  140. }, 60_000)
  141. it.skipIf(MODE === 'record')('keeps the fixture inventory closed', async () => {
  142. expect(tripwire.warnings).toEqual([])
  143. await assertFixtureInventory(SNAPSHOT_DIR, ['manager.expected.md', 'live-enabled.expected.md'])
  144. })
  145. })
  146. describe('web e2e: live plugin management', () => {
  147. it('applies bundle enable and disable through the Remote without a restart', async () => {
  148. const scaffold = await launchWebScaffold({
  149. profileRuntime: { patchReload: 'live', packages: [{ dir: join(FIXTURE_PLUGINS, 'fixture-bundle') }] },
  150. })
  151. let browser: Browser | undefined
  152. try {
  153. browser = await chromium.launch()
  154. const page = await browser.newPage({ viewport: { width: 1680, height: 1000 }, locale: ZH_BROWSER_LOCALE })
  155. const tripwire = watchConsole(page)
  156. onTestFailed(() => saveFailureShot(page, 'web-e2e-plugin-manager-live'))
  157. await page.goto(scaffold.authenticatedUrl, { waitUntil: 'load' })
  158. await page.getByRole('navigation', { name: '全局面板' }).getByRole('button', { name: '插件', exact: true }).click()
  159. const panel = page.locator('[data-plugin-panel]')
  160. const toggle = panel.getByRole('switch', { name: '启用 示例组合包' })
  161. await toggle.waitFor({ timeout: 20_000 })
  162. const mounted = () => [...scaffold.ctx.loader.entries()].find(entry => entry.options.id === 'fixture-row')
  163. const bundles = async () => {
  164. const text = await readFile(join(scaffold.harnessHome, 'profiles', 'scaffold', 'package.json'), 'utf8')
  165. return (JSON.parse(text) as { dsh: { profile: { bundles: string[] } } }).dsh.profile.bundles
  166. }
  167. expect(mounted()).toBeUndefined()
  168. await toggle.click()
  169. await expect.poll(() => mounted()?.fiber?.state, { timeout: 10_000 }).toBe(2)
  170. await expect.poll(bundles).toEqual(['@fixture/bundle'])
  171. await expect.poll(() => toggle.getAttribute('aria-checked')).toBe('true')
  172. expect(await panel.getByText('需重启', { exact: true }).count()).toBe(0)
  173. expect(await panel.getByText(/以下更改会在下次启动生效/).count()).toBe(0)
  174. const snapshot = await captureStableAria(page, '[data-plugin-panel]', scaffold.workspaceCwd)
  175. await compareOrRefreshGolden(LIVE_EXPECTED, snapshot, MODE)
  176. await toggle.click()
  177. await expect.poll(mounted, { timeout: 10_000 }).toBeUndefined()
  178. await expect.poll(bundles).toEqual([])
  179. await expect.poll(() => toggle.getAttribute('aria-checked')).toBe('false')
  180. expect(await panel.getByText('需重启', { exact: true }).count()).toBe(0)
  181. expect(await panel.getByText(/以下更改会在下次启动生效/).count()).toBe(0)
  182. expect(tripwire.pageErrors).toEqual([])
  183. } finally {
  184. await browser?.close()
  185. await scaffold.close()
  186. }
  187. }, 60_000)
  188. })