React-Testing 库和 MSW v2 renderHook 在 RTKQ 上不返回任何数据

Question

我已经设置了一个测试，以便我可以测试 RTKQ 返回一个简单的 json。我得到 IsSuccess true 但数据未定义。可以看到它从 isLoading 变为 is Success，因此在某种程度上正在观察调用。

const handlers = [
    http.post(`${BASE_URL_TOKEN}`, () =>
        HttpResponse.json({})
    ),
    http.get(`${BASE_URL}/admin/test`, () => {

        return HttpResponse.json({ data: 'Hello World' });
    }),
];

const server = setupServer(...handlers);

beforeAll(() => server.listen({ onUnhandledRequest: 'error' }));

afterEach(() => {
    server.resetHandlers();
});

afterAll(() => {
    server.close();
});

const wrapper = ({ children }) => <Provider store={store}> 
         {children}</Provider>;


test('renders hook', async () => {
    const { result } = renderHook(() => useTestQuery(), {
        wrapper,
    });


    await waitFor(() => expect(result.current.isSuccess).toBe(true));

    console.log('expect to see data', result.current);

    expect(result.current.data).toBeDefined();
});

api层

export const adminApi = createApi({
    reducerPath: 'admin-Api',
    baseQuery: fetchBaseQuery({ baseUrl: `${BASE_URL}/admin/` }),
    endpoints: (builder) => ({
        test: builder.query<Test, void>({
            query: () => ({
                url: 'test',
                method: httpMethod.Get,
            }),
        }),
    }),
});

型号

export interface Test {
    data: string;
}

使用 RTKQ 和 React 测试库尝试了多种方法，但无法让数据通过。不确定是否是 MSW 或 React 测试库的问题。欢迎任何建议。

Answer 1

这条路线最终没有成功。我们最终将 MSW 降级到版本 1.3，并避免使用版本 2，并使用 MSW 1.0 方法来访问 API 端点。这为我们解决了这个问题。