I am testing an rtk query mutation api call. I'm trying to match the mock result to a successful api call but I always get an error: 'Expected signal to be an instanceof AbortSignal'. I understand that this may be a side effect of jest-fetch-mock but am not sure how to convert the input(?) into a typeof AbortSignal.
test('successful response', async () => {
const wrapper = ({children}) => {
const storeRef = setupApiStore(testApi);
return <Provider store={storeRef.store}>{children}</Provider>;
};
const classState = {
statusCodes: 200,
message: 'Success',
details: {
overallPresent: 3,
overallTotal: 10,
classStrength: [
{className: 'class 1', present: 3, total: 3},
{className: 'class 2', present: 0, total: 7},
],
},
};
const body = {
schoolName: 'school 1',
className: 'class 1',
};
fetchMock.mockResponse(JSON.stringify(classState));
const {result, waitForNextUpdate} = renderHook(
() => useClassMutation(),
{wrapper},
);
const [students, initialResponse] = result.current;
expect(initialResponse.data).toBeUndefined();
expect(initialResponse.isLoading).toBe(false);
act(() => {
students(body);
});
await waitForNextUpdate({timeout: 500});
const loadedResponse = result.current;
console.log('loadedResponse: ', loadedResponse);
expect(loadedResponse).toEqual(paradeState); //error: 'Expected signal to be an instanceof AbortSignal'
});
This is not an RTK Query error - it's an error from the
fetch
polyfill you are using.RTK Query is passing an
AbortSignal
into thatfetch
call - and then thatfetch
polyfill complains thatAbortSignal
is something incompatible.=> if you polyfill
global.fetch
, you also have to polyfillglobal.AbortController
with a compatible implementation.How you do that is very different for each implementation of
fetch
, so you'll have to research that - but I hope this gives you a direction.