React-Query使用react-testing-library进行测试
1.测试react-query首先我们必须得拥有queryClient，所以我们初始化queryClient，因为默认是重试三次，这意味着如果想测试错误的查询，测试可能会超时。所以可以在初始化时关闭
const createWrapper = () => {const queryClient = new QueryClient({defaultOptions: {queries: {retry: false,},},});return ({ children }) => <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>;
};
2.网上很多还要引入依赖@testing-library/react-hook，因为请求是异步的， 上面这个库提供了waitFor等待数据返沪，但是目前@testing-library/react也已经提供。使用方法如下
it('testing product detail query', async () => {const { result } = renderHook(() => useQueryProductDetail(''), {wrapper: createWrapper(),});await waitFor(() => expect(result.current.isSuccess).toBe(true));});
3.正常测试使用react-query的组件时，也需要创建queryClient，具体代码如下
it('test render search detail', async () => {const queryClient = new QueryClient();const { debug, findByText, findByRole } = await render(<QueryClientProvider client={queryClient}><SearchDetail /></QueryClientProvider>);//debug(await findByRole('qwe'));});
建议读读该文章，更详细的讲述了如何进行ReactQuery的测试https://tkdodo.eu/blog/testing-react-query
© 著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务
喜欢的朋友记得点赞、收藏、关注哦！！！