workspace.spec.ts 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253
  1. import { expect, test } from '@playwright/test'
  2. test.beforeEach(async ({ page }) => {
  3. await page.goto('/chat')
  4. if (await page.getByRole('heading', { name: '登录 Hermes' }).isVisible()) {
  5. await page.getByLabel('账号').fill('test')
  6. await page.getByLabel('密码').fill('test')
  7. await page.getByRole('button', { name: '登录' }).click()
  8. }
  9. await expect(page.getByRole('navigation')).toBeVisible()
  10. })
  11. test('navigates every 9119 workspace without blank transitions', async ({ page }) => {
  12. const consoleErrors: string[] = []
  13. page.on('console', message => { if (message.type() === 'error') consoleErrors.push(message.text()) })
  14. await expect(page.getByRole('option').first()).toContainText('夭夭 Web 验收会话')
  15. await expect(page.getByRole('option').first()).toContainText('夭夭')
  16. await expect(page.locator('.desktop-sidebar').getByText('已置顶 1', { exact: true })).toBeVisible()
  17. await page.getByRole('button', { name: '群聊' }).click()
  18. await expect(page.getByRole('heading', { name: '设计与工程协作' })).toBeVisible()
  19. await expect(page.getByRole('button', { name: '对话', exact: true })).toBeVisible()
  20. await expect(page.getByRole('button', { name: '群聊', exact: true })).toHaveCount(0)
  21. await expect(page.getByRole('button', { name: '文件库', exact: true })).toHaveCount(0)
  22. await expect(page.getByRole('button', { name: '产物', exact: true })).toHaveCount(0)
  23. await expect(page.getByRole('button', { name: '新建群聊' })).toBeVisible()
  24. await expect(page.getByRole('button', { name: '管理群聊' })).toBeVisible()
  25. await expect(page.getByRole('button', { name: '发送消息' })).toBeVisible()
  26. await page.goto('/files')
  27. await expect(page.getByRole('heading', { name: '文件库', exact: true }).last()).toBeVisible()
  28. await expect(page.getByText('demo-report.pdf')).toBeVisible()
  29. const firstFileCard = page.locator('.library-grid article').first()
  30. const cardGeometry = await firstFileCard.evaluate(element => {
  31. const card = element.getBoundingClientRect()
  32. const preview = element.querySelector('.library-thumb')?.getBoundingClientRect()
  33. return { width: card.width, previewHeight: preview?.height || 0 }
  34. })
  35. expect(cardGeometry.width).toBeGreaterThanOrEqual(220)
  36. expect(cardGeometry.previewHeight).toBe(154)
  37. await page.getByText('demo-report.pdf').click()
  38. await expect(page.getByRole('dialog', { name: /预览 demo-report.pdf/ })).toBeVisible()
  39. await expect(page.locator('.preview-meta')).toHaveCount(0)
  40. const previewDialog = page.getByRole('dialog', { name: /预览 demo-report.pdf/ })
  41. await expect(previewDialog.getByRole('link', { name: '下载' })).toBeVisible()
  42. await expect(previewDialog.getByRole('button', { name: '加入输入框' })).toBeVisible()
  43. await expect(previewDialog.locator('.preview-close')).toBeVisible()
  44. const modalHeight = await page.locator('.preview-modal').evaluate(element => element.getBoundingClientRect().height)
  45. expect(modalHeight).toBeGreaterThan(600)
  46. await previewDialog.locator('.preview-close').click()
  47. await page.goto('/artifacts')
  48. await expect(page).toHaveURL(/\/chat$/)
  49. await expect(page.getByRole('button', { name: '产物', exact: true })).toHaveCount(0)
  50. expect(consoleErrors).toEqual([])
  51. })
  52. test('keeps pins first and loads the next session page at the list bottom', async ({ page }) => {
  53. const sidebar = page.locator('.desktop-sidebar')
  54. const items = sidebar.locator('.sidebar-list [role="option"]')
  55. await expect(items).toHaveCount(100)
  56. await expect(items.first()).toContainText('夭夭 Web 验收会话')
  57. await expect(sidebar.getByRole('button', { name: '继续加载会话' })).toBeVisible()
  58. const list = sidebar.locator('.sidebar-list')
  59. await list.evaluate(element => {
  60. element.scrollTop = element.scrollHeight
  61. element.dispatchEvent(new Event('scroll'))
  62. })
  63. await expect(items).toHaveCount(103)
  64. await expect(sidebar.getByRole('button', { name: '继续加载会话' })).toHaveCount(0)
  65. })
  66. test('restores a routed conversation even when unread-count refresh fails', async ({ page }) => {
  67. await page.route('**/api/app/sessions/unread*', async route => {
  68. await route.fulfill({ status: 503, contentType: 'application/json', body: JSON.stringify({ error: 'unread unavailable' }) })
  69. })
  70. await page.goto('/chat/session-demo')
  71. await expect(page.getByText('已整理完成。下面是', { exact: false })).toBeVisible()
  72. await page.reload()
  73. await expect(page.getByText('已整理完成。下面是', { exact: false })).toBeVisible()
  74. })
  75. test('restores a legacy session link under its owning Agent profile', async ({ page }) => {
  76. await page.goto('/chat/session-yaoer')
  77. await expect(page.getByText('瑶儿历史消息', { exact: true })).toBeVisible()
  78. await expect(page).toHaveURL(/\/chat\/session-yaoer\?profile=yaoer/)
  79. await page.reload()
  80. await expect(page.getByText('瑶儿历史消息', { exact: true })).toBeVisible()
  81. })
  82. test('renders historical assistant MEDIA as Markdown in chat and group chat', async ({ page }) => {
  83. await page.goto('/chat/session-demo')
  84. const image = page.locator('.markdown img[alt="夭夭 Logo"]')
  85. await expect(image).toBeVisible()
  86. await image.click()
  87. const mediaDialog = page.getByRole('dialog', { name: /预览 AppIcon-1024.png/ })
  88. await expect(mediaDialog).toBeVisible()
  89. await expect(mediaDialog.getByRole('button', { name: '下一张媒体' })).toBeVisible()
  90. await mediaDialog.getByRole('button', { name: '下一张媒体' }).click()
  91. await expect(mediaDialog.locator('img')).toHaveAttribute('src', /variant=2/)
  92. await page.keyboard.press('ArrowLeft')
  93. await expect(mediaDialog.locator('img')).not.toHaveAttribute('src', /variant=2/)
  94. await expect(mediaDialog.getByRole('link', { name: /下载 AppIcon-1024\.png/ })).toBeVisible()
  95. await page.keyboard.press('Escape')
  96. await expect(page.getByRole('dialog', { name: /预览 AppIcon-1024.png/ })).toBeHidden()
  97. await image.click()
  98. const reopenedMediaDialog = page.getByRole('dialog', { name: /预览 AppIcon-1024.png/ })
  99. await reopenedMediaDialog.getByRole('button', { name: '添加到聊天' }).click()
  100. await expect(reopenedMediaDialog).toBeHidden()
  101. await expect(page.locator('.composer-attachments img[alt="AppIcon-1024.png"]')).toBeVisible()
  102. await page.getByRole('button', { name: '群聊' }).click()
  103. await expect(page.locator('.markdown img[alt="AppIcon-1024.png"]')).toBeVisible()
  104. })
  105. test('folds tool result rows into their expandable tool call', async ({ page }) => {
  106. await page.goto('/chat/session-demo')
  107. const tool = page.locator('[data-message-id="message-tool-call"]').getByRole('button', { name: /file_search/ })
  108. await expect(tool).toBeVisible()
  109. await tool.click()
  110. await expect(page.locator('.tool-trace pre')).toContainText('/tmp/demo-report.pdf')
  111. await expect(page.locator('.message--tool')).toHaveCount(0)
  112. })
  113. test('renders subtask completion as a collapsed timeline event', async ({ page }) => {
  114. await page.goto('/chat/session-demo')
  115. await expect(page.getByText('子任务已完成', { exact: true })).toBeVisible()
  116. await expect(page.locator('.delegation-event')).toContainText('2 个子任务 · 2 已完成')
  117. await expect(page.locator('.delegation-event')).not.toHaveAttribute('open', '')
  118. })
  119. test('renders model changes as a collapsed system event', async ({ page }) => {
  120. await page.goto('/chat/session-demo')
  121. await expect(page.getByText('模型已切换:gpt-5.6-terra', { exact: true })).toBeVisible()
  122. await expect(page.locator('.system-event')).not.toHaveAttribute('open', '')
  123. })
  124. test('opens a local message file link as a floating preview card', async ({ page }) => {
  125. await page.goto('/chat/session-demo')
  126. const card = page.getByRole('link', { name: '预览文件 方案草稿.md' })
  127. await expect(card).toHaveClass(/file-link-card/)
  128. await card.click()
  129. const dialog = page.getByRole('dialog', { name: '预览 方案草稿.md' })
  130. await expect(dialog).toBeVisible()
  131. const stageHeight = await dialog.locator('.preview-stage').evaluate(stage => stage.getBoundingClientRect().height)
  132. expect(stageHeight).toBeGreaterThan(500)
  133. })
  134. test('keeps the canonical logo and yaoyao-webui composer geometry', async ({ page }) => {
  135. const logo = page.locator('.rail__brand img')
  136. await expect(logo).toHaveAttribute('src', '/brand/AppIcon-1024.png')
  137. const emptyLogo = page.locator('.new-chat-empty__logo')
  138. await expect(emptyLogo).toHaveAttribute('src', '/brand/AppIcon-1024.png')
  139. await expect(page.getByText('聊点什么', { exact: true })).toBeVisible()
  140. await expect(page.locator('.timeline-header')).toHaveClass(/timeline-header--transparent/)
  141. await expect(page.locator('.composer-context')).toContainText('剩余 256.0k')
  142. await page.getByRole('button', { name: '推理强度:默认' }).click()
  143. await expect(page.locator('.composer-popover--reasoning')).toBeVisible()
  144. await page.getByRole('button', { name: '设置' }).click()
  145. await expect(page.locator('.composer-popover--settings')).toBeVisible()
  146. await expect(page.getByText('语音输入设置', { exact: true })).toBeVisible()
  147. await page.locator('.composer-shell').click()
  148. await page.getByRole('option').first().click()
  149. await expect(page.locator('.timeline')).toHaveCSS('background-color', 'rgb(255, 255, 255)')
  150. await expect(page.locator('.message--assistant .message__avatar')).toHaveCount(0)
  151. await expect(page.locator('.message--assistant .message__meta')).toHaveCount(0)
  152. const assistantMessage = page.locator('.message--assistant-anonymous:not(.message--tool-only)').first()
  153. await page.mouse.move(1200, 20)
  154. await expect(assistantMessage.locator('.message__actions')).toHaveCSS('opacity', '0')
  155. await assistantMessage.hover()
  156. await expect(assistantMessage.locator('.message__actions')).toHaveCSS('opacity', '1')
  157. await expect(page.locator('.message--tool-only .message__actions')).toHaveCount(0)
  158. await expect(page.locator('[data-message-id="message-thinking-tool"] .message__actions')).toHaveCount(0)
  159. await expect(page.locator('[data-message-id="message-thinking-tool"]')).toHaveClass(/message--assistant-internal/)
  160. await expect(page.locator('.message--user .message__meta')).toHaveCSS('display', 'none')
  161. await expect(page.getByRole('button', { name: '会话操作' })).toBeVisible()
  162. await page.getByRole('button', { name: '会话操作' }).click()
  163. await expect(page.getByText('重命名', { exact: true })).toBeVisible()
  164. await expect(page.getByText('删除会话', { exact: true })).toBeVisible()
  165. await expect(page.getByText('置顶会话', { exact: true })).toHaveCount(0)
  166. const composer = page.locator('.composer-shell')
  167. await expect(composer).toBeVisible()
  168. const geometry = await composer.evaluate(element => {
  169. const rect = element.getBoundingClientRect()
  170. const style = getComputedStyle(element)
  171. return { width: rect.width, minHeight: style.minHeight, radius: style.borderRadius }
  172. })
  173. expect(geometry.width).toBeLessThanOrEqual(760)
  174. expect(geometry.minHeight).toBe('72px')
  175. expect(geometry.radius).toBe('18px')
  176. const send = page.getByRole('button', { name: '发送消息' })
  177. await expect(send).toHaveCSS('width', '34px')
  178. await expect(send).toHaveCSS('height', '34px')
  179. })
  180. test('uses the unified Grok-style sidebar, search trigger, and persistent collapse', async ({ page }) => {
  181. const sidebar = page.locator('.desktop-sidebar')
  182. await expect(sidebar).toBeVisible()
  183. await expect(sidebar).toHaveCSS('width', '264px')
  184. await expect(sidebar.locator('.brand-mark__name')).toHaveCount(0)
  185. await expect(sidebar.locator('.profile-switcher')).toHaveCount(0)
  186. await expect(sidebar.locator('.sidebar-account-switcher')).toHaveCount(1)
  187. await expect(page.getByRole('button', { name: '搜索', exact: true })).toBeVisible()
  188. await expect(page.getByRole('button', { name: '新建聊天', exact: true })).toBeVisible()
  189. await expect(sidebar.getByText('历史记录', { exact: true })).toBeVisible()
  190. const searchTrigger = page.getByRole('button', { name: '搜索', exact: true })
  191. const triggerBox = await searchTrigger.boundingBox()
  192. await searchTrigger.click()
  193. const search = page.getByPlaceholder('搜索会话').filter({ visible: true })
  194. await expect(search).toBeVisible()
  195. await page.waitForTimeout(150)
  196. const inputBox = await search.evaluate(element => {
  197. const rect = element.closest('label')?.getBoundingClientRect()
  198. return rect ? { y: rect.y, height: rect.height } : null
  199. })
  200. expect(inputBox?.y).toBe(triggerBox?.y)
  201. expect(inputBox?.height).toBe(triggerBox?.height)
  202. await search.fill('验收')
  203. await expect(page.getByRole('option', { name: /夭夭 Web 验收会话/ })).toBeVisible()
  204. await search.press('Escape')
  205. await expect(search).toBeHidden()
  206. await expect(searchTrigger).toBeVisible()
  207. await expect(searchTrigger).toHaveAttribute('aria-expanded', 'false')
  208. await page.getByRole('button', { name: '折叠侧边栏' }).click()
  209. await expect(sidebar).toHaveCSS('width', '68px')
  210. const collapseBox = await page.getByRole('button', { name: '展开侧边栏' }).boundingBox()
  211. const accountBox = await sidebar.locator('.sidebar-account-switcher__main').boundingBox()
  212. expect(collapseBox?.y).toBeLessThan(accountBox?.y ?? 0)
  213. await expect(sidebar.getByText('历史记录', { exact: true })).toBeHidden()
  214. await expect(page.getByRole('button', { name: '搜索', exact: true })).toBeVisible()
  215. await expect(page.getByRole('button', { name: '新建聊天', exact: true })).toBeVisible()
  216. await page.reload()
  217. await expect(sidebar).toHaveCSS('width', '68px')
  218. await page.getByRole('button', { name: '搜索', exact: true }).click()
  219. await expect(sidebar).toHaveCSS('width', '264px')
  220. await expect(page.getByPlaceholder('搜索会话').filter({ visible: true })).toBeVisible()
  221. })
  222. test('uses the mobile composer and keeps the closed drawer inert', async ({ page }) => {
  223. await page.setViewportSize({ width: 390, height: 844 })
  224. await page.reload()
  225. await expect(page.getByRole('navigation')).not.toBeVisible()
  226. const drawer = page.locator('.mobile-drawer')
  227. await expect(drawer).toHaveAttribute('aria-hidden', 'true')
  228. await expect(drawer).toHaveAttribute('inert', '')
  229. await expect(page.locator('.composer-shell')).toHaveCSS('min-height', '118px')
  230. await expect(page.locator('.composer-textarea')).toHaveCSS('font-size', '16px')
  231. })