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