workspace.spec.ts 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429
  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('uses the yaoyao-webui grouped model picker without a mobile full-screen sheet', async ({ page }) => {
  12. await page.goto('/chat/session-demo')
  13. await page.locator('.composer-tool--model').click()
  14. const dialog = page.getByRole('dialog', { name: '选择模型' })
  15. await expect(dialog).toBeVisible()
  16. await expect(dialog.getByPlaceholder('搜索模型名称或 ID')).toBeFocused()
  17. await expect(dialog.locator('.model-dialog__group-header')).toContainText('OpenAI')
  18. await expect(dialog.locator('.model-dialog__item--active')).toContainText('gpt-5.6')
  19. const desktopBox = await dialog.boundingBox()
  20. expect(desktopBox?.width).toBeGreaterThanOrEqual(450)
  21. expect(desktopBox?.width).toBeLessThanOrEqual(480)
  22. await dialog.getByPlaceholder('搜索模型名称或 ID').fill('gpt-5.5')
  23. await expect(dialog.locator('.model-dialog__item')).toHaveCount(1)
  24. await page.keyboard.press('Escape')
  25. await expect(dialog).toBeHidden()
  26. await page.setViewportSize({ width: 390, height: 844 })
  27. await page.locator('.composer-tool--model').click()
  28. const mobileBox = await dialog.boundingBox()
  29. expect(mobileBox?.x).toBeGreaterThanOrEqual(12)
  30. expect(mobileBox?.width).toBeLessThanOrEqual(366)
  31. expect(mobileBox?.height).toBeLessThan(820)
  32. })
  33. test('navigates every 9119 workspace without blank transitions', async ({ page }) => {
  34. const consoleErrors: string[] = []
  35. page.on('console', message => { if (message.type() === 'error') consoleErrors.push(message.text()) })
  36. await expect(page.getByRole('option').first()).toContainText('夭夭 Web 验收会话')
  37. await expect(page.getByRole('option').first()).toContainText('夭夭')
  38. await expect(page.locator('.desktop-sidebar').getByText('已置顶 1', { exact: true })).toBeVisible()
  39. await page.getByRole('button', { name: '群聊' }).click()
  40. await expect(page.getByRole('heading', { name: '设计与工程协作' })).toBeVisible()
  41. await expect(page.getByRole('button', { name: '对话', exact: true })).toBeVisible()
  42. await expect(page.getByRole('button', { name: '群聊', exact: true })).toHaveCount(0)
  43. await expect(page.getByRole('button', { name: '文件库', exact: true })).toHaveCount(0)
  44. await expect(page.getByRole('button', { name: '产物', exact: true })).toHaveCount(0)
  45. await expect(page.getByRole('button', { name: '新建群聊' })).toBeVisible()
  46. await expect(page.getByRole('button', { name: '新建群聊' })).toHaveCSS('background-color', 'rgba(0, 0, 0, 0)')
  47. await expect(page.getByRole('button', { name: '新建群聊' })).toHaveCSS('font-weight', '580')
  48. await expect(page.getByRole('button', { name: '管理群聊' })).toBeVisible()
  49. await expect(page.getByRole('button', { name: '发送消息' })).toBeVisible()
  50. await page.goto('/files')
  51. await expect(page.getByRole('heading', { name: '文件库', exact: true }).last()).toBeVisible()
  52. await expect(page.getByText('demo-report.pdf')).toBeVisible()
  53. const firstFileCard = page.locator('.library-grid article').first()
  54. const cardGeometry = await firstFileCard.evaluate(element => {
  55. const card = element.getBoundingClientRect()
  56. const preview = element.querySelector('.library-thumb')?.getBoundingClientRect()
  57. return { width: card.width, previewHeight: preview?.height || 0 }
  58. })
  59. expect(cardGeometry.width).toBeGreaterThanOrEqual(220)
  60. expect(cardGeometry.previewHeight).toBe(154)
  61. await page.getByText('demo-report.pdf').click()
  62. await expect(page.getByRole('dialog', { name: /预览 demo-report.pdf/ })).toBeVisible()
  63. await expect(page.locator('.preview-meta')).toHaveCount(0)
  64. const previewDialog = page.getByRole('dialog', { name: /预览 demo-report.pdf/ })
  65. await expect(previewDialog.getByRole('link', { name: '下载' })).toBeVisible()
  66. await expect(previewDialog.getByRole('button', { name: '加入输入框' })).toBeVisible()
  67. await expect(previewDialog.locator('.preview-close')).toBeVisible()
  68. const modalHeight = await page.locator('.preview-modal').evaluate(element => element.getBoundingClientRect().height)
  69. expect(modalHeight).toBeGreaterThan(600)
  70. await previewDialog.locator('.preview-close').click()
  71. await page.goto('/artifacts')
  72. await expect(page).toHaveURL(/\/chat$/)
  73. await expect(page.getByRole('button', { name: '产物', exact: true })).toHaveCount(0)
  74. expect(consoleErrors).toEqual([])
  75. })
  76. test('keeps pins first and loads the next session page at the list bottom', async ({ page }) => {
  77. const sidebar = page.locator('.desktop-sidebar')
  78. const items = sidebar.locator('.sidebar-list [role="option"]')
  79. await expect(items).toHaveCount(100)
  80. await expect(items.first()).toContainText('夭夭 Web 验收会话')
  81. await expect(sidebar.getByRole('button', { name: '继续加载会话' })).toBeVisible()
  82. const list = sidebar.locator('.sidebar-list')
  83. await list.evaluate(element => {
  84. element.scrollTop = element.scrollHeight
  85. element.dispatchEvent(new Event('scroll'))
  86. })
  87. await expect(items).toHaveCount(103)
  88. await expect(sidebar.getByRole('button', { name: '继续加载会话' })).toHaveCount(0)
  89. })
  90. test('switches the composer model to the selected historical session model', async ({ page }) => {
  91. await page.goto('/chat/session-demo?profile=yaoyao')
  92. await expect(page.locator('.composer-tool--model')).toContainText('gpt-5.6')
  93. await page.getByRole('option', { name: /第二个会话/ }).click()
  94. await expect(page.locator('.composer-tool--model')).toContainText('gpt-5.5')
  95. })
  96. test('restores a routed conversation even when unread-count refresh fails', async ({ page }) => {
  97. await page.route('**/api/app/sessions/unread*', async route => {
  98. await route.fulfill({ status: 503, contentType: 'application/json', body: JSON.stringify({ error: 'unread unavailable' }) })
  99. })
  100. await page.goto('/chat/session-demo')
  101. await expect(page.getByText('已整理完成。下面是', { exact: false })).toBeVisible()
  102. await page.reload()
  103. await expect(page.getByText('已整理完成。下面是', { exact: false })).toBeVisible()
  104. })
  105. test('opens a conversation even when marking it read is unsupported', async ({ page }) => {
  106. const pageErrors: string[] = []
  107. page.on('pageerror', error => pageErrors.push(error.message))
  108. await page.route('**/api/app/sessions/unread/*', async route => {
  109. await route.fulfill({ status: 405, contentType: 'application/json', body: JSON.stringify({ error: 'Method Not Allowed' }) })
  110. })
  111. await page.getByRole('option').filter({ hasText: '第二个会话' }).click()
  112. await expect(page).toHaveURL(/\/chat\/session-second\?profile=yaoyao/)
  113. await expect(page.getByText('已整理完成。下面是', { exact: false })).toBeVisible()
  114. expect(pageErrors).toEqual([])
  115. })
  116. test('syncs the blue fast-mode shortcut with the iOS-compatible session config', async ({ page }) => {
  117. await page.request.post('http://127.0.0.1:19119/__test/rpc-requests/reset')
  118. await page.goto('/chat/session-demo')
  119. const fast = page.getByRole('button', { name: '快速模式:已关闭' })
  120. await expect(fast).toHaveAttribute('aria-pressed', 'false')
  121. await fast.click()
  122. const enabled = page.getByRole('button', { name: '快速模式:已开启' })
  123. await expect(enabled).toHaveAttribute('aria-pressed', 'true')
  124. await expect(enabled).toHaveCSS('color', 'rgb(22, 119, 255)')
  125. await page.getByRole('textbox', { name: '输入消息,Enter 发送,Shift + Enter 换行' }).fill('使用快速模式')
  126. await page.getByRole('button', { name: '发送消息' }).click()
  127. await expect(page.getByText('这是来自假 Gateway 的流式回复。', { exact: true })).toBeVisible()
  128. const payload = await (await page.request.get('http://127.0.0.1:19119/__test/rpc-requests')).json() as { requests: Array<{ method: string; params: Record<string, unknown> }> }
  129. const fastConfigIndex = payload.requests.findIndex(request => request.method === 'config.set' && request.params.key === 'fast')
  130. const promptIndex = payload.requests.findIndex(request => request.method === 'prompt.submit')
  131. expect(fastConfigIndex).toBeGreaterThanOrEqual(0)
  132. expect(promptIndex).toBeGreaterThan(fastConfigIndex)
  133. expect(payload.requests[fastConfigIndex]?.params).toMatchObject({ key: 'fast', value: 'fast', scope: 'session' })
  134. await enabled.click()
  135. await expect(page.getByRole('button', { name: '快速模式:已关闭' })).toHaveAttribute('aria-pressed', 'false')
  136. await expect.poll(async () => {
  137. const next = await (await page.request.get('http://127.0.0.1:19119/__test/rpc-requests')).json() as typeof payload
  138. return next.requests.filter(request => request.method === 'config.set' && request.params.key === 'fast').at(-1)?.params.value
  139. }).toBe('normal')
  140. })
  141. test('reconciles an iOS fast-mode selection from the resumed 9119 session', async ({ page }) => {
  142. await page.request.post('http://127.0.0.1:19119/__test/rpc-requests/reset')
  143. await page.goto('/chat/session-yaoer?profile=yaoer')
  144. await expect(page.getByRole('button', { name: '快速模式:已关闭' })).toBeVisible()
  145. await page.getByRole('textbox', { name: '输入消息,Enter 发送,Shift + Enter 换行' }).fill('读取 iOS 快速模式')
  146. await page.getByRole('button', { name: '发送消息' }).click()
  147. await expect(page.getByRole('button', { name: '快速模式:已开启' })).toHaveCSS('color', 'rgb(22, 119, 255)')
  148. const payload = await (await page.request.get('http://127.0.0.1:19119/__test/rpc-requests')).json() as { requests: Array<{ method: string; params: Record<string, unknown> }> }
  149. expect(payload.requests.some(request => request.method === 'session.resume' && request.params.session_id === 'session-yaoer')).toBe(true)
  150. expect(payload.requests.some(request => request.method === 'config.set' && request.params.key === 'fast')).toBe(false)
  151. })
  152. test('keeps the show-thinking preference across sessions of the same Agent', async ({ page }) => {
  153. await page.goto('/chat/session-demo')
  154. await expect(page.locator('.turn-trace')).toHaveCount(1)
  155. await page.locator('.composer-tool[aria-label="设置"]').click()
  156. const setting = page.getByRole('switch', { name: /显示思考/ })
  157. await expect(setting).toHaveAttribute('aria-checked', 'true')
  158. await setting.click()
  159. await expect(page.locator('.turn-trace')).toHaveCount(0)
  160. await page.getByRole('option').filter({ hasText: '第二个会话' }).click()
  161. await expect(page.locator('.turn-trace')).toHaveCount(0)
  162. await page.locator('.composer-tool[aria-label="设置"]').click()
  163. await page.getByRole('switch', { name: /显示思考/ }).click()
  164. await expect(page.locator('.turn-trace')).toHaveCount(1)
  165. })
  166. test('restores a legacy session link under its owning Agent profile', async ({ page }) => {
  167. await page.goto('/chat/session-yaoer')
  168. await expect(page.getByText('瑶儿历史消息', { exact: true })).toBeVisible()
  169. await expect(page).toHaveURL(/\/chat\/session-yaoer\?profile=yaoer/)
  170. await page.reload()
  171. await expect(page.getByText('瑶儿历史消息', { exact: true })).toBeVisible()
  172. })
  173. test('renders historical assistant MEDIA as Markdown in chat and group chat', async ({ page }) => {
  174. await page.goto('/chat/session-demo')
  175. const image = page.locator('.markdown img[alt="夭夭 Logo"]')
  176. await expect(image).toBeVisible()
  177. await image.click()
  178. const mediaDialog = page.getByRole('dialog', { name: /预览 AppIcon-1024.png/ })
  179. await expect(mediaDialog).toBeVisible()
  180. await expect(mediaDialog.getByRole('button', { name: '下一张媒体' })).toBeVisible()
  181. await mediaDialog.getByRole('button', { name: '下一张媒体' }).click()
  182. await expect(mediaDialog.locator('img')).toHaveAttribute('src', /variant=2/)
  183. await page.keyboard.press('ArrowLeft')
  184. await expect(mediaDialog.locator('img')).not.toHaveAttribute('src', /variant=2/)
  185. await expect(mediaDialog.getByRole('link', { name: /下载 AppIcon-1024\.png/ })).toBeVisible()
  186. await page.keyboard.press('Escape')
  187. await expect(page.getByRole('dialog', { name: /预览 AppIcon-1024.png/ })).toBeHidden()
  188. await image.click()
  189. const reopenedMediaDialog = page.getByRole('dialog', { name: /预览 AppIcon-1024.png/ })
  190. await reopenedMediaDialog.getByRole('button', { name: '添加到聊天' }).click()
  191. await expect(reopenedMediaDialog).toBeHidden()
  192. await expect(page.locator('.composer-attachments img[alt="AppIcon-1024.png"]')).toBeVisible()
  193. await page.getByRole('button', { name: '群聊' }).click()
  194. await expect(page.locator('.markdown img[alt="AppIcon-1024.png"]')).toBeVisible()
  195. })
  196. test('folds tool result rows into their expandable tool call', async ({ page }) => {
  197. await page.goto('/chat/session-demo')
  198. const trace = page.locator('.turn-trace').first()
  199. await expect(trace).not.toHaveAttribute('open', '')
  200. await expect(trace.locator('summary')).toContainText('思考与工具')
  201. await expect(trace.locator('summary')).toContainText('2 段思考 · 2 个工具')
  202. await trace.locator('summary').click()
  203. await expect(trace.locator('.turn-trace__reasoning')).toHaveCount(2)
  204. await expect(trace.locator('.tool-trace')).toHaveCount(2)
  205. await expect(trace.locator('.tool-trace__details')).toHaveCount(2)
  206. await expect(trace.locator('.tool-trace__details').filter({ hasText: '/tmp/demo-report.pdf' })).toBeVisible()
  207. await expect(page.locator('[data-message-id="message-tool-call"]')).toHaveCount(0)
  208. await expect(page.locator('.message--tool')).toHaveCount(0)
  209. })
  210. test('renders subtask completion as a collapsed timeline event', async ({ page }) => {
  211. await page.goto('/chat/session-demo')
  212. await expect(page.getByText('子任务已完成', { exact: true })).toBeVisible()
  213. const delegation = page.locator('.delegation-event').filter({ hasText: '子任务已完成' })
  214. await expect(delegation).toContainText('2 个子任务 · 2 已完成')
  215. await expect(delegation).not.toHaveAttribute('open', '')
  216. })
  217. test('renders context compaction as a collapsed timeline event', async ({ page }) => {
  218. await page.goto('/chat/session-demo')
  219. const compaction = page.locator('[data-message-id="message-compaction"] .compaction-event')
  220. await expect(compaction).toContainText('上下文已压缩')
  221. await expect(compaction).toContainText('压缩摘要已归档 · 点击查看')
  222. await expect(compaction).not.toHaveAttribute('open', '')
  223. await expect(compaction.getByText('Historical Task Snapshot', { exact: true })).toBeHidden()
  224. await compaction.locator('summary').click()
  225. await expect(compaction.getByText('Historical Task Snapshot', { exact: true })).toBeVisible()
  226. await expect(page.locator('[data-message-id="message-compaction"]')).toHaveClass(/message--system/)
  227. })
  228. test('renders model changes as a collapsed system event', async ({ page }) => {
  229. await page.goto('/chat/session-demo')
  230. await expect(page.getByText('模型已切换:gpt-5.6-terra', { exact: true })).toBeVisible()
  231. await expect(page.locator('.system-event')).not.toHaveAttribute('open', '')
  232. })
  233. test('opens a local message file link as a floating preview card', async ({ page }) => {
  234. await page.goto('/chat/session-demo')
  235. const card = page.getByRole('link', { name: '预览文件 方案草稿.md' })
  236. await expect(card).toHaveClass(/file-link-card/)
  237. await card.click()
  238. const dialog = page.getByRole('dialog', { name: '预览 方案草稿.md' })
  239. await expect(dialog).toBeVisible()
  240. const stageHeight = await dialog.locator('.preview-stage').evaluate(stage => stage.getBoundingClientRect().height)
  241. expect(stageHeight).toBeGreaterThan(500)
  242. })
  243. test('shows a thinking animation after submit until output starts', async ({ page }) => {
  244. await page.goto('/chat/session-demo?profile=yaoyao')
  245. await page.locator('.composer-textarea').fill('请开始思考')
  246. await page.getByRole('button', { name: '发送消息' }).click()
  247. await expect(page.locator('.thinking-indicator')).toBeVisible()
  248. await expect(page.getByText('这是来自假 Gateway 的流式回复。', { exact: true })).toBeVisible()
  249. await expect(page.locator('.thinking-indicator')).toHaveCount(0)
  250. })
  251. test('keeps the canonical logo and yaoyao-webui composer geometry', async ({ page }) => {
  252. const logo = page.locator('.rail__brand img')
  253. await expect(logo).toHaveAttribute('src', '/brand/AppIcon-1024.png')
  254. const emptyLogo = page.locator('.new-chat-empty__logo')
  255. await expect(emptyLogo).toHaveAttribute('src', '/brand/AppIcon-1024.png')
  256. await expect(page.getByText('聊点什么', { exact: true })).toBeVisible()
  257. await expect(page.locator('.timeline-header')).toHaveClass(/timeline-header--transparent/)
  258. await expect(page.locator('.composer-context')).toContainText('剩余 256.0k')
  259. await page.getByRole('button', { name: '推理强度:默认' }).click()
  260. await expect(page.locator('.composer-popover--reasoning')).toBeVisible()
  261. await page.getByRole('button', { name: '设置' }).click()
  262. await expect(page.locator('.composer-popover--settings')).toBeVisible()
  263. await expect(page.getByText('语音输入设置', { exact: true })).toBeVisible()
  264. await page.locator('.composer-shell').click()
  265. await page.getByRole('option').first().click()
  266. await expect(page.locator('.timeline')).toHaveCSS('background-color', 'rgb(255, 255, 255)')
  267. await expect(page.locator('.message--assistant .message__avatar')).toHaveCount(0)
  268. await expect(page.locator('.message--assistant .message__meta')).toHaveCount(0)
  269. const assistantMessage = page.locator('.message--assistant-anonymous:not(.message--tool-only)').first()
  270. await page.mouse.move(1200, 20)
  271. await expect(assistantMessage.locator('.message__actions')).toHaveCSS('opacity', '0')
  272. await assistantMessage.hover()
  273. await expect(assistantMessage.locator('.message__actions')).toHaveCSS('opacity', '1')
  274. await expect(page.locator('.message--tool-only .message__actions')).toHaveCount(0)
  275. await expect(page.locator('[data-message-id="message-thinking-tool"]')).toHaveCount(0)
  276. await expect(page.locator('.turn-trace')).toHaveCount(1)
  277. await expect(page.locator('.message--user .message__meta')).toHaveCSS('display', 'none')
  278. await expect(page.getByRole('button', { name: '会话操作' })).toBeVisible()
  279. await page.getByRole('button', { name: '会话操作' }).click()
  280. const sessionMenu = page.getByRole('menu', { name: '会话操作' })
  281. await expect(sessionMenu.getByText('会话大纲', { exact: true })).toBeVisible()
  282. await sessionMenu.getByText('会话大纲', { exact: true }).click()
  283. const outline = page.getByRole('navigation', { name: '会话大纲' })
  284. await expect(outline).toBeVisible()
  285. await expect(outline.getByText('请检查今天生成的产物。MEDIA:/brand/AppIcon-1024.png', { exact: true })).toBeVisible()
  286. await expect(outline.getByText('验收摘要', { exact: true })).toBeVisible()
  287. await outline.getByRole('button', { name: '跳转到 验收摘要' }).click()
  288. await expect(page.locator('[data-message-id="message-assistant"]')).toHaveClass(/message--revealed/)
  289. await page.getByRole('button', { name: '关闭会话大纲' }).click()
  290. await expect(outline).toBeHidden()
  291. await page.getByRole('button', { name: '会话操作' }).click()
  292. await expect(sessionMenu.getByText('取消置顶', { exact: true })).toBeVisible()
  293. const unpinIcon = sessionMenu.getByRole('menuitem', { name: '取消置顶' }).locator('.app-icon')
  294. await expect(unpinIcon.locator('path')).toHaveCount(2)
  295. await expect(unpinIcon.locator('path').last()).toHaveAttribute('d', 'M4 4l16 16')
  296. await expect(page.locator('.desktop-sidebar .sidebar-item--single-line').first().locator('.app-icon path')).toHaveAttribute('fill', 'currentColor')
  297. await expect(sessionMenu.getByText('重命名', { exact: true })).toBeVisible()
  298. await expect(sessionMenu.getByText('删除会话', { exact: true })).toBeVisible()
  299. await expect(page.getByText('置顶会话', { exact: true })).toHaveCount(0)
  300. const menuBox = await sessionMenu.evaluate(element => element.getBoundingClientRect().toJSON())
  301. expect(menuBox.width).toBeLessThanOrEqual(220)
  302. expect(menuBox.height).toBeLessThan(165)
  303. await expect(page.locator('.session-action-layer')).toHaveCount(0)
  304. await sessionMenu.getByText('取消置顶', { exact: true }).click()
  305. await expect(page.locator('.desktop-sidebar').getByText('已置顶 1', { exact: true })).toHaveCount(0)
  306. await page.getByRole('button', { name: '会话操作' }).click()
  307. await sessionMenu.getByText('置顶会话', { exact: true }).click()
  308. await expect(page.locator('.desktop-sidebar').getByText('已置顶 1', { exact: true })).toBeVisible()
  309. const compactSession = page.locator('.desktop-sidebar .sidebar-item--single-line').first()
  310. const compactMetrics = await compactSession.evaluate(element => {
  311. const title = element.querySelector('strong')
  312. return {
  313. height: element.getBoundingClientRect().height,
  314. weight: title ? Number(getComputedStyle(title).fontWeight) : 0,
  315. }
  316. })
  317. expect(compactMetrics.height).toBeLessThanOrEqual(31)
  318. expect(compactMetrics.weight).toBeLessThan(500)
  319. await compactSession.click({ button: 'right' })
  320. await expect(sessionMenu).toBeVisible()
  321. await page.keyboard.press('Escape')
  322. const composer = page.locator('.composer-shell')
  323. await expect(composer).toBeVisible()
  324. const geometry = await composer.evaluate(element => {
  325. const rect = element.getBoundingClientRect()
  326. const style = getComputedStyle(element)
  327. return { width: rect.width, minHeight: style.minHeight, radius: style.borderRadius }
  328. })
  329. expect(geometry.width).toBeLessThanOrEqual(760)
  330. expect(geometry.minHeight).toBe('72px')
  331. expect(geometry.radius).toBe('18px')
  332. const send = page.getByRole('button', { name: '发送消息' })
  333. await expect(send).toHaveCSS('width', '34px')
  334. await expect(send).toHaveCSS('height', '34px')
  335. })
  336. test('uses the unified Grok-style sidebar, search trigger, and persistent collapse', async ({ page }) => {
  337. const sidebar = page.locator('.desktop-sidebar')
  338. await expect(sidebar).toBeVisible()
  339. await expect(sidebar).toHaveCSS('width', '264px')
  340. await expect(sidebar.locator('.brand-mark__name')).toHaveCount(0)
  341. await expect(sidebar.locator('.profile-switcher')).toHaveCount(0)
  342. await expect(sidebar.locator('.sidebar-account-switcher')).toHaveCount(1)
  343. await expect(page.getByRole('button', { name: '搜索', exact: true })).toBeVisible()
  344. await expect(page.getByRole('button', { name: '新建聊天', exact: true })).toBeVisible()
  345. await expect(page.getByRole('button', { name: '新建聊天', exact: true })).toHaveCSS('background-color', 'rgba(0, 0, 0, 0)')
  346. await expect(page.getByRole('button', { name: '新建聊天', exact: true })).toHaveCSS('font-weight', '580')
  347. await expect(sidebar.getByText('历史记录', { exact: true })).toBeVisible()
  348. const searchTrigger = page.getByRole('button', { name: '搜索', exact: true })
  349. const triggerBox = await searchTrigger.boundingBox()
  350. await searchTrigger.click()
  351. const search = page.getByPlaceholder('搜索会话').filter({ visible: true })
  352. await expect(search).toBeVisible()
  353. await page.waitForTimeout(150)
  354. const inputBox = await search.evaluate(element => {
  355. const rect = element.closest('label')?.getBoundingClientRect()
  356. return rect ? { y: rect.y, height: rect.height } : null
  357. })
  358. expect(inputBox?.y).toBe(triggerBox?.y)
  359. expect(inputBox?.height).toBe(triggerBox?.height)
  360. await search.fill('验收')
  361. await expect(page.getByRole('option', { name: /夭夭 Web 验收会话/ })).toBeVisible()
  362. await search.press('Escape')
  363. await expect(search).toBeHidden()
  364. await expect(searchTrigger).toBeVisible()
  365. await expect(searchTrigger).toHaveAttribute('aria-expanded', 'false')
  366. await page.getByRole('button', { name: '折叠侧边栏' }).click()
  367. await expect(sidebar).toHaveCSS('width', '68px')
  368. const collapseBox = await page.getByRole('button', { name: '展开侧边栏' }).boundingBox()
  369. const accountBox = await sidebar.locator('.sidebar-account-switcher__main').boundingBox()
  370. expect(collapseBox?.y).toBeLessThan(accountBox?.y ?? 0)
  371. await expect(sidebar.getByText('历史记录', { exact: true })).toBeHidden()
  372. await expect(page.getByRole('button', { name: '搜索', exact: true })).toBeVisible()
  373. await expect(page.getByRole('button', { name: '新建聊天', exact: true })).toBeVisible()
  374. await page.reload()
  375. await expect(sidebar).toHaveCSS('width', '68px')
  376. await page.getByRole('button', { name: '搜索', exact: true }).click()
  377. await expect(sidebar).toHaveCSS('width', '264px')
  378. await expect(page.getByPlaceholder('搜索会话').filter({ visible: true })).toBeVisible()
  379. })
  380. test('uses the mobile composer and keeps the closed drawer inert', async ({ page }) => {
  381. await page.setViewportSize({ width: 390, height: 844 })
  382. await page.reload()
  383. await expect(page.getByRole('navigation')).not.toBeVisible()
  384. const drawer = page.locator('.mobile-drawer')
  385. await expect(drawer).toHaveAttribute('aria-hidden', 'true')
  386. await expect(drawer).toHaveAttribute('inert', '')
  387. await expect(page.locator('.composer-shell')).toHaveCSS('min-height', '118px')
  388. await expect(page.locator('.composer-textarea')).toHaveCSS('font-size', '16px')
  389. })