I have set up a test so that I can test a RTKQ to return a simple json back. I get the IsSuccess true but data us undefined. Can see it go from isLoading to is Success so the call is being observed to some degree.
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 layer
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,
}),
}),
}),
});
model
export interface Test {
data: string;
}
Tried several approaches using RTKQ and React Testing Library but cannot get data to pass. Not sure if its an issue with MSW or React Testing Library. Any advice welcome.