workspace.spec.ts 39 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692
  1. import { expect, test } from '@playwright/test'
  2. const WIDE_DOCX_BASE64 = 'UEsDBAoAAAAIAKwmFF15bjPX6AAAAK0BAAATAAAAW0NvbnRlbnRfVHlwZXNdLnhtbH1QyU7DMBD9FWuuKHHggBCK0wPLETiUDxjZk8SqN3nc0v49Tlt6QIXjzFv1+tXeO7GjzDYGBbdtB4KCjsaGScHn+rV5AMEFg0EXAyk4EMNq6NeHRCyqNrCCuZT0KCXrmTxyGxOFiowxeyz1zJNMqDc4kbzrunupYygUSlMWDxj6Zxpx64p42df3qUcmxyCeTsQlSwGm5KzGUnG5C+ZXSnNOaKvyyOHZJr6pBJBXExbk74Cz7r0Ok60h8YG5vKGvLPkVs5Em6q2vyvZ/mys94zhaTRf94pZy1MRcF/euvSAebfjpL49zD99QSwMECgAAAAAArCYUXQAAAAAAAAAAAAAAAAYAAABfcmVscy9QSwMECgAAAAgArCYUXZv9N+qtAAAAKQEAAAsAAABfcmVscy8ucmVsc43POw7CMAwG4KtE3mlaBoRQ0y4IqSsqB7ASN61oHkrCo7cnAwNFDIy2f3+W6/ZpZnanECdnBVRFCYysdGqyWsClP232wGJCq3B2lgQsFKFt6jPNmPJKHCcfWTZsFDCm5A+cRzmSwVg4TzZPBhcMplwGzT3KK2ri27Lc8fBpwNpknRIQOlUB6xdP/9huGCZJRydvhmz6ceIrkWUMmpKAhwuKq3e7yCzwpuarF5sXUEsDBAoAAAAAAKwmFF0AAAAAAAAAAAAAAAAFAAAAd29yZC9QSwMECgAAAAgArCYUXalT+9hjAQAABwMAABEAAAB3b3JkL2RvY3VtZW50LnhtbKVSW0/CMBT+K03fpXMBJYRBFAaaYDSKwdeydluTrW3awsBfb7uVDYwmJr6cc75z+c6lHU8PZQH2VGkmeASvewEElCeCMJ5F8H29uBpCoA3mBBeC0wgeqYbTybgaEZHsSsoNsARcj6oI5sbIEUI6yWmJdU9Iym0sFarExkKVoUooIpVIqNaWvyxQGAQ3qMSMQ0e5FeTotHRCOWEmG0YomD/PPoBUdM9oNUbO7aSqZZ1stoVXL8obG1C5oa6DYWB3sq6jtOOTA4bIZ6zwUexMG0rZgRIXRJdES8WIMzOrZ6JoaAd9y4p+daOLStNQJY30xMnmrOT7fKhLPD/GKl6swfrufhWDeL6MfzgF6vr8u9vr4/Lhb+1QsyNqH0LTxHjC7O3Tv0QY9uveubUHw76/n8yesHITCRnB27DOUCzLTYu2whhRtrCgaRfLKSZURbAGqRCmBdnOeNBseBoJnf4Z6v7w5AtQSwECFAAKAAAACACsJhRdeW4z1+gAAACtAQAAEwAAAAAAAAAAAAAAAAAAAAAAW0NvbnRlbnRfVHlwZXNdLnhtbFBLAQIUAAoAAAAAAKwmFF0AAAAAAAAAAAAAAAAGAAAAAAAAAAAAEAAAABkBAABfcmVscy9QSwECFAAKAAAACACsJhRdm/036q0AAAApAQAACwAAAAAAAAAAAAAAAAA9AQAAX3JlbHMvLnJlbHNQSwECFAAKAAAAAACsJhRdAAAAAAAAAAAAAAAABQAAAAAAAAAAABAAAAATAgAAd29yZC9QSwECFAAKAAAACACsJhRdqVP72GMBAAAHAwAAEQAAAAAAAAAAAAAAAAA2AgAAd29yZC9kb2N1bWVudC54bWxQSwUGAAAAAAUABQAgAQAAyAMAAAAA'
  3. test.beforeEach(async ({ page }) => {
  4. await page.goto('/chat')
  5. if (await page.getByRole('heading', { name: '登录 Hermes' }).isVisible()) {
  6. await page.getByLabel('账号').fill('test')
  7. await page.getByLabel('密码').fill('test')
  8. await page.getByRole('button', { name: '登录' }).click()
  9. }
  10. await expect(page.getByRole('navigation')).toBeVisible()
  11. })
  12. test('uses the yaoyao-webui grouped model picker without a mobile full-screen sheet', async ({ page }) => {
  13. await page.goto('/chat/session-demo')
  14. await page.locator('.composer-tool--model').click()
  15. const dialog = page.getByRole('dialog', { name: '选择模型' })
  16. await expect(dialog).toBeVisible()
  17. await expect(dialog.getByPlaceholder('搜索模型名称或 ID')).toBeFocused()
  18. await expect(dialog.locator('.model-dialog__group-header')).toContainText('OpenAI')
  19. await expect(dialog.locator('.model-dialog__item--active')).toContainText('gpt-5.6')
  20. const desktopBox = await dialog.boundingBox()
  21. expect(desktopBox?.width).toBeGreaterThanOrEqual(450)
  22. expect(desktopBox?.width).toBeLessThanOrEqual(480)
  23. await dialog.getByPlaceholder('搜索模型名称或 ID').fill('gpt-5.5')
  24. await expect(dialog.locator('.model-dialog__item')).toHaveCount(1)
  25. await page.keyboard.press('Escape')
  26. await expect(dialog).toBeHidden()
  27. await page.setViewportSize({ width: 390, height: 844 })
  28. await page.locator('.composer-tool--model').click()
  29. const mobileBox = await dialog.boundingBox()
  30. expect(mobileBox?.x).toBeGreaterThanOrEqual(12)
  31. expect(mobileBox?.width).toBeLessThanOrEqual(366)
  32. expect(mobileBox?.height).toBeLessThan(820)
  33. })
  34. test('navigates every 9119 workspace without blank transitions', async ({ page }) => {
  35. const consoleErrors: string[] = []
  36. page.on('console', message => { if (message.type() === 'error') consoleErrors.push(message.text()) })
  37. await expect(page.getByRole('option').first()).toContainText('夭夭 Web 验收会话')
  38. await expect(page.getByRole('option').first()).toContainText('夭夭')
  39. await expect(page.locator('.desktop-sidebar').getByText('已置顶 1', { exact: true })).toBeVisible()
  40. await page.getByRole('button', { name: '群聊' }).click()
  41. await expect(page.getByRole('heading', { name: '设计与工程协作' })).toBeVisible()
  42. await expect(page.getByRole('button', { name: '对话', exact: true })).toBeVisible()
  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: '产物', exact: true })).toHaveCount(0)
  46. await expect(page.getByRole('button', { name: '新建群聊' })).toBeVisible()
  47. await expect(page.getByRole('button', { name: '新建群聊' })).toHaveCSS('background-color', 'rgba(0, 0, 0, 0)')
  48. await expect(page.getByRole('button', { name: '新建群聊' })).toHaveCSS('font-weight', '580')
  49. await expect(page.getByRole('button', { name: '管理群聊' })).toBeVisible()
  50. await expect(page.getByRole('button', { name: '发送消息' })).toBeVisible()
  51. await page.goto('/files')
  52. await expect(page.getByRole('heading', { name: '文件库', exact: true }).last()).toBeVisible()
  53. const fileSidebar = page.locator('.desktop-sidebar')
  54. await expect(fileSidebar.getByRole('button', { name: '新建聊天' })).toBeVisible()
  55. const compactControlHeights = await fileSidebar.locator('.sidebar-search-trigger, .sidebar-primary-action button, .sidebar-feature-nav button').evaluateAll(elements => (
  56. elements.map(element => element.getBoundingClientRect().height)
  57. ))
  58. expect(compactControlHeights.length).toBeGreaterThanOrEqual(4)
  59. expect(Math.max(...compactControlHeights)).toBeLessThanOrEqual(36)
  60. await expect(page.getByText('demo-report.pdf')).toBeVisible()
  61. const firstFileCard = page.locator('.library-grid article').first()
  62. const cardGeometry = await firstFileCard.evaluate(element => {
  63. const card = element.getBoundingClientRect()
  64. const preview = element.querySelector('.library-thumb')?.getBoundingClientRect()
  65. return { width: card.width, previewHeight: preview?.height || 0 }
  66. })
  67. expect(cardGeometry.width).toBeGreaterThanOrEqual(220)
  68. expect(cardGeometry.previewHeight).toBe(154)
  69. await page.getByText('demo-report.pdf').click()
  70. await expect(page.getByRole('dialog', { name: /预览 demo-report.pdf/ })).toBeVisible()
  71. await expect(page.locator('.preview-meta')).toHaveCount(0)
  72. const previewDialog = page.getByRole('dialog', { name: /预览 demo-report.pdf/ })
  73. await expect(previewDialog.getByRole('link', { name: '下载' })).toBeVisible()
  74. await expect(previewDialog.getByRole('button', { name: '加入输入框' })).toBeVisible()
  75. await expect(previewDialog.locator('.preview-close')).toBeVisible()
  76. const modalHeight = await page.locator('.preview-modal').evaluate(element => element.getBoundingClientRect().height)
  77. expect(modalHeight).toBeGreaterThan(600)
  78. await previewDialog.locator('.preview-close').click()
  79. await fileSidebar.getByRole('button', { name: '新建聊天' }).click()
  80. await expect(page).toHaveURL(/\/chat\/draft-[^?]+\?profile=yaoyao/)
  81. await page.goto('/artifacts')
  82. await expect(page).toHaveURL(/\/chat$/)
  83. await expect(page.getByRole('button', { name: '产物', exact: true })).toHaveCount(0)
  84. expect(consoleErrors).toEqual([])
  85. })
  86. test('edits every protocol v3 Agent setting with one inspector close control', async ({ page }) => {
  87. await page.getByRole('button', { name: '群聊' }).click()
  88. await expect(page.getByRole('heading', { name: '设计与工程协作' })).toBeVisible()
  89. await page.getByRole('button', { name: '管理群聊' }).click()
  90. await expect(page.getByRole('button', { name: '关闭群聊管理' })).toHaveCount(1)
  91. await expect(page.getByRole('button', { name: '关闭预览' })).toHaveCount(0)
  92. await expect(page.getByLabel('最多回复轮数')).toHaveValue('-1')
  93. await page.getByRole('button', { name: '设置夭夭' }).click()
  94. const editor = page.getByRole('group', { name: '夭夭 Agent 设置' })
  95. await expect(editor.getByLabel('显示名称')).toHaveValue('夭夭')
  96. await expect(editor.getByLabel('职责说明')).toHaveValue('主 Agent')
  97. await expect(editor.getByLabel('模型')).toHaveValue(JSON.stringify(['openai', 'gpt-5.6']))
  98. await expect(editor.getByLabel('推理强度')).toHaveValue('high')
  99. await expect(editor.getByLabel('快速模式')).toHaveValue('true')
  100. await editor.getByLabel('显示名称').fill('所有人')
  101. const rejectedResponse = page.waitForResponse(response => response.request().method() === 'PATCH' && /\/api\/app\/groups\/rooms\/[^/]+\/agents\/[^/]+$/.test(new URL(response.url()).pathname))
  102. await editor.getByRole('button', { name: '保存 Agent 设置' }).click()
  103. expect((await rejectedResponse).status()).toBe(409)
  104. await expect(editor.getByRole('alert')).toContainText('成员名称不能使用“所有人”')
  105. await page.getByRole('button', { name: '设置夭夭' }).click()
  106. await page.getByRole('button', { name: '设置夭夭' }).click()
  107. await expect(editor.getByLabel('显示名称')).toHaveValue('所有人')
  108. await editor.getByLabel('显示名称').fill('夭夭')
  109. await editor.getByLabel('模型').selectOption(JSON.stringify(['openai', 'gpt-5.5']))
  110. await editor.getByLabel('推理强度').selectOption('xhigh')
  111. await editor.getByLabel('快速模式').selectOption('false')
  112. await editor.getByLabel('自动回复').uncheck()
  113. const updateRequest = page.waitForRequest(request => request.method() === 'PATCH' && /\/api\/app\/groups\/rooms\/[^/]+\/agents\/[^/]+$/.test(new URL(request.url()).pathname))
  114. await editor.getByRole('button', { name: '保存 Agent 设置' }).click()
  115. expect((await updateRequest).postDataJSON()).toMatchObject({
  116. model: 'gpt-5.5', provider: 'openai', reasoningEffort: 'xhigh', fastMode: false, replyWithoutMention: false,
  117. })
  118. await expect(editor.getByLabel('模型')).toHaveValue(JSON.stringify(['openai', 'gpt-5.5']))
  119. await editor.getByLabel('模型').selectOption(JSON.stringify(['openai', 'gpt-5.6']))
  120. await editor.getByLabel('推理强度').selectOption('high')
  121. await editor.getByLabel('快速模式').selectOption('true')
  122. await editor.getByLabel('自动回复').check()
  123. const restoreResponse = page.waitForResponse(response => response.request().method() === 'PATCH' && /\/api\/app\/groups\/rooms\/[^/]+\/agents\/[^/]+$/.test(new URL(response.url()).pathname))
  124. await editor.getByRole('button', { name: '保存 Agent 设置' }).click()
  125. expect((await restoreResponse).status()).toBe(200)
  126. })
  127. test('previews an octet-stream Markdown file from the file library', async ({ page }) => {
  128. await page.route('**/api/app/files**', async route => {
  129. const url = new URL(route.request().url())
  130. if (url.pathname === '/api/app/files') {
  131. await route.fulfill({
  132. status: 200,
  133. contentType: 'application/json',
  134. body: JSON.stringify({
  135. profile: 'yaoyao',
  136. items: [{
  137. id: 'markdown-file',
  138. path: '/tmp/版本说明.md',
  139. name: '版本说明.md',
  140. extension: '.md',
  141. mimeType: 'application/octet-stream',
  142. size: 48,
  143. modifiedAt: Date.now() / 1000,
  144. exists: true,
  145. origins: [{ profile: 'yaoyao', sessionId: 'session-demo', sessionTitle: '夭夭 Web 验收会话' }],
  146. }, {
  147. id: 'empty-markdown-file',
  148. path: '/tmp/空白说明.md',
  149. name: '空白说明.md',
  150. extension: 'md',
  151. mimeType: 'application/octet-stream',
  152. size: 0,
  153. modifiedAt: Date.now() / 1000,
  154. exists: true,
  155. origins: [{ profile: 'yaoyao', sessionId: 'session-demo', sessionTitle: '夭夭 Web 验收会话' }],
  156. }],
  157. nextCursor: null,
  158. total: 2,
  159. }),
  160. })
  161. return
  162. }
  163. if (url.pathname === '/api/app/files/markdown-file/preview') {
  164. await route.fulfill({
  165. status: 200,
  166. contentType: 'application/octet-stream',
  167. body: '# 版本说明\n\n- Markdown 预览已恢复',
  168. })
  169. return
  170. }
  171. if (url.pathname === '/api/app/files/empty-markdown-file/preview') {
  172. await route.fulfill({ status: 200, contentType: 'application/octet-stream', body: '' })
  173. return
  174. }
  175. await route.continue()
  176. })
  177. await page.goto('/files')
  178. await page.getByText('版本说明.md', { exact: true }).click()
  179. const dialog = page.getByRole('dialog', { name: '预览 版本说明.md' })
  180. await expect(dialog.locator('.preview-text h1')).toHaveText('版本说明')
  181. await expect(dialog.getByText('Markdown 预览已恢复', { exact: true })).toBeVisible()
  182. await dialog.locator('.preview-close').click()
  183. await page.getByText('空白说明.md', { exact: true }).click()
  184. const emptyDialog = page.getByRole('dialog', { name: '预览 空白说明.md' })
  185. await expect(emptyDialog.locator('.preview-text')).toBeVisible()
  186. await expect(emptyDialog.locator('.preview-unavailable')).toHaveCount(0)
  187. })
  188. test('keeps DOCX body at 36px inset with zero canvas margin', async ({ page }) => {
  189. await page.setViewportSize({ width: 620, height: 760 })
  190. await page.route('**/api/app/files**', async route => {
  191. const url = new URL(route.request().url())
  192. if (url.pathname === '/api/app/files') {
  193. await route.fulfill({
  194. status: 200,
  195. contentType: 'application/json',
  196. body: JSON.stringify({
  197. profile: 'yaoyao',
  198. items: [{
  199. id: 'wide-docx-file',
  200. path: '/tmp/宽版文档.docx',
  201. name: '宽版文档.docx',
  202. extension: 'docx',
  203. mimeType: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
  204. size: 1024,
  205. modifiedAt: Date.now() / 1000,
  206. exists: true,
  207. origins: [{ profile: 'yaoyao', sessionId: 'session-demo', sessionTitle: '夭夭 Web 验收会话' }],
  208. }],
  209. nextCursor: null,
  210. total: 1,
  211. }),
  212. })
  213. return
  214. }
  215. if (url.pathname === '/api/app/files/wide-docx-file/preview') {
  216. await route.fulfill({
  217. status: 200,
  218. contentType: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
  219. body: Buffer.from(WIDE_DOCX_BASE64, 'base64'),
  220. })
  221. return
  222. }
  223. await route.continue()
  224. })
  225. await page.goto('/files')
  226. await page.getByText('宽版文档.docx', { exact: true }).click()
  227. const dialog = page.getByRole('dialog', { name: '预览 宽版文档.docx' })
  228. const office = dialog.locator('.preview-office')
  229. await expect(office.locator('section.docx')).toBeVisible()
  230. const geometry = await office.evaluate(element => {
  231. const wrapper = element.querySelector<HTMLElement>('.docx-wrapper')!
  232. const pageElement = element.querySelector<HTMLElement>('section.docx')!
  233. const article = pageElement.querySelector<HTMLElement>('article')!
  234. const table = article.querySelector<HTMLElement>('table')!
  235. const officeRect = element.getBoundingClientRect()
  236. const pageRect = pageElement.getBoundingClientRect()
  237. const officeStyle = getComputedStyle(element)
  238. const wrapperStyle = getComputedStyle(wrapper)
  239. const articleStyle = getComputedStyle(article)
  240. return {
  241. officeLeft: officeRect.left,
  242. pageLeft: pageRect.left,
  243. pageWidth: pageRect.width,
  244. clientWidth: element.clientWidth,
  245. scrollWidth: element.scrollWidth,
  246. wrapperWidth: wrapper.getBoundingClientRect().width,
  247. articlePaddingTop: Number.parseFloat(articleStyle.paddingTop),
  248. articlePaddingLeft: Number.parseFloat(articleStyle.paddingLeft),
  249. articlePaddingRight: Number.parseFloat(articleStyle.paddingRight),
  250. tableLeft: table.getBoundingClientRect().left,
  251. tableRight: table.getBoundingClientRect().right,
  252. officeBackground: officeStyle.backgroundColor,
  253. wrapperBackground: wrapperStyle.backgroundColor,
  254. wrapperPaddingTop: Number.parseFloat(wrapperStyle.paddingTop),
  255. wrapperPaddingLeft: Number.parseFloat(wrapperStyle.paddingLeft),
  256. wrapperPaddingRight: Number.parseFloat(wrapperStyle.paddingRight),
  257. }
  258. })
  259. expect(geometry.pageWidth).toBeLessThanOrEqual(geometry.clientWidth)
  260. expect(geometry.pageLeft).toBeGreaterThanOrEqual(geometry.officeLeft)
  261. expect(geometry.scrollWidth).toBeLessThanOrEqual(geometry.clientWidth + 1)
  262. expect(Math.abs(geometry.wrapperWidth - geometry.clientWidth)).toBeLessThan(1)
  263. expect(geometry.articlePaddingTop).toBe(36)
  264. expect(geometry.articlePaddingLeft).toBe(36)
  265. expect(geometry.articlePaddingRight).toBe(36)
  266. expect(geometry.tableLeft).toBeGreaterThanOrEqual(geometry.pageLeft - 1)
  267. expect(geometry.tableRight).toBeLessThanOrEqual(geometry.pageLeft + geometry.pageWidth + 1)
  268. expect(geometry.officeBackground).toBe('rgb(255, 255, 255)')
  269. expect(geometry.wrapperBackground).toBe('rgb(255, 255, 255)')
  270. expect(geometry.wrapperPaddingTop).toBe(0)
  271. expect(geometry.wrapperPaddingLeft).toBe(0)
  272. expect(geometry.wrapperPaddingRight).toBe(0)
  273. await page.setViewportSize({ width: 930, height: 760 })
  274. const centered = await office.evaluate(element => {
  275. const pageElement = element.querySelector<HTMLElement>('section.docx')!
  276. const officeRect = element.getBoundingClientRect()
  277. const pageRect = pageElement.getBoundingClientRect()
  278. return {
  279. pageWidth: pageRect.width,
  280. clientWidth: element.clientWidth,
  281. leftGap: pageRect.left - officeRect.left,
  282. rightGap: officeRect.right - pageRect.right,
  283. }
  284. })
  285. expect(centered.pageWidth).toBeLessThan(centered.clientWidth)
  286. expect(centered.leftGap).toBeGreaterThanOrEqual(18)
  287. expect(centered.rightGap).toBeGreaterThanOrEqual(18)
  288. expect(Math.abs(centered.leftGap - centered.rightGap)).toBeLessThanOrEqual(12)
  289. })
  290. test('keeps pins first and loads the next session page at the list bottom', async ({ page }) => {
  291. const sidebar = page.locator('.desktop-sidebar')
  292. const items = sidebar.locator('.sidebar-list [role="option"]')
  293. await expect(items).toHaveCount(100)
  294. await expect(items.first()).toContainText('夭夭 Web 验收会话')
  295. await expect(sidebar.getByRole('button', { name: '继续加载会话' })).toBeVisible()
  296. const list = sidebar.locator('.sidebar-list')
  297. await list.evaluate(element => {
  298. element.scrollTop = element.scrollHeight
  299. element.dispatchEvent(new Event('scroll'))
  300. })
  301. await expect(items).toHaveCount(103)
  302. await expect(sidebar.getByRole('button', { name: '继续加载会话' })).toHaveCount(0)
  303. })
  304. test('switches the composer model to the selected historical session model', async ({ page }) => {
  305. await page.goto('/chat/session-demo?profile=yaoyao')
  306. await expect(page.locator('.composer-tool--model')).toContainText('gpt-5.6')
  307. await page.getByRole('option', { name: /第二个会话/ }).click()
  308. await expect(page.locator('.composer-tool--model')).toContainText('gpt-5.5')
  309. })
  310. test('restores a routed conversation even when unread-count refresh fails', async ({ page }) => {
  311. await page.route('**/api/app/sessions/unread*', async route => {
  312. await route.fulfill({ status: 503, contentType: 'application/json', body: JSON.stringify({ error: 'unread unavailable' }) })
  313. })
  314. await page.goto('/chat/session-demo')
  315. await expect(page.getByText('已整理完成。下面是', { exact: false })).toBeVisible()
  316. await page.reload()
  317. await expect(page.getByText('已整理完成。下面是', { exact: false })).toBeVisible()
  318. })
  319. test('opens a conversation even when marking it read is unsupported', async ({ page }) => {
  320. const pageErrors: string[] = []
  321. page.on('pageerror', error => pageErrors.push(error.message))
  322. await page.route('**/api/app/sessions/unread/*', async route => {
  323. await route.fulfill({ status: 405, contentType: 'application/json', body: JSON.stringify({ error: 'Method Not Allowed' }) })
  324. })
  325. await page.getByRole('option').filter({ hasText: '第二个会话' }).click()
  326. await expect(page).toHaveURL(/\/chat\/session-second\?profile=yaoyao/)
  327. await expect(page.getByText('已整理完成。下面是', { exact: false })).toBeVisible()
  328. expect(pageErrors).toEqual([])
  329. })
  330. test('syncs the blue fast-mode shortcut with the iOS-compatible session config', async ({ page }) => {
  331. await page.request.post('http://127.0.0.1:19119/__test/rpc-requests/reset')
  332. await page.goto('/chat/session-demo')
  333. const fast = page.getByRole('button', { name: '快速模式:已关闭' })
  334. await expect(fast).toHaveAttribute('aria-pressed', 'false')
  335. await fast.click()
  336. const enabled = page.getByRole('button', { name: '快速模式:已开启' })
  337. await expect(enabled).toHaveAttribute('aria-pressed', 'true')
  338. await expect(enabled).toHaveCSS('color', 'rgb(22, 119, 255)')
  339. await page.getByRole('textbox', { name: '输入消息,Enter 发送,Shift + Enter 换行' }).fill('使用快速模式')
  340. await page.getByRole('button', { name: '发送消息' }).click()
  341. await expect(page.getByText('这是来自假 Gateway 的流式回复。', { exact: true })).toBeVisible()
  342. 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> }> }
  343. const fastConfigIndex = payload.requests.findIndex(request => request.method === 'config.set' && request.params.key === 'fast')
  344. const promptIndex = payload.requests.findIndex(request => request.method === 'prompt.submit')
  345. expect(fastConfigIndex).toBeGreaterThanOrEqual(0)
  346. expect(promptIndex).toBeGreaterThan(fastConfigIndex)
  347. expect(payload.requests[fastConfigIndex]?.params).toMatchObject({ key: 'fast', value: 'fast', scope: 'session' })
  348. await enabled.click()
  349. await expect(page.getByRole('button', { name: '快速模式:已关闭' })).toHaveAttribute('aria-pressed', 'false')
  350. await expect.poll(async () => {
  351. const next = await (await page.request.get('http://127.0.0.1:19119/__test/rpc-requests')).json() as typeof payload
  352. return next.requests.filter(request => request.method === 'config.set' && request.params.key === 'fast').at(-1)?.params.value
  353. }).toBe('normal')
  354. })
  355. test('reconciles an iOS fast-mode selection from the resumed 9119 session', async ({ page }) => {
  356. await page.request.post('http://127.0.0.1:19119/__test/rpc-requests/reset')
  357. await page.goto('/chat/session-yaoer?profile=yaoer')
  358. await expect(page.getByRole('button', { name: '快速模式:已关闭' })).toBeVisible()
  359. await page.getByRole('textbox', { name: '输入消息,Enter 发送,Shift + Enter 换行' }).fill('读取 iOS 快速模式')
  360. await page.getByRole('button', { name: '发送消息' }).click()
  361. await expect(page.getByRole('button', { name: '快速模式:已开启' })).toHaveCSS('color', 'rgb(22, 119, 255)')
  362. 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> }> }
  363. expect(payload.requests.some(request => request.method === 'session.resume' && request.params.session_id === 'session-yaoer')).toBe(true)
  364. expect(payload.requests.some(request => request.method === 'config.set' && request.params.key === 'fast')).toBe(false)
  365. })
  366. test('keeps the show-thinking preference across sessions of the same Agent', async ({ page }) => {
  367. await page.goto('/chat/session-demo')
  368. await expect(page.locator('.turn-trace')).toHaveCount(1)
  369. await page.locator('.composer-tool[aria-label="设置"]').click()
  370. const setting = page.getByRole('switch', { name: /显示思考/ })
  371. await expect(setting).toHaveAttribute('aria-checked', 'true')
  372. await setting.click()
  373. await expect(page.locator('.turn-trace')).toHaveCount(0)
  374. await page.getByRole('option').filter({ hasText: '第二个会话' }).click()
  375. await expect(page.locator('.turn-trace')).toHaveCount(0)
  376. await page.locator('.composer-tool[aria-label="设置"]').click()
  377. await page.getByRole('switch', { name: /显示思考/ }).click()
  378. await expect(page.locator('.turn-trace')).toHaveCount(1)
  379. })
  380. test('restores a legacy session link under its owning Agent profile', async ({ page }) => {
  381. await page.goto('/chat/session-yaoer')
  382. await expect(page.getByText('瑶儿历史消息', { exact: true })).toBeVisible()
  383. await expect(page).toHaveURL(/\/chat\/session-yaoer\?profile=yaoer/)
  384. await page.reload()
  385. await expect(page.getByText('瑶儿历史消息', { exact: true })).toBeVisible()
  386. })
  387. test('renders historical assistant MEDIA as Markdown in chat and group chat', async ({ page }) => {
  388. await page.goto('/chat/session-demo')
  389. const image = page.locator('.markdown img[alt="夭夭 Logo"]')
  390. await expect(image).toBeVisible()
  391. await image.click()
  392. const mediaDialog = page.getByRole('dialog', { name: /预览 AppIcon-1024.png/ })
  393. await expect(mediaDialog).toBeVisible()
  394. await expect(mediaDialog.getByRole('button', { name: '下一张媒体' })).toBeVisible()
  395. await mediaDialog.getByRole('button', { name: '下一张媒体' }).click()
  396. await expect(mediaDialog.locator('img')).toHaveAttribute('src', /variant=2/)
  397. await page.keyboard.press('ArrowLeft')
  398. await expect(mediaDialog.locator('img')).not.toHaveAttribute('src', /variant=2/)
  399. await expect(mediaDialog.getByRole('link', { name: /下载 AppIcon-1024\.png/ })).toBeVisible()
  400. await page.keyboard.press('Escape')
  401. await expect(page.getByRole('dialog', { name: /预览 AppIcon-1024.png/ })).toBeHidden()
  402. await image.click()
  403. const reopenedMediaDialog = page.getByRole('dialog', { name: /预览 AppIcon-1024.png/ })
  404. await reopenedMediaDialog.getByRole('button', { name: '添加到聊天' }).click()
  405. await expect(reopenedMediaDialog).toBeHidden()
  406. await expect(page.locator('.composer-attachments img[alt="AppIcon-1024.png"]')).toBeVisible()
  407. await page.getByRole('button', { name: '群聊' }).click()
  408. await expect(page.locator('.markdown img[alt="AppIcon-1024.png"]')).toBeVisible()
  409. })
  410. test('renders persisted user file markers as attachment cards', async ({ page }) => {
  411. await page.goto('/chat/session-demo?profile=yaoyao')
  412. const userMessage = page.locator('[data-message-id="message-user-file"]')
  413. await expect(userMessage).toContainText('查看附件')
  414. await expect(userMessage.getByRole('button', { name: /测试报告\.docx/ })).toBeVisible()
  415. await expect(userMessage).not.toContainText('@file:')
  416. await expect(userMessage).not.toContainText('用户附加文件')
  417. })
  418. test('renders persisted user image markers as direct images instead of file cards', async ({ page }) => {
  419. await page.goto('/chat/session-demo?profile=yaoyao')
  420. const userMessage = page.locator('[data-message-id="message-user-image"]')
  421. const imageAttachment = userMessage.locator('.message__attachment--image')
  422. await expect(imageAttachment).toBeVisible()
  423. await expect(imageAttachment.locator('img[alt="测试图片.png"]')).toBeVisible()
  424. await expect(imageAttachment.locator('strong')).toHaveCount(0)
  425. await expect(imageAttachment).toHaveCSS('background-color', 'rgba(0, 0, 0, 0)')
  426. await expect(userMessage).not.toContainText('@image:')
  427. await expect(userMessage).not.toContainText('[screenshot]')
  428. await imageAttachment.click()
  429. await expect(page.getByRole('dialog', { name: '预览 测试图片.png' })).toBeVisible()
  430. })
  431. test('folds tool result rows into their expandable tool call', async ({ page }) => {
  432. await page.goto('/chat/session-demo')
  433. const trace = page.locator('.turn-trace').first()
  434. await expect(trace).not.toHaveAttribute('open', '')
  435. await expect(trace.locator('summary')).toContainText('思考与工具')
  436. await expect(trace.locator('summary')).toContainText('2 段思考 · 2 个工具')
  437. await trace.locator('summary').click()
  438. await expect(trace.locator('.turn-trace__reasoning')).toHaveCount(2)
  439. await expect(trace.locator('.tool-trace')).toHaveCount(2)
  440. await expect(trace.locator('.tool-trace__details')).toHaveCount(2)
  441. await expect(trace.locator('.tool-trace__details').filter({ hasText: '/tmp/demo-report.pdf' })).toBeVisible()
  442. await expect(page.locator('[data-message-id="message-tool-call"]')).toHaveCount(0)
  443. await expect(page.locator('.message--tool')).toHaveCount(0)
  444. })
  445. test('renders subtask completion as a collapsed timeline event', async ({ page }) => {
  446. await page.goto('/chat/session-demo')
  447. await expect(page.getByText('子任务已完成', { exact: true })).toBeVisible()
  448. const delegation = page.locator('.delegation-event').filter({ hasText: '子任务已完成' })
  449. await expect(delegation).toContainText('2 个子任务 · 2 已完成')
  450. await expect(delegation).not.toHaveAttribute('open', '')
  451. })
  452. test('renders context compaction as a collapsed timeline event', async ({ page }) => {
  453. await page.goto('/chat/session-demo')
  454. const compaction = page.locator('[data-message-id="message-compaction"] .compaction-event')
  455. await expect(compaction).toContainText('上下文已压缩')
  456. await expect(compaction).toContainText('压缩摘要已归档 · 点击查看')
  457. await expect(compaction).not.toHaveAttribute('open', '')
  458. await expect(compaction.getByText('Historical Task Snapshot', { exact: true })).toBeHidden()
  459. await compaction.locator('summary').click()
  460. await expect(compaction.getByText('Historical Task Snapshot', { exact: true })).toBeVisible()
  461. await expect(page.locator('[data-message-id="message-compaction"]')).toHaveClass(/message--system/)
  462. })
  463. test('renders model changes as a collapsed system event', async ({ page }) => {
  464. await page.goto('/chat/session-demo')
  465. await expect(page.getByText('模型已切换:gpt-5.6-terra', { exact: true })).toBeVisible()
  466. await expect(page.locator('.system-event')).not.toHaveAttribute('open', '')
  467. })
  468. test('opens a local message file link as a floating preview card', async ({ page }) => {
  469. await page.route('**/Users/samien/Agents/%E6%96%B9%E6%A1%88%E8%8D%89%E7%A8%BF.md', route => route.fulfill({
  470. status: 200,
  471. contentType: 'text/markdown',
  472. body: '# 会话文件\n\n这是会话中的文本文件。',
  473. }))
  474. await page.goto('/chat/session-demo')
  475. const card = page.getByRole('link', { name: '预览文件 方案草稿.md' })
  476. await expect(card).toHaveClass(/file-link-card/)
  477. await card.click()
  478. const dialog = page.getByRole('dialog', { name: '预览 方案草稿.md' })
  479. await expect(dialog).toBeVisible()
  480. await expect(dialog.locator('.preview-text')).toBeVisible()
  481. const textPadding = await dialog.locator('.preview-text').evaluate(element => {
  482. const style = getComputedStyle(element)
  483. return { left: Number.parseFloat(style.paddingLeft), right: Number.parseFloat(style.paddingRight) }
  484. })
  485. expect(textPadding.left).toBeGreaterThanOrEqual(24)
  486. expect(textPadding.right).toBeGreaterThanOrEqual(24)
  487. const stageHeight = await dialog.locator('.preview-stage').evaluate(stage => stage.getBoundingClientRect().height)
  488. expect(stageHeight).toBeGreaterThan(500)
  489. })
  490. test('shows a thinking animation after submit until output starts', async ({ page }) => {
  491. await page.goto('/chat/session-demo?profile=yaoyao')
  492. await page.locator('.composer-textarea').fill('请开始思考')
  493. await page.getByRole('button', { name: '发送消息' }).click()
  494. await expect(page.locator('.thinking-indicator')).toBeVisible()
  495. await expect(page.getByText('这是来自假 Gateway 的流式回复。', { exact: true })).toBeVisible()
  496. await expect(page.locator('.thinking-indicator')).toHaveCount(0)
  497. })
  498. test('keeps the canonical logo and yaoyao-webui composer geometry', async ({ page }) => {
  499. const logo = page.locator('.rail__brand img')
  500. await expect(logo).toHaveAttribute('src', '/brand/AppIcon-1024.png')
  501. const emptyLogo = page.locator('.new-chat-empty__logo')
  502. await expect(emptyLogo).toHaveAttribute('src', '/brand/AppIcon-1024.png')
  503. await expect(page.getByText('聊点什么', { exact: true })).toBeVisible()
  504. await expect(page.locator('.timeline-header')).toHaveClass(/timeline-header--transparent/)
  505. await expect(page.locator('.composer-context')).toContainText('剩余 256.0k')
  506. await page.getByRole('button', { name: '推理强度:默认' }).click()
  507. await expect(page.locator('.composer-popover--reasoning')).toBeVisible()
  508. await page.getByRole('button', { name: '设置' }).click()
  509. await expect(page.locator('.composer-popover--settings')).toBeVisible()
  510. await expect(page.getByText('语音输入设置', { exact: true })).toBeVisible()
  511. await page.locator('.composer-shell').click()
  512. await page.getByRole('option').first().click()
  513. await expect(page.locator('.timeline')).toHaveCSS('background-color', 'rgb(255, 255, 255)')
  514. await expect(page.locator('.message--assistant .message__avatar')).toHaveCount(0)
  515. await expect(page.locator('.message--assistant .message__meta')).toHaveCount(0)
  516. const assistantMessage = page.locator('.message--assistant-anonymous:not(.message--tool-only)').first()
  517. await page.mouse.move(1200, 20)
  518. await expect(assistantMessage.locator('.message__actions')).toHaveCSS('opacity', '0')
  519. await assistantMessage.hover()
  520. await expect(assistantMessage.locator('.message__actions')).toHaveCSS('opacity', '1')
  521. await expect(page.locator('.message--tool-only .message__actions')).toHaveCount(0)
  522. await expect(page.locator('[data-message-id="message-thinking-tool"]')).toHaveCount(0)
  523. await expect(page.locator('.turn-trace')).toHaveCount(1)
  524. const userMessageMeta = page.locator('.message--user .message__meta')
  525. await expect(userMessageMeta).not.toHaveCount(0)
  526. expect(await userMessageMeta.evaluateAll(elements => elements.every(element => getComputedStyle(element).display === 'none'))).toBe(true)
  527. await expect(page.getByRole('button', { name: '会话操作' })).toBeVisible()
  528. await page.getByRole('button', { name: '会话操作' }).click()
  529. const sessionMenu = page.getByRole('menu', { name: '会话操作' })
  530. await expect(sessionMenu.getByText('会话大纲', { exact: true })).toBeVisible()
  531. await sessionMenu.getByText('会话大纲', { exact: true }).click()
  532. const outline = page.getByRole('navigation', { name: '会话大纲' })
  533. await expect(outline).toBeVisible()
  534. await expect(outline.getByText('请检查今天生成的产物。MEDIA:/brand/AppIcon-1024.png', { exact: true })).toBeVisible()
  535. await expect(outline.getByText('验收摘要', { exact: true })).toBeVisible()
  536. await outline.getByRole('button', { name: '跳转到 验收摘要' }).click()
  537. await expect(page.locator('[data-message-id="message-assistant"]')).toHaveClass(/message--revealed/)
  538. await page.getByRole('button', { name: '关闭会话大纲' }).click()
  539. await expect(outline).toBeHidden()
  540. await page.getByRole('button', { name: '会话操作' }).click()
  541. await expect(sessionMenu.getByText('取消置顶', { exact: true })).toBeVisible()
  542. const unpinIcon = sessionMenu.getByRole('menuitem', { name: '取消置顶' }).locator('.app-icon')
  543. await expect(unpinIcon.locator('path')).toHaveCount(2)
  544. await expect(unpinIcon.locator('path').last()).toHaveAttribute('d', 'M4 4l16 16')
  545. await expect(page.locator('.desktop-sidebar .sidebar-item--single-line').first().locator('.app-icon path')).toHaveAttribute('fill', 'currentColor')
  546. await expect(sessionMenu.getByText('重命名', { exact: true })).toBeVisible()
  547. await expect(sessionMenu.getByText('删除会话', { exact: true })).toBeVisible()
  548. await expect(page.getByText('置顶会话', { exact: true })).toHaveCount(0)
  549. const menuBox = await sessionMenu.evaluate(element => element.getBoundingClientRect().toJSON())
  550. expect(menuBox.width).toBeLessThanOrEqual(220)
  551. expect(menuBox.height).toBeLessThan(165)
  552. await expect(page.locator('.session-action-layer')).toHaveCount(0)
  553. await sessionMenu.getByText('取消置顶', { exact: true }).click()
  554. await expect(page.locator('.desktop-sidebar').getByText('已置顶 1', { exact: true })).toHaveCount(0)
  555. await page.getByRole('button', { name: '会话操作' }).click()
  556. await sessionMenu.getByText('置顶会话', { exact: true }).click()
  557. await expect(page.locator('.desktop-sidebar').getByText('已置顶 1', { exact: true })).toBeVisible()
  558. const compactSession = page.locator('.desktop-sidebar .sidebar-item--single-line').first()
  559. const compactMetrics = await compactSession.evaluate(element => {
  560. const title = element.querySelector('strong')
  561. return {
  562. height: element.getBoundingClientRect().height,
  563. weight: title ? Number(getComputedStyle(title).fontWeight) : 0,
  564. }
  565. })
  566. expect(compactMetrics.height).toBeLessThanOrEqual(31)
  567. expect(compactMetrics.weight).toBeLessThan(500)
  568. await compactSession.click({ button: 'right' })
  569. await expect(sessionMenu).toBeVisible()
  570. await page.keyboard.press('Escape')
  571. const composer = page.locator('.composer-shell')
  572. await expect(composer).toBeVisible()
  573. const geometry = await composer.evaluate(element => {
  574. const rect = element.getBoundingClientRect()
  575. const style = getComputedStyle(element)
  576. return { width: rect.width, minHeight: style.minHeight, radius: style.borderRadius }
  577. })
  578. expect(geometry.width).toBeLessThanOrEqual(760)
  579. expect(geometry.minHeight).toBe('72px')
  580. expect(geometry.radius).toBe('18px')
  581. const send = page.getByRole('button', { name: '发送消息' })
  582. await expect(send).toHaveCSS('width', '34px')
  583. await expect(send).toHaveCSS('height', '34px')
  584. })
  585. test('uses the unified Grok-style sidebar, search trigger, and persistent collapse', async ({ page }) => {
  586. const sidebar = page.locator('.desktop-sidebar')
  587. await expect(sidebar).toBeVisible()
  588. await expect(sidebar).toHaveCSS('width', '264px')
  589. await expect(sidebar.locator('.brand-mark__name')).toHaveCount(0)
  590. await expect(sidebar.locator('.profile-switcher')).toHaveCount(0)
  591. await expect(sidebar.locator('.sidebar-account-switcher')).toHaveCount(1)
  592. await expect(page.getByRole('button', { name: '搜索', exact: true })).toBeVisible()
  593. await expect(page.getByRole('button', { name: '新建聊天', exact: true })).toBeVisible()
  594. await expect(page.getByRole('button', { name: '新建聊天', exact: true })).toHaveCSS('background-color', 'rgba(0, 0, 0, 0)')
  595. await expect(page.getByRole('button', { name: '新建聊天', exact: true })).toHaveCSS('font-weight', '580')
  596. await expect(sidebar.getByText('历史记录', { exact: true })).toBeVisible()
  597. const searchTrigger = page.getByRole('button', { name: '搜索', exact: true })
  598. const triggerBox = await searchTrigger.boundingBox()
  599. await searchTrigger.click()
  600. const search = page.getByPlaceholder('搜索会话').filter({ visible: true })
  601. await expect(search).toBeVisible()
  602. await page.waitForTimeout(150)
  603. const inputBox = await search.evaluate(element => {
  604. const rect = element.closest('label')?.getBoundingClientRect()
  605. return rect ? { y: rect.y, height: rect.height } : null
  606. })
  607. expect(inputBox?.y).toBe(triggerBox?.y)
  608. expect(inputBox?.height).toBe(triggerBox?.height)
  609. await search.fill('验收')
  610. await expect(page.getByRole('option', { name: /夭夭 Web 验收会话/ })).toBeVisible()
  611. await search.press('Escape')
  612. await expect(search).toBeHidden()
  613. await expect(searchTrigger).toBeVisible()
  614. await expect(searchTrigger).toHaveAttribute('aria-expanded', 'false')
  615. await page.getByRole('button', { name: '折叠侧边栏' }).click()
  616. await expect(sidebar).toHaveCSS('width', '68px')
  617. const collapseBox = await page.getByRole('button', { name: '展开侧边栏' }).boundingBox()
  618. const accountBox = await sidebar.locator('.sidebar-account-switcher__main').boundingBox()
  619. expect(collapseBox?.y).toBeLessThan(accountBox?.y ?? 0)
  620. await expect(sidebar.getByText('历史记录', { exact: true })).toBeHidden()
  621. await expect(page.getByRole('button', { name: '搜索', exact: true })).toBeVisible()
  622. await expect(page.getByRole('button', { name: '新建聊天', exact: true })).toBeVisible()
  623. await page.reload()
  624. await expect(sidebar).toHaveCSS('width', '68px')
  625. await page.getByRole('button', { name: '搜索', exact: true }).click()
  626. await expect(sidebar).toHaveCSS('width', '264px')
  627. await expect(page.getByPlaceholder('搜索会话').filter({ visible: true })).toBeVisible()
  628. })
  629. test('uses the mobile composer and keeps the closed drawer inert', async ({ page }) => {
  630. await page.setViewportSize({ width: 390, height: 844 })
  631. await page.reload()
  632. await expect(page.getByRole('navigation')).not.toBeVisible()
  633. const drawer = page.locator('.mobile-drawer')
  634. await expect(drawer).toHaveAttribute('aria-hidden', 'true')
  635. await expect(drawer).toHaveAttribute('inert', '')
  636. await expect(page.locator('.composer-shell')).toHaveCSS('min-height', '118px')
  637. await expect(page.locator('.composer-textarea')).toHaveCSS('font-size', '16px')
  638. })