workspace-chat.spec.ts 15 KB

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