RSS DEV 社区
关注
使用 MSW 在 Jest 和 React Query 的测试中模拟端点
直接在 React Query 测试中嘲笑 `useQuery` 会损害其缓存和自动重新获取等功能。MSW (Mock Service Worker) 提供了一种更优越的方法,通过模拟真实端点。MSW 不是嘲笑 hook,而是拦截实际请求(fetch/axios)并返回模拟响应,从而保留了 React Query 的逻辑。设置 MSW 涉及安装、创建处理程序来定义模拟响应、配置测试服务器以及将其与 Jest 集成。一个实际的例子展示了使用 MSW 测试用户列表组件,展示了如何验证加载、错误和成功状态。使用 MSW 具有测试真实 API 集成、启用 React Query 的全部功能以及便于在 E2E 测试中维护和重用等优点。这种方法确保了更可靠和可维护的测试,反映了真实世界的场景。嘲笑端点而不是 hook 是进行健壮且真实的 React Query 测试的最佳实践。这确保了测试更接近现实,更可靠,并且更容易演进。