Reputation: 395
I am trying to test my redux-sagas with the redux-saga-test-plan library to make things easier. All tests are run in a JEST environment.
To help me structure my tests on a forked saga I followed the documentation here: https://github.com/jfairbank/redux-saga-test-plan/blob/master/docs/integration-testing/forked-sagas.md
But when I try to run the test i get this error:
TypeError: Cannot read property 'name' of undefined
12 | .put(setMenu(menuList))
13 | .dispatch('SET_MENU_REQUEST', menuList)
> 14 | .run()
15 | })
16 |
My test (updated):
import { expectSaga } from 'redux-saga-test-plan'
import { call, put, takeLatest, takeEvery } from "redux-saga/effects";
import menuSaga from '../../sagas/MenuSaga'
import { applyMenu } from '../../sagas/MenuSaga'
import { menuList } from '../../stubs/menuList'
import { setMenu } from '../../reducers/menuReducer'
it("Sets a new menu", () => {
return expectSaga(applyMenu)
.put(setMenu(menuList))
.dispatch('SET_MENU_REQUEST', menuList)
.run()
})
update: I found some documentation on how to utilize effect-helpers (takeEvery, takeLatest) and tried that too, but to no effect, it just causes a new error.
test with effect-helper:
it("Sets a new menu", () => {
return expectSaga(menuSaga)
.next()
.put(setMenu(menuList))
.takeEvery('SET_MENU_REQUEST', applyMenu)
.finish()
.isDone()
})
The error it throws:
TypeError: (0 , _reduxSagaTestPlan.expectSaga)(...).next is not a function
10 |
11 | return expectSaga(menuSaga)
> 12 | .next()
13 | .put(setMenu(menuList))
14 | .takeEvery('SET_MENU_REQUEST', applyMenu)
15 | .finish()
The saga I am trying to test:
import {fork, put, select, call} from 'redux-saga/effects'
import {takeEvery, takeLatest} from 'redux-saga'
import { handleRequest } from './serverSaga'
import { setMenu } from '../reducers/menuReducer'
const POST_MENU_REQUEST = 'POST_MENU_REQUEST'
const GET_MENU_REQUEST = 'GET_MENU_REQUEST'
const SET_MENU_REQUEST = 'SET_MENU_REQUEST'
export function setMenuRequest(menu) {return {type: SET_MENU_REQUEST, menu}}
export function postMenuRequest(data) {return {type: POST_MENU_REQUEST, data}}
export function getMenuRequest() {return {type: GET_MENU_REQUEST}}
export function* applyMenu(menu) {
yield put(setMenu(menu))
}
function* postNewMenu(data){
yield call(handleRequest, '/admin/menu' ,'POST', data)
}
function* getMenu(){
let response = yield call(handleRequest, "/admin/menu", "GET")
if(response){
yield put(setMenu(response))
}
}
export default function* menuSaga(){
yield [
fork(function*() {
yield takeEvery(POST_MENU_REQUEST, postNewMenu)
}),
fork(function*() {
yield takeEvery(GET_MENU_REQUEST, getMenu)
}),
fork(function*(){
yield takeEvery(SET_MENU_REQUEST, applyMenu)
})
]
}
As you can see I have tried to export the generator-function that I want to test, even though I don't think this is optimal since the test shouldn't require me to change my code just to test it, so I'm probably missing something.
The stub menuList has a structure like this:
Date: '',
Id: '',
ClosingTime: '',
MenuItems: [],
It's proving to be not-so-straigthforward to test my sagas since they are all structured like this one (forked) and there doesn't seem to be a lot of documentation as to how to test them properly.
Upvotes: 4
Views: 2917
Reputation: 1596
The problem is that your are mixing redux-saga-test-plan's unit tests with their integration tests.
expectSaga(menuSaga) // this is an integration test function
.next() // this is a unit test function
.put(setMenu(menuList))
.takeEvery('SET_MENU_REQUEST', applyMenu)
.finish()
see: https://redux-saga-test-plan.jeremyfairbank.com/integration-testing/
Upvotes: 0
Reputation: 81
Probably, your problem is that you are importing and using expectSaga from redux-saga-test-plan when it should be testSaga
Upvotes: 1