12. How do you test a store configuration?

Question

Accepted Answer

Testing a Redux Toolkit store configuration ensures that reducers, middleware, and initial states behave as expected. You can use testing libraries like Jest to validate store setup, dispatched actions, and resulting state changes. **1. Import the Store or Create a Test Store:** Use your actual store or a simplified version created with `configureStore()`.  **2. Dispatch Actions:** Trigger actions and observe how the state updates. **3. Verify State Changes:** Use assertions to check if reducers modify the state correctly. **4. Mock External APIs (if using RTK Query or async thunks):** Use mocks to isolate tests from real API calls. import { configureStore } from '@reduxjs/toolkit';
import counterReducer, { increment, decrement } from './counterSlice';

describe('Redux Store Configuration', () => {
  const store = configureStore({
    reducer: {
      counter: counterReducer,
    },
  });

test('should have an initial state', () => {
    const state = store.getState();
    expect(state.counter.value).toBe(0);
  });

test('should handle increment action', () => {
    store.dispatch(increment());
    const state = store.getState();
    expect(state.counter.value).toBe(1);
  });

test('should handle decrement action', () => {
    store.dispatch(decrement());
    const state = store.getState();
    expect(state.counter.value).toBe(0);
  });
}); This example tests a simple counter store to ensure that the reducer and actions work as intended. import { configureStore } from '@reduxjs/toolkit';
import rootReducer from './rootReducer';

const mockMiddleware = () => (next) => (action) => {
  console.log('Action dispatched:', action.type);
  return next(action);
};

test('should apply custom middleware', () => {
  const store = configureStore({
    reducer: rootReducer,
    middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(mockMiddleware),
  });

const spy = jest.spyOn(console, 'log');
  store.dispatch({ type: 'TEST_ACTION' });
  expect(spy).toHaveBeenCalledWith('Action dispatched:', 'TEST_ACTION');
  spy.mockRestore();
}); **- Isolation:** Test slices or reducers individually to isolate logic. **- Mocking:** Use mock stores or API mocks to avoid network dependencies. **- Integration Tests:** Combine multiple slices to ensure correct store composition. **- Middleware Validation:** Confirm that custom middleware executes as expected. By systematically testing store configuration, you ensure reliable and predictable state management, even as your Redux Toolkit application grows in complexity.

12. How do you test a store configuration?

Testing Redux Toolkit Store Configuration

12. How do you test a store configuration?

Testing Redux Toolkit Store Configuration

Scenario Questions

Follow-up Questions