'JEST test of React/Redux reducer from createSlice return underfined

I have faced some sort a tricky situation. Currently app operates well without visible bugs. When I lunch the simlpelest test of checking reducer from createSlice it is running into the TypeError: Cannot read properties of undefined. And it is the same for 3 reducer of 4 in combinedReducer. But when I lounch the same test for the last reducer it is passed. After two crasy days of surch and delibarate reading of docs and checking my code again and again I came to conclusion that I overestimate my ability to cope with it and ask you for the help or advise or idea where and what should be checked. Currently code in the frame/shape of what Redux is usking for.

The questions is follow:

  1. Why during test of reducer it returnes underfined eventhought initilState have been provided?
  2. How to solve it?
  3. Why one of the reducers behave in the right way according to the test?

Detailes:

CombinedReducers

import { combineReducers } from '@reduxjs/toolkit';
import { NameSpace } from '../const';
import { dataFavorites } from './data-favorites/data-favorites';
import { dataOffers } from './data-offers/data-offers';
import { dataProperty } from './data-property/data-property';
import { dataUser } from './data-user/data-user';

export const reducerRoot = combineReducers({
  [NameSpace.DataOffers]: dataOffers.reducer,
  [NameSpace.DataProperty]: dataProperty.reducer,
  [NameSpace.DataUser]: dataUser.reducer,
  [NameSpace.DataFavorites]: dataFavorites.reducer,
});

Slice number 1

const initialState: DataOffers = {
  listOffers: [],
  currentCity: Cities.Paris,
  sortType: SortingLabel.Popular,
  listOffersForCity: [],
  errorOffers: null,
  loadingOffersStatus: LoadingStatus.Idle,
};

export const dataOffers = createSlice({
  name: NameSpace.DataOffers,
  initialState,
  reducers: {
    listOffers: (state, action) => {
      state.listOffers = action.payload;
    },
    currentCity: (state, action) => {
      state.currentCity = action.payload;
    },
         // (the rest of code) etc..
  },
  extraReducers: (builder) => {
    builder
      .addCase(fetchOffersAction.pending, (state, action) => {
        state.loadingOffersStatus = LoadingStatus.Loading;
      })
          // (the rest of code) etc..   
      });
  },
});

Slice number 2

const initialState: DataUser = {
  userInformation: null,
  authorizationStatus: AuthorizationStatus.Unknown,
  loadingUserStatus: LoadingStatus.Idle,
  errorUser: null,
};

export const dataUser = createSlice({
  name: NameSpace.DataUser,
  initialState,
  reducers: {
    requireAuthorization: (state, action) => {
      state.authorizationStatus = action.payload;
    },
    userInformation: (state, action) => {
      state.userInformation = action.payload;
    },
    setErrorUser: (state, action) => {
      state.errorUser = action.payload;
    },
    setLoadingUserStatus: (state, action) => {
      state.loadingUserStatus = action.payload;
    },
  },
});

Test number 1

const initialState: DataOffers = {
  listOffers: [],
  currentCity: Cities.Paris,
  sortType: SortingLabel.Popular,
  listOffersForCity: [],
  errorOffers: null,
  loadingOffersStatus: LoadingStatus.Idle,
};

describe('Reducer: dataOffers', () => {

  it('should return initial state with unknown action', () => {
    expect(dataOffers.reducer(void 0, ConstantForMocks.UnknownAction))
      .toEqual(initialState);
  });
});

Test number 2

const initialState = {
  userInformation: null,
  authorizationStatus: AuthorizationStatus.Unknown,
  loadingUserStatus: LoadingStatus.Idle,
  errorUser: null,
};

describe('Reducer: dataUser', () => {

  it('should return initial state with unknown action', () => {
    expect(dataUser.reducer(void 0, ConstantForMocks.UnknownAction))
      .toEqual(initialState);
  });
});

Result of the test 1

 FAIL  src/store/data-offers/data-offers.test.ts
  ● Test suite failed to run

    TypeError: Cannot read properties of undefined (reading 'reducer')

       7 |
       8 | export const reducerRoot = combineReducers({
    >  9 |   [NameSpace.DataOffers]: dataOffers.reducer,
         |                                      ^
      10 |   [NameSpace.DataProperty]: dataProperty.reducer,
      11 |   [NameSpace.DataUser]: dataUser.reducer,
      12 |   [NameSpace.DataFavorites]: dataFavorites.reducer,

      at Object.<anonymous> (src/store/reducer-root.ts:9:38)
      at Object.<anonymous> (src/store/index.ts:4:1)
      at Object.<anonymous> (src/services/error-handle.ts:4:1)
      at Object.<anonymous> (src/store/data-offers/data-offers.ts:7:1)

Result of the test 2

PASS  src/store/data-user/data-user.test.ts
  Reducer: dataUser
    √ should return initial state with unknown action (2 ms)


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source