question-composer.spec.tsx 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270
  1. // @vitest-environment jsdom
  2. import { afterEach, describe, expect, it, vi } from 'vitest'
  3. import { cleanup, fireEvent, render, screen } from '@testing-library/react'
  4. import type {
  5. ConversationSnapshot, SessionId, SessionListState, WorkspaceListState,
  6. } from '@deepseek-ai/dsh-client-runtime/client'
  7. import { PendingWait } from '@deepseek-ai/dsh-client-runtime/client'
  8. import type { RpcReceipt } from '@deepseek-ai/dsh-client-connection/client'
  9. import { RpcId } from '@deepseek-ai/dsh-client-connection/client'
  10. import type { SnapshotSelectorHook } from '@deepseek-ai/dsh-client-ui-slots'
  11. import { PendingQuestion } from '../src/client/contract/slots.ts'
  12. import {
  13. QuestionComposer, parseQuestionTitle, parseRecommendedLabel,
  14. } from '../src/client/QuestionComposer.tsx'
  15. afterEach(cleanup)
  16. const SID = 's1' as SessionId
  17. /** Framework standard-kit stubs: the composer consumes none of them, the
  18. * composed props type mandates their delivery (framework hooks are plain
  19. * stubs per the client testing discipline). */
  20. const kit = {
  21. sessionId: SID,
  22. useSession: (() => { throw new Error('unused') }) as unknown as SnapshotSelectorHook<ConversationSnapshot>,
  23. useSessions: (() => { throw new Error('unused') }) as unknown as SnapshotSelectorHook<SessionListState>,
  24. useWorkspaces: (() => { throw new Error('unused') }) as unknown as SnapshotSelectorHook<WorkspaceListState>,
  25. useInput: (() => { throw new Error('unused') }) as never,
  26. inputActions: { setDraft: () => { throw new Error('unused') }, submit: () => { throw new Error('unused') } } as never,
  27. }
  28. const QUESTIONS = [
  29. {
  30. id: 'profile', header: '偏好', question: '选择候选人类型',
  31. detail: '按当前空缺岗位的优先级选择。',
  32. options: [
  33. { label: '工程落地型 (Recommended)', description: '优先工程交付。' },
  34. { label: '研究潜力型', description: '优先研究能力。' },
  35. ],
  36. },
  37. {
  38. id: 'detail', question: '补充你的要求',
  39. },
  40. {
  41. id: 'signals', question: '选择重要信号(可多选)', multiSelect: true,
  42. options: [{ label: '系统设计' }, { label: '代码质量' }, { label: '产品判断' }],
  43. },
  44. ]
  45. /** Carrier fixture: a real PendingWait over a scripted respond carrier. */
  46. function wait(rpcId = 'question-1', respond = vi.fn(() => Promise.resolve<RpcReceipt>({ accepted: true }))) {
  47. const carrier = new PendingWait(
  48. 'question', RpcId(rpcId), SID, { questions: QUESTIONS }, respond)
  49. return { carrier, respond }
  50. }
  51. /** The client-response envelope respond must have received for an answer batch. */
  52. function answeredEnvelope(rpcId: string, answers: object[]) {
  53. return {
  54. type: 'client-response', rpcId: RpcId(rpcId),
  55. result: { ok: true, value: { sessionId: SID, answer: { answers } } },
  56. }
  57. }
  58. describe('QuestionComposer', () => {
  59. it('collects single, custom, and multi-select answers before one batch submit', () => {
  60. const { carrier, respond } = wait()
  61. render(<QuestionComposer matched={carrier} interactions={[carrier]} {...kit} />)
  62. expect(screen.getByText('1 / 3')).toBeTruthy()
  63. expect(screen.getByText('推荐')).toBeTruthy()
  64. expect(screen.getByText('工程落地型')).toBeTruthy()
  65. expect(screen.getByText('按当前空缺岗位的优先级选择。')).toBeTruthy()
  66. fireEvent.keyDown(screen.getByRole('radio', { name: /工程落地型/ }), { key: 'Enter' })
  67. expect(respond).not.toHaveBeenCalled()
  68. fireEvent.click(screen.getByRole('radio', { name: /工程落地型/ }))
  69. expect(screen.getByText('2 / 3')).toBeTruthy()
  70. // detail is per-question: the second question carries none.
  71. expect(screen.queryByText('按当前空缺岗位的优先级选择。')).toBeNull()
  72. expect(screen.queryByRole('button', { name: '填写答案' })).toBeNull()
  73. const custom = screen.getByPlaceholderText('输入你的答案')
  74. fireEvent.change(custom, { target: { value: '要能独立排查线上问题' } })
  75. fireEvent.keyDown(custom, { key: 'Enter' })
  76. expect(screen.getByText('3 / 3')).toBeTruthy()
  77. expect(screen.getByText('选择重要信号')).toBeTruthy()
  78. expect(screen.getByText('可多选')).toBeTruthy()
  79. expect(screen.queryByText('(可多选)')).toBeNull()
  80. fireEvent.click(screen.getByRole('checkbox', { name: '系统设计' }))
  81. fireEvent.click(screen.getByRole('checkbox', { name: '系统设计' }))
  82. fireEvent.click(screen.getByRole('checkbox', { name: '系统设计' }))
  83. fireEvent.click(screen.getByRole('checkbox', { name: '代码质量' }))
  84. fireEvent.keyDown(screen.getByRole('checkbox', { name: '代码质量' }), { key: 'Enter' })
  85. // The domain face encoded the whole batch into one carrier envelope.
  86. expect(respond).toHaveBeenCalledWith(answeredEnvelope('question-1', [
  87. { id: 'profile', selected: ['工程落地型 (Recommended)'] },
  88. { id: 'detail', selected: [], custom: '要能独立排查线上问题' },
  89. { id: 'signals', selected: ['系统设计', '代码质量'] },
  90. ]))
  91. expect(screen.getByRole<HTMLButtonElement>('button', { name: '正在提交…' }).disabled).toBe(true)
  92. })
  93. it('skips individual questions without discarding earlier answers', () => {
  94. const { carrier, respond } = wait()
  95. render(<QuestionComposer matched={carrier} interactions={[carrier]} {...kit} />)
  96. expect((screen.getByText('下一题').closest('button') as HTMLButtonElement).disabled).toBe(true)
  97. fireEvent.click(screen.getByRole('radio', { name: '研究潜力型' }))
  98. expect(screen.getByText('2 / 3')).toBeTruthy()
  99. fireEvent.click(screen.getByRole('button', { name: '跳过本题' }))
  100. expect(screen.getByText('3 / 3')).toBeTruthy()
  101. fireEvent.click(screen.getByRole('button', { name: '跳过本题' }))
  102. expect(respond).toHaveBeenCalledWith(answeredEnvelope('question-1', [
  103. { id: 'profile', selected: ['研究潜力型'] },
  104. { id: 'detail', selected: [] },
  105. { id: 'signals', selected: [] },
  106. ]))
  107. })
  108. it('keeps IME Enter inside the custom input until composition finishes', () => {
  109. const { carrier, respond } = wait()
  110. render(<QuestionComposer matched={carrier} interactions={[carrier]} {...kit} />)
  111. fireEvent.click(screen.getByRole('radio', { name: '研究潜力型' }))
  112. const custom = screen.getByPlaceholderText('输入你的答案')
  113. fireEvent.change(custom, { target: { value: '中文输入' } })
  114. fireEvent.keyDown(custom, { key: 'Enter', isComposing: true })
  115. expect(screen.getByText('2 / 3')).toBeTruthy()
  116. expect(respond).not.toHaveBeenCalled()
  117. fireEvent.keyDown(custom, { key: 'Enter', keyCode: 229 })
  118. expect(screen.getByText('2 / 3')).toBeTruthy()
  119. expect(respond).not.toHaveBeenCalled()
  120. fireEvent.keyDown(custom, { key: 'Enter' })
  121. expect(screen.getByText('3 / 3')).toBeTruthy()
  122. })
  123. it('opens custom input, reports missing skipped answers, and supports header navigation', () => {
  124. const { carrier, respond } = wait()
  125. render(<QuestionComposer matched={carrier} interactions={[carrier]} {...kit} />)
  126. fireEvent.click(screen.getByRole('button', { name: '其他,请填写自定义答案' }))
  127. expect(screen.getByPlaceholderText('输入你的答案')).toBeTruthy()
  128. fireEvent.click(screen.getByRole('radio', { name: '工程落地型' }))
  129. const emptyCustom = screen.getByPlaceholderText('输入你的答案')
  130. fireEvent.keyDown(emptyCustom, { key: 'Enter', shiftKey: true })
  131. expect(screen.getByText('2 / 3')).toBeTruthy()
  132. fireEvent.keyDown(emptyCustom, { key: 'Enter' })
  133. expect(screen.getByText('请选择一个选项或填写自定义答案。')).toBeTruthy()
  134. fireEvent.click(screen.getByLabelText('下一题'))
  135. fireEvent.click(screen.getByRole('checkbox', { name: '产品判断' }))
  136. fireEvent.click(screen.getByRole('button', { name: '提交' }))
  137. expect(screen.getByText('请先完成这道问题。')).toBeTruthy()
  138. expect(screen.getByText('2 / 3')).toBeTruthy()
  139. fireEvent.click(screen.getByLabelText('上一题'))
  140. expect(screen.getByText('1 / 3')).toBeTruthy()
  141. expect(respond).not.toHaveBeenCalled()
  142. })
  143. it('surfaces cancellation failures: rejected receipt text and raw transport reasons', async () => {
  144. const respond = vi.fn()
  145. .mockResolvedValueOnce({ accepted: false, reason: 'bad-response' })
  146. .mockRejectedValueOnce(new Error('第二次取消失败'))
  147. const { carrier } = wait('question-1', respond)
  148. render(<QuestionComposer matched={carrier} interactions={[carrier]} {...kit} />)
  149. // Receipt rejection surfaces through the domain face's thrown message.
  150. fireEvent.click(screen.getByRole('button', { name: '放弃整组问题' }))
  151. expect(await screen.findByText('question cancellation rejected: bad-response')).toBeTruthy()
  152. expect(screen.getByRole<HTMLButtonElement>('button', { name: '跳过本题' }).disabled).toBe(false)
  153. fireEvent.click(screen.getByRole('button', { name: '放弃整组问题' }))
  154. expect(await screen.findByText('第二次取消失败')).toBeTruthy()
  155. })
  156. it('surfaces transport rejection and resets local drafts for a different request', async () => {
  157. const respond = vi.fn()
  158. .mockRejectedValueOnce(new Error('网络中断'))
  159. .mockRejectedValueOnce('字符串错误')
  160. const first = wait('first', respond)
  161. const view = render(<QuestionComposer matched={first.carrier} interactions={[first.carrier]} {...kit} />)
  162. fireEvent.click(screen.getByRole('radio', { name: /研究潜力型/ }))
  163. expect(screen.getByText('2 / 3')).toBeTruthy()
  164. const second = wait('second', respond)
  165. view.rerender(<QuestionComposer matched={second.carrier} interactions={[second.carrier]} {...kit} />)
  166. expect(screen.getByRole('radio', { name: /研究潜力型/ }).getAttribute('aria-checked')).toBe('false')
  167. fireEvent.click(screen.getByRole('radio', { name: /工程落地型/ }))
  168. const custom = screen.getByPlaceholderText('输入你的答案')
  169. fireEvent.change(custom, { target: { value: 'x' } })
  170. fireEvent.keyDown(custom, { key: 'Enter' })
  171. fireEvent.click(screen.getByRole('checkbox', { name: '系统设计' }))
  172. fireEvent.click(screen.getByRole('button', { name: '提交' }))
  173. expect(await screen.findByText('网络中断')).toBeTruthy()
  174. expect(screen.getByRole<HTMLButtonElement>('button', { name: '提交' }).disabled).toBe(false)
  175. fireEvent.click(screen.getByRole('button', { name: '提交' }))
  176. expect(await screen.findByText('字符串错误')).toBeTruthy()
  177. })
  178. it('same-key carrier replacement (baseline replay) keeps drafts', () => {
  179. const first = wait('same-id')
  180. const view = render(<QuestionComposer matched={first.carrier} interactions={[first.carrier]} {...kit} />)
  181. fireEvent.click(screen.getByRole('radio', { name: /研究潜力型/ }))
  182. expect(screen.getByText('2 / 3')).toBeTruthy()
  183. // Replay mints a NEW carrier for the same request; same key = no remount.
  184. const replayed = wait('same-id')
  185. view.rerender(<QuestionComposer matched={replayed.carrier} interactions={[replayed.carrier]} {...kit} />)
  186. expect(screen.getByText('2 / 3')).toBeTruthy()
  187. })
  188. })
  189. describe('PendingQuestion domain face', () => {
  190. it('encodes the answer batch into the ok envelope and throws on a rejected receipt', async () => {
  191. const respond = vi.fn()
  192. .mockResolvedValueOnce({ accepted: true })
  193. .mockResolvedValueOnce({ accepted: false, reason: 'not-pending' })
  194. const question = new PendingQuestion(wait('rq', respond).carrier)
  195. const batch = { answers: [{ id: 'mode', selected: ['Fast'] }] }
  196. await expect(question.answer(batch)).resolves.toBeUndefined()
  197. expect(respond).toHaveBeenCalledWith(answeredEnvelope('rq', batch.answers))
  198. await expect(question.answer(batch)).rejects.toThrow(/question response rejected: not-pending/)
  199. })
  200. it('encodes cancellation as the cancelled error envelope and throws on a rejected receipt', async () => {
  201. const respond = vi.fn()
  202. .mockResolvedValueOnce({ accepted: true })
  203. .mockResolvedValueOnce({ accepted: false, reason: 'bad-response' })
  204. const question = new PendingQuestion(wait('rc', respond).carrier)
  205. await expect(question.cancel()).resolves.toBeUndefined()
  206. expect(respond).toHaveBeenCalledWith({
  207. type: 'client-response', rpcId: RpcId('rc'),
  208. result: {
  209. ok: false,
  210. error: { code: 'cancelled', message: 'the user closed this question request', details: {} },
  211. },
  212. })
  213. await expect(question.cancel()).rejects.toThrow(/question cancellation rejected: bad-response/)
  214. })
  215. it('forwards key and questions from the carrier', () => {
  216. const question = new PendingQuestion(wait('rk').carrier)
  217. expect(question.key).toBe('q:rk')
  218. expect(question.questions).toBe(wait('rk').carrier.payload.questions)
  219. })
  220. })
  221. describe('parseRecommendedLabel', () => {
  222. it('recognizes English and Chinese suffixes without changing ordinary labels', () => {
  223. expect(parseRecommendedLabel('Fast (Recommended)')).toEqual({ label: 'Fast', recommended: true })
  224. expect(parseRecommendedLabel('稳妥(推荐)')).toEqual({ label: '稳妥', recommended: true })
  225. expect(parseRecommendedLabel('稳妥 (推荐)')).toEqual({ label: '稳妥', recommended: true })
  226. expect(parseRecommendedLabel('Plain')).toEqual({ label: 'Plain', recommended: false })
  227. })
  228. })
  229. describe('parseQuestionTitle', () => {
  230. it('removes Chinese and ASCII multi-select suffixes', () => {
  231. expect(parseQuestionTitle('选择信号(可多选)')).toBe('选择信号')
  232. expect(parseQuestionTitle('选择信号 (可多选)')).toBe('选择信号')
  233. expect(parseQuestionTitle('选择信号')).toBe('选择信号')
  234. })
  235. })