[React] TDD how to stub react-redux store in tests

Jay Kim
Aug 7, 2021

--

When doing test-driven development, it might be easier to stub the return values of APIs or async calls. But there will be cases where stubbing the states inside the store might be helpful.

Full source code can be found here.

The idea is to create an initial state of the reducer the test is interested in before each render.

Let us assume there are three different reducers.

store.js (rootReducer)

The reducer I would like to test is the cartReducer shown below.

cart-index.js (cartReducer)

Lastly, renderWithStore receives the initial cart state before the actual render. The idea is that each test or test group may have different states to begin with. Therefore, the states can be easily overridden based on what is being tested.

--

--

No responses yet