RTKQ & RTKM mocking and jest test case for covering?

[yaswanth1121997]

import { createSlice, createAction } from '@reduxjs/toolkit';
import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';

export const myApi = createApi({
    reducerPath: 'myApiPath',
    baseQuery: fetchBaseQuery({
        baseUrl: 'host url'
    }),
    endpoints: builder => ({
        getAllData: builder.query({
            query: () => 'endpoint url'
        })
    })
});

const mySlice = createSlice({
    name: 'mySliceName',
    initialState: {
        testState: {}
    },
    reducers: {
        // some reducers
    },
    extraReducers: builder => {
        builder.addMatcher(
            myApi.endpoints.getAllData.matchFulfilled,
            (state, { payload }) => {
                // doing something
            }
        );
    }
});

export default mySlice.reducer;
export const { useGetAllData } = myApi;

Can someone help me How to write the jest test case for covering this entire file especially extraReducers matchCases like fulfilled & RTKQ ?

[markerikson]

We specifically recommend writing tests that do mocking at the network request level:

https://redux.js.org/usage/writing-tests

[yaswanth1121997]

I tried that way, but didn't helped. Can you provide the working example for this ?

[phryneas]

If you provide what you tried, and which errors you encountered we can point out what you are doing wrong. Apart from that, you can look into our tests how we do it. But we are not writing a full example for you from zero here.

[LuneLink]

@yaswanth1121997 i don't know how much it help you but you can try do next

    it('should ', () => {
      jest.spyOn(myApi.endpoints.getAllData.matchFulfilled, 'matchFulfilled').mockReturnValue(true);
      //todo: find the way to do action without mocking;
      const res = mySlice.reducer(initialState, { type: "any", payload: mockResponse });
      expect(res).toEqual(mockResponse);
    });

[vishalboine]

I'm also facing the same issue and I'm using msw which is giving me undefined response in my vitest environment. Do we need to set headers too while calling the handler for mock api

http.get('API URL', () => { return HttpResponse.json({ "statusCode": 200, <<api mock data>> }, {status: 200})

[phryneas]

Usually not

[aryaemami59]

@vishalboine Can you give me the versions of msw and vitest and a code snippet or maybe a small repro? I can take a look at this but I need more info because msw's behavior has changed a lot between updates.