I'm trying to test when a redirect of a route happens in redux-saga. All other tests are passing except this one, which I have not figured out how to test.

This is the saga function that I'm testing...

export function* doFetch({ payload: { id } }) {
  try {
    const station = yield call(stationApi.fetch, id)
    yield put(set(station))
    const allStations = yield call(stationApi.fetch)
    const cashDrawer = yield call(buildCashDrawerState, station, allStations)
    yield put(replaceCashDrawerState(cashDrawer))
    yield call(redirectPos, station)
  } catch (error) {
    yield put(notifyError(
      'Something went wrong during the station fetch. Please try again later',
      { id: 'station' },
    ))
  }
}

This is the redirect method...

const redirectPos = (station) => {
  if (window.location.href.includes('pos') && station.cash_drawer) {
    sagamore.router.redirect('pos')
  } else if (!station.cash_drawer) {
    sagamore.router.redirect('sales/dashboard')
  } else {
    return
  }
}

And this is the test so far...

fdescribe('sagas/station', () => {
  afterEach(() => {
    fetchMock.restore()
  })

  fdescribe('doFetch', () => {
    it('fetches station and cash drawer', () => {
      const id = 1
      const station = {
        id,
        name: 'new name',
        cash_drawer: { location_id: 'location', id: 2 },
      }
      const stations = [
        { id: 10, name: 'Station1', cash_drawer_id: 2 },
        { id: 11, name: 'Station2', cash_drawer_id: 2 },
        // { id: 12, name: 'Station3', cash_drawer_id: 3 },
      ]
      fetchMock.mock(
        `/api/stations/${id}`,
        station,
      )
      fetchMock.mock(
        `/api/stations`,
        { results : stations },
      )
      const saga = doFetch({ payload: { id } })
      let expected
      expected = call(stationApi.fetch, id)
      expect(saga.next().value).toEqual(expected)
      expected = put(set(station))
      expect(saga.next(station).value).toEqual(expected)
      expected = call(stationApi.fetch)
      expect(saga.next().value).toEqual(expected)
      saga.next({ results: stations })
      expected = put(replaceCashDrawerState({ drawer: {...station.cash_drawer, stations: stations} }))
      expect(saga.next({ drawer: {...station.cash_drawer, stations: stations} }).value).toEqual(expected)
      // test redirectPos(...)
      expected = call(redirectPos, station)
      expect(saga.next().value).toEqual(expected)
    })
  })
})

I'm new to Redux-Saga and testing. I haven't been able to find a way to test this when researching it. Any help or direction would be appreciated.

CodePudding user response：

Generally, when you write unit test the idea is to test every unit in isolation. So in your case, from the saga perspective the logic inside of redirectPos doesn't matter, all you need to test is that it gets called with the right parameter. Then, you can write another test specifically for the redirectPos function where you test the internals.

Testing current location can get a bit tricky, I suggest visiting other SO questions on that topic such as How to mock window.location.href with Jest Vuejs?