☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
你是拥有6年react前端经验、主导过3个中大型项目测试体系建设的资深测试工程师，熟悉react 18.3 + jest 29.7 + @testing-library/react v14.2的实际陷阱。当前项目技术栈:[在此填写]。为以下react组件生成可直接运行的单元测试文件，要求：①覆盖渲染、用户交互、错误边界三类场景；②每个测试用例含明确的describe/it命名；③使用waitfor+screen.findby替代getby；④对useeffect/usecallback等hook做jest.mock隔离；⑤输出纯tsx代码，无注释、无console.log。
你需要为react组件快速生成符合jest+testing library规范的单元测试用例，但每次重写提示词都导致断言缺失、mock不全或覆盖率不达标——这不是模型能力问题，而是提示词缺乏工程化封装。
锁定测试边界与角色锚点
打开任意文本编辑器，新建第一行：「你是拥有6年React前端经验、主导过3个中大型项目测试体系建设的资深测试工程师，熟悉React 18.3 + Jest 29.7 + @testing-library/react v14.2的实际陷阱」。这句必须原样复制，不能缩写或改写，【若替换为“你很懂测试”之类模糊表述，模型将忽略act()包裹、fireEvent异步等待等关键约束】。
第二行留空，作为技术栈占位符：当前项目技术栈:[在此填写]。例如写表单组件测试时填“React 18.3 + Formik 3.0 + Zod 3.22”，写RSC组件时填“Next.js 14.2.5 + RSC + server actions”。
第三行起写任务动词链：「为以下React组件生成可直接运行的单元测试文件，要求：①覆盖渲染、用户交互、错误边界三类场景；②每个测试用例含明确的describe/it命名；③使用waitFor+screen.findBy*替代getBy*；④对useEffect/useCallback等Hook做jest.mock隔离；⑤输出纯TSX代码，无注释、无console.log」。
封装成三种即插即用工作流
方法一：VS Code快捷片段（推荐日常高频写作）
打开VS Code → Ctrl+Shift+P → 输入“Configure User Snippets” → 选择“New Global Snippets file” → 命名为test-prompt → 粘贴以下JSON：
{"test_react":{"prefix":"tr","body":["你是拥有6年React前端经验、主导过3个中大型项目测试体系建设的资深测试工程师，熟悉React 18.3 + Jest 29.7 + @testing-library/react v14.2的实际陷阱","当前项目技术栈:[在此填写]","为以下React组件生成可直接运行的单元测试文件，要求：①覆盖渲染、用户交互、错误边界三类场景；②每个测试用例含明确的describe/it命名；③使用waitFor+screen.findBy*替代getBy*；④对useEffect/useCallback等Hook做jest.mock隔离；⑤输出纯TSX代码，无注释、无console.log","```tsx","${1:组件代码}","```"]}}
方法二：命令行一键触发（适合CI/CD集成）
在项目根目录创建testgen.sh脚本，内容为curl调用OpenAI API，其中system消息严格按前述三行结构构造，user消息体为cat | sed 's/^/```tsx\n/; s/$/\n```/'。执行时传入组件路径：./testgen.sh src/components/Button.tsx。
用于在用户想通过浏览器自动化与 Google Gemini 或 ChatGPT 交互时。触发短语包括“ask Gemini”“ask ChatGPT”“ask GPT”“让...”。
方法三：LangChain PromptTemplate封装（适合团队统一治理）
用LangChain的PromptTemplate.from_template()加载模板字符串，template中预留{component_code}和{tech_stack}两个变量。调用时传入真实值，自动注入并校验字段完整性——【若tech_stack为空，模板拒绝渲染，防止生成脱离真实环境的测试】。
验证与容错机制
第一步：本地调试命令
执行npx jest --testPathPattern="Button.test.tsx" --coverage，确认输出含“PASS Button.test.tsx”且覆盖率≥85%。
第二步：检查三项硬性指标
① 所有fireEvent.click()前是否都有await waitFor(() => expect(...).toBeInTheDocument())；
② 是否存在未mock的第三方Hook调用（如useRouter、useSWR）；
③ describe块内是否混用同步断言（expect().toBe()）与异步断言（expect().resolves.toBe()）。
第三步：成本监控
在API请求头中添加X-Cost-Threshold: "1200"，当token预估超阈值时自动中断，避免生成冗长无效断言。
第四步：权限脱敏
若组件含敏感字段（如password、token），在输入前执行sed -i 's/const token = .*/const token = \"REDACTED\"/g' Button.tsx，确保测试代码不泄露凭证。
