How to write high level test for saga? (Subscribe to end of side-effect handling)

Current examples of testing sagas are pretty low level. It gives really fine grained control over exactly what a saga does.

https://redux-saga.github.io/redux-saga/docs/advanced/Testing.html

However, I’d like to be able to test my redux setup on a much higher level. Basically how an application would actually consume it

1. Create a store with some initial state
2. Dispatch actions to it, expecting sagas to do any async work / side effects
3. Let reducers transform state in response to actions dispatched directly / by sagas
4. Wait until the handling of the actions has finished
5. Use selectors to get the final state and confirm it matches expectations

However, I don’t know how to accomplish step 4 with redux saga.

With thunk this is super easy.

function incrementAsync() {
  return dispatch => {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        // Yay! Can invoke sync or async actions with `dispatch`
        dispatch(increment());
        resolve()
      }, 1000);
    });
  };
}

// Then in test setup
describe('redux store', () => {
  it('increments async by 1', async () => {
    const store = configureStore({counter: 1})
    await store.dispatch(incrementAsync(1))
    const counter = selectCounter(store.getState())
    expect(counter).toBe(2)
  })
})

However, it’s not clear to me how to dispatch an action and then wait until after redux-saga has finished handling side-effects for it. Any ideas?

[yelouafi]

You can also run the worker Saga directly

describe('redux saga', () => {
  it('increments async by 1', async () => {
    const store = configureStore({counter: 1})

    await sagaMiddleware.run(incrementAsyncSaga(1)).done
    const counter = selectCounter(store.getState())
    expect(counter).toBe(2)

    await sagaMiddleware.run(incrementAsyncSaga(1)).done
    const counter = selectCounter(store.getState())
    expect(counter).toBe(3)
  })
})

[tonyxiao]

Read a bit more docs, maybe something like this?

it('increments counter via saga', async () => {

  const promise1 = sagaMiddleware.run(rootSaga).done
  store.dispatch(incrementAsyncViaSaga(1))
  store.dispatch(END)
  await promise1
  expect(counter).toBe(2)

  const promise2 = sagaMiddleware.run(rootSaga).done
  store.dispatch(incrementAsyncViaSaga(1))
  store.dispatch(END)
  await promise2
  expect(counter).toBe(3)
})