simple-saga-selector-test.js

import { call, put, select } from 'redux-saga/effects';

import { API_BUTTON_CLICK_SUCCESS, API_BUTTON_CLICK_ERROR, } from './actions/consts';
import { getUserAccessToken } from './selectors';
import { getDataFromAPI } from './api';
import { apiSideEffect } from './sagas';

it('apiSideEffect - dispatches API_BUTTON_CLICK_ERROR if we aren\'t authenticated', () => {
  const generator = apiSideEffect();
  const fakeAccessToken = ''; // or false, null, etc

  expect(generator.next().value)
    .toEqual(select(getUserAccessToken));

  // This is a pretty subtle, but powerful thing - the actual saga code has 'yielded' on the `select(getUserAccessToken)`
  // line, and when we call `.next()` on the generator, we can actually pass variables back into the function
  // which will be saved to the variable on the line that was yielded
  // example:  const accessToken = yield select(getUserAccessToken);
  // here we are setting accessToken to be ''.
  expect(generator.next(fakeAccessToken).value)
    .toEqual(call(getDataFromAPI));

  expect(generator.next().value)
    .toEqual(put({ type: API_BUTTON_CLICK_ERROR, payload: new Error('No access token - aborting') }));

  expect(generator.next())
    .toEqual({ done: true, value: undefined });
});

it('apiSideEffect - dispatches API_BUTTON_CLICK_SUCCESS if we are authenticated', () => {
  const generator = apiSideEffect();
  const fakeAccessToken = 'valid_access_token';

  expect(generator.next().value)
    .toEqual(select(getUserAccessToken));

  expect(generator.next(fakeAccessToken).value)
    .toEqual(call(getDataFromAPI));

  expect(generator.next().value)
    .toEqual(put({ type: API_BUTTON_CLICK_SUCCESS }));

  expect(generator.next())
    .toEqual({ done: true, value: undefined });
});