workspace-chat.spec.ts 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245
  1. import { test, expect, type Page } from '@playwright/test'
  2. async function login(page: Page) {
  3. await page.goto('/conversations')
  4. await page.getByRole('textbox', { name: '账号', exact: true }).fill('fixture')
  5. await page.getByRole('textbox', { name: '密码', exact: true }).fill('fixture-pass')
  6. await page.getByRole('button', { name: '登录', exact: true }).click()
  7. await expect(page.getByRole('heading', { name: '还没有聊天' })).toBeVisible()
  8. }
  9. async function openCreate(page: Page, name: '新建 Bot' | '新建群聊') {
  10. await page.locator('.desktop-sidebar .sidebar-create-trigger').click()
  11. await page.getByRole('menuitem', { name, exact: true }).click()
  12. }
  13. async function createAgent(page: Page, name: string) {
  14. await openCreate(page, '新建 Bot')
  15. const dialog = page.getByRole('dialog')
  16. await dialog.getByRole('textbox', { name: '名称', exact: true }).fill(name)
  17. await dialog
  18. .getByRole('textbox', { name: '角色提示词与规则', exact: true })
  19. .fill(`你是${name},每次回复给出验收证据。`)
  20. await dialog.getByRole('button', { name: `使用颜色 ${name === '产品经理' ? '#e78531' : '#0ea5c6'}`, exact: true }).click()
  21. await dialog.locator('.mascot-grid--shape button').filter({ hasText: name === '产品经理' ? '圆形' : '小三角' }).first().click()
  22. await dialog.getByRole('button', { name: '保存', exact: true }).click()
  23. await expect(page.getByRole('heading', { name, exact: true })).toBeVisible()
  24. }
  25. test('created roles and editable teams share a durable chat list without plugin calls', async ({
  26. page,
  27. context,
  28. }, testInfo) => {
  29. const pluginCalls: string[] = []
  30. page.on('request', (r) => {
  31. if (r.url().includes('/plugins/yaoyao')) pluginCalls.push(r.url())
  32. })
  33. await page.setViewportSize({ width: 1638, height: 874 })
  34. await login(page)
  35. const rail = page.locator('.desktop-sidebar')
  36. await expect(rail.locator('.sidebar-feature-nav')).toHaveCount(0)
  37. await expect(rail.locator('.sidebar-primary-action')).toHaveCount(0)
  38. await expect(rail).toHaveCSS('width', '300px')
  39. await expect(rail.locator('.sidebar-context__heading')).toHaveCount(0)
  40. await expect(rail.getByRole('checkbox', { name: '显示已归档' })).toHaveCount(0)
  41. const plus = rail.getByRole('button', { name: '新建', exact: true })
  42. const collapse = rail.getByRole('button', { name: '折叠侧边栏', exact: true })
  43. expect((await plus.boundingBox())!.x).toBeGreaterThan((await collapse.boundingBox())!.x)
  44. await collapse.click()
  45. await expect(rail).toHaveClass(/desktop-sidebar--collapsed/)
  46. const logoBox = (await rail.locator('.sidebar-brand').boundingBox())!
  47. const plusBox = (await plus.boundingBox())!
  48. expect(plusBox.y).toBeGreaterThanOrEqual(logoBox.y + logoBox.height)
  49. await plus.click()
  50. await expect(page.getByRole('menu', { name: '新建聊天' }).getByRole('menuitem')).toHaveCount(2)
  51. await page.screenshot({ path: testInfo.outputPath('collapsed-create-menu.png'), fullPage: true })
  52. await page.keyboard.press('Escape')
  53. await rail.getByRole('button', { name: '搜索', exact: true }).click()
  54. await expect(page.getByRole('dialog', { name: '搜索聊天' })).toBeVisible()
  55. await expect(rail).toHaveClass(/desktop-sidebar--collapsed/)
  56. await page.keyboard.press('Escape')
  57. await expect(rail.getByRole('button', { name: '搜索', exact: true })).toBeFocused()
  58. await rail.getByRole('button', { name: '展开侧边栏', exact: true }).click()
  59. await page.goto('/chat')
  60. await expect(rail).toHaveCSS('width', '264px')
  61. await expect(rail.getByRole('button', { name: '聊天', exact: true })).toHaveCount(0)
  62. await rail.getByRole('button', { name: '设置与模式', exact: true }).click()
  63. const settingsMenu = page.getByRole('menu', { name: '设置与模式', exact: true })
  64. await expect(settingsMenu.getByRole('menuitem')).toHaveText(['进入设置', '进入 Bot 模式'])
  65. await page.screenshot({ path: testInfo.outputPath('chat-settings-mode-menu.png') })
  66. await settingsMenu.getByRole('menuitem', { name: '进入设置', exact: true }).click()
  67. await expect(page.getByRole('dialog', { name: '设置中心', exact: true })).toBeVisible()
  68. await page.getByRole('button', { name: '关闭设置中心', exact: true }).click()
  69. await expect(rail.getByRole('button', { name: '设置与模式', exact: true })).toBeFocused()
  70. await rail.getByRole('button', { name: '设置与模式', exact: true }).click()
  71. await settingsMenu.getByRole('menuitem', { name: '进入 Bot 模式', exact: true }).click()
  72. await expect(page).toHaveURL(/\/conversations$/)
  73. await expect(rail).toHaveCSS('width', '300px')
  74. await page.addInitScript(() => { Object.defineProperty(crypto, 'randomUUID', { value: undefined, configurable: true }) })
  75. await page.reload()
  76. await createAgent(page, '产品经理')
  77. await expect(rail.getByText('聊天', { exact: true })).toHaveCount(0)
  78. await expect(rail.getByText('聊天列表', { exact: true })).toHaveCount(0)
  79. await page.getByPlaceholder('输入消息,Enter 发送,Shift + Enter 换行').fill('请说明角色职责')
  80. await page.getByRole('button', { name: '发送消息', exact: true }).click()
  81. await expect(page.locator('.message--assistant')).toContainText('我是产品经理')
  82. for (const colorScheme of ['light', 'dark'] as const) {
  83. await page.emulateMedia({ colorScheme })
  84. for (const selector of ['.message__avatar.agent-avatar', '.desktop-sidebar .sidebar-item__icon--avatar', '.desktop-sidebar .agent-avatar']) {
  85. await expect(page.locator(selector).first()).toHaveCSS('background-color', 'rgba(0, 0, 0, 0)')
  86. await expect(page.locator(selector).first()).toHaveCSS('background-image', 'none')
  87. }
  88. }
  89. await page.emulateMedia({ colorScheme: 'light' })
  90. await expect(page.locator('.message--assistant a').first()).toHaveAttribute(
  91. 'href',
  92. /\/api\/app\/files\/.+\/download/,
  93. )
  94. await page.getByRole('button', {name:'置顶聊天',exact:true}).click()
  95. await expect(page.getByRole('button', {name:'取消置顶',exact:true})).toBeVisible()
  96. const directURL = page.url()
  97. await createAgent(page, '开发工程师')
  98. await expect(page.locator('.message')).toHaveCount(0)
  99. await openCreate(page, '新建群聊')
  100. const dialog = page.getByRole('dialog')
  101. await dialog.getByRole('textbox', { name: '名称', exact: true }).fill('产品开发团队')
  102. await dialog.getByRole('checkbox', { name: '产品经理', exact: true }).check()
  103. await dialog.getByRole('checkbox', { name: '开发工程师', exact: true }).check()
  104. await dialog
  105. .getByRole('combobox', { name: '管理员', exact: true })
  106. .selectOption({ label: '产品经理' })
  107. await dialog.getByRole('button', { name: '保存', exact: true }).click()
  108. await expect(page.getByRole('heading', { name: '产品开发团队', exact: true })).toBeVisible()
  109. await expect(page.locator('.desktop-sidebar .sidebar-item')).toHaveCount(3)
  110. // Every cluster portrait must be the same portrait shown in that member's direct chat.
  111. const groupRow = page.locator('.desktop-sidebar .sidebar-item').filter({ hasText: '产品开发团队' })
  112. await expect(groupRow.locator('.team-avatar__member')).toHaveCount(2)
  113. for (const name of ['产品经理', '开发工程师']) {
  114. const portrait = `.agent-avatar[aria-label="${name} 的头像"]`
  115. const direct = page.locator('.desktop-sidebar .sidebar-item').filter({ hasText: name }).filter({ hasNot: page.locator('.team-avatar') }).locator(portrait)
  116. const member = groupRow.locator(portrait)
  117. await expect(member.locator('stop[offset="0.5"]')).toHaveAttribute('stop-color', await direct.locator('stop[offset="0.5"]').getAttribute('stop-color') || '')
  118. expect(await member.locator('.agent-avatar__body > :first-child').evaluate(el => el.tagName))
  119. .toBe(await direct.locator('.agent-avatar__body > :first-child').evaluate(el => el.tagName))
  120. }
  121. await expect(page.locator('.desktop-sidebar')).not.toContainText('话题')
  122. await expect(page.locator('.desktop-sidebar .sidebar-account-switcher')).not.toContainText(
  123. '通用助手',
  124. )
  125. await page.getByRole('button', { name: '聊天设置', exact: true }).click()
  126. await expect(dialog.getByRole('checkbox', { name: '产品经理', exact: true })).toBeDisabled()
  127. await expect(dialog.getByRole('checkbox', { name: '开发工程师', exact: true })).toBeEnabled()
  128. await dialog.getByRole('button', { name: '取消', exact: true }).click()
  129. await page.getByPlaceholder('输入消息,Enter 发送,Shift + Enter 换行').fill('请@开发工程师给出实现结果')
  130. await page.getByRole('button', { name: '发送消息', exact: true }).click()
  131. await expect(page.locator('.message--assistant')).toHaveCount(3)
  132. await expect(page.locator('.message--assistant').nth(1)).toContainText('我是开发工程师')
  133. await expect(page.locator('.run-status')).toHaveCount(0)
  134. const second = await context.newPage()
  135. await second.goto(page.url())
  136. await expect(second.locator('.message--assistant')).toHaveCount(3)
  137. await page.screenshot({ path: testInfo.outputPath('mixed-chats.png'), fullPage: true })
  138. const groupURL=page.url()
  139. await page.getByRole('button', { name: '聊天设置', exact: true }).click()
  140. await dialog.getByRole('checkbox', { name: '开发工程师', exact: true }).uncheck()
  141. await expect(dialog.getByRole('checkbox', { name: '产品经理', exact: true })).toBeDisabled()
  142. await dialog.getByRole('button', { name: '保存', exact: true }).click()
  143. await expect(groupRow.locator('.team-avatar__member')).toHaveCount(1)
  144. await expect(page.locator('.message--assistant')).toHaveCount(3)
  145. await expect(second.locator('.desktop-sidebar .sidebar-item').filter({ hasText: '产品开发团队' }).locator('.team-avatar__member')).toHaveCount(1)
  146. await page.reload()
  147. await page.getByRole('button', { name: '聊天设置', exact: true }).click()
  148. await expect(dialog.getByRole('checkbox', { name: '开发工程师', exact: true })).not.toBeChecked()
  149. await dialog.getByRole('button', { name: '取消', exact: true }).click()
  150. await createAgent(page, '新成员')
  151. await page.goto(groupURL)
  152. await page.getByRole('button', { name: '聊天设置', exact: true }).click()
  153. await dialog.getByRole('checkbox', { name: '新成员', exact: true }).check()
  154. await dialog.getByRole('checkbox', { name: '产品经理', exact: true }).scrollIntoViewIfNeeded()
  155. await page.screenshot({ path: testInfo.outputPath('member-settings.png'), fullPage: true })
  156. await dialog.getByRole('button', { name: '保存', exact: true }).click()
  157. await expect(groupRow.locator('.team-avatar__member')).toHaveCount(2)
  158. await expect(groupRow.locator('[aria-label="开发工程师 的头像"]')).toHaveCount(0)
  159. await expect(groupRow.locator('[aria-label="新成员 的头像"]')).toHaveCount(1)
  160. await page.getByPlaceholder('输入消息,Enter 发送,Shift + Enter 换行').fill('请@新成员继续')
  161. await page.getByRole('button', { name: '发送消息', exact: true }).click()
  162. await expect(page.locator('.message--assistant')).toHaveCount(6)
  163. await expect(page.locator('.message--assistant').nth(4)).toContainText('我是新成员')
  164. await page.goto('/files')
  165. await page.getByRole('button',{name:'查看来源',exact:true}).first().click()
  166. await expect(page).toHaveURL(groupURL)
  167. await page.getByRole('button', { name: '归档聊天', exact: true }).click()
  168. await expect(page.locator('.desktop-sidebar .sidebar-item')).toHaveCount(3)
  169. await page.locator('.desktop-sidebar .sidebar-search-trigger').click()
  170. const search = page.getByRole('dialog', { name: '搜索聊天', exact: true })
  171. await expect(search).toBeVisible()
  172. await search.getByRole('searchbox', { name: '搜索聊天', exact: true }).fill('产品开发')
  173. await expect(search.getByRole('option')).toHaveCount(0)
  174. await search.getByRole('tab', { name: '已归档', exact: true }).click()
  175. await expect(search.getByRole('searchbox')).toHaveValue('产品开发')
  176. await expect(search.getByRole('option')).toHaveCount(1)
  177. await page.screenshot({ path: testInfo.outputPath('archived-chat-search.png'), fullPage: true })
  178. await search.getByRole('option').click()
  179. await expect(search).not.toBeVisible()
  180. await page.getByRole('button', { name: '恢复聊天', exact: true }).click()
  181. await page.goto(directURL)
  182. await expect(page.locator('.message--assistant')).toHaveCount(1)
  183. await expect(page.locator('.message--assistant')).toContainText('我是产品经理')
  184. await page.goto('/chat')
  185. await expect(page).toHaveURL(/\/chat/)
  186. expect(pluginCalls).toEqual([])
  187. await second.close()
  188. await page.goto('/conversations')
  189. await openCreate(page, '新建群聊')
  190. await expect(dialog.getByRole('button', { name: '信息收集团队', exact: true })).toBeDisabled()
  191. await dialog.getByRole('button', { name: '取消', exact: true }).click()
  192. await createAgent(page, '模板成员四')
  193. await createAgent(page, '模板成员五')
  194. await openCreate(page, '新建群聊')
  195. for (const name of ['信息收集团队', '产品设计团队', '软件开发团队', '文案书写团队', '项目管理团队', '数据分析团队', '会议协作团队', '运维保障团队']) {
  196. await expect(dialog.getByRole('button', { name, exact: true })).toBeEnabled()
  197. }
  198. await page.screenshot({ path: testInfo.outputPath('restored-team-presets.png'), fullPage: true })
  199. await dialog.getByRole('button', { name: '产品设计团队', exact: true }).click()
  200. await expect(dialog.getByRole('textbox', { name: '名称', exact: true })).toHaveValue('产品设计团队')
  201. await dialog.getByRole('combobox', { name: '产品负责人对应的 Agent', exact: true }).selectOption({ label: '产品经理' })
  202. await dialog.getByRole('combobox', { name: '交互设计对应的 Agent', exact: true }).selectOption({ label: '开发工程师' })
  203. const [submitted] = await Promise.all([
  204. page.waitForRequest(r => r.method() === 'POST' && r.url().endsWith('/api/app/conversations')),
  205. dialog.getByRole('button', { name: '保存', exact: true }).click(),
  206. ])
  207. const payload = submitted.postDataJSON()
  208. expect(new Set(payload.memberIds).size).toBe(5)
  209. expect(Object.keys(payload.memberRoles)).toHaveLength(5)
  210. expect(payload.memberRoles[payload.administratorId].name).toBe('产品负责人')
  211. await expect(page.getByRole('heading', { name: '产品设计团队', exact: true })).toBeVisible()
  212. await page.getByRole('button', { name: '聊天设置', exact: true }).click()
  213. await expect(dialog.getByText('产品经理 · 产品负责人', { exact: false })).toBeVisible()
  214. await expect(dialog.getByText('开发工程师 · 交互设计', { exact: false })).toBeVisible()
  215. await dialog.getByRole('button', { name: '取消', exact: true }).click()
  216. await page.getByPlaceholder('输入消息,Enter 发送,Shift + Enter 换行').fill('请汇总设计方案')
  217. await page.getByRole('button', { name: '发送消息', exact: true }).click()
  218. await expect(page.locator('.message--assistant')).toContainText('我是产品经理')
  219. const composer = page.getByPlaceholder('输入消息,Enter 发送,Shift + Enter 换行')
  220. await composer.fill('[hold-workspace] 正在执行的任务')
  221. await page.getByRole('button', { name: '发送消息', exact: true }).click()
  222. await expect(page.getByRole('button', { name: '停止生成', exact: true })).toBeVisible()
  223. await composer.fill('后续排队任务')
  224. await expect(page.getByRole('button', { name: '发送消息', exact: true })).toBeEnabled()
  225. await page.getByRole('button', { name: '发送消息', exact: true }).click()
  226. await expect(page.locator('.message--user').last()).toContainText('后续排队任务')
  227. const detail = await (await page.request.get(new URL(page.url()).pathname.replace('/conversations/', '/api/app/conversations/'))).json()
  228. expect(detail.conversation.queuedMessageCount).toBe(1)
  229. await page.request.post('http://127.0.0.1:19120/__release')
  230. await expect.poll(async () => (await (await page.request.get(`/api/app/conversations/${detail.conversation.id}`)).json()).conversation.activeRunId).toBeUndefined()
  231. await page.setViewportSize({ width: 390, height: 844 })
  232. await page.getByRole('button', { name: '打开导航', exact: true }).click()
  233. const mobile = page.locator('.mobile-drawer')
  234. await expect(mobile.locator('.sidebar-feature-nav')).toHaveCount(0)
  235. await mobile.getByRole('button', { name: '新建', exact: true }).click()
  236. await expect(page.getByRole('menuitem', { name: '新建 Bot', exact: true })).toBeVisible()
  237. await page.keyboard.press('Escape')
  238. await mobile.getByRole('button', { name: '搜索', exact: true }).click()
  239. await expect(page.getByRole('dialog', { name: '搜索聊天' })).toBeVisible()
  240. await expect(page.getByRole('tab', { name: '未归档', exact: true })).toBeVisible()
  241. await page.screenshot({ path: testInfo.outputPath('mobile-chat-search.png'), fullPage: true })
  242. await page.getByRole('button', { name: '关闭搜索', exact: true }).click()
  243. expect(pluginCalls).toEqual([])
  244. })