Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why does a redux-saga use put method instead of dispatch?

The demonstration example in the README file uses a function called put() instead of dispatch() in the worker saga.

...

// worker Saga: will be fired on USER_FETCH_REQUESTED actions
function* fetchUser(action) {
   try {
      const user = yield call(Api.fetchUser, action.payload.userId);
      yield put({type: "USER_FETCH_SUCCEEDED", user: user});
   } catch (e) {
      yield put({type: "USER_FETCH_FAILED", message: e.message});
   }
}

...
like image 582
Emad Omar Avatar asked May 24 '18 09:05

Emad Omar


1 Answers

Redux-Sagas is based on generator functions. Whenever you call one of these, it gets executed until it reaches a yield. This, besides allowing you to perform async actions by waiting for promises, has a bunch of advantages when it comes to testing for example.

Esentially, mocking is what is trying to be avoided here when you are testing. In order to do so, a declarative approach is followed. The point is that you don't dispatch (nor really do anything), the middleware does. You only provide this middleware with objects called Effects. So, what the put will do is to create an Effect object that the middleware will "read". Then, it will dispatch the action and use next(result) (with result being the result of whatever the Effect told the middleware to do) to go to the next yield and get the next Effect. You can read more about it here.

Remember that the main advantages of redux-sagas when compared to redux-thunk appear when testing comes in. Being able to just declare which Effect will be returned by each put, call... and then just iterating from yield to yield instead of having to mock API calls or dispatches is a major selling point for redux-sagas. You probably need to read and practise a little bit more before you get the concept completely but I hope my explanation solves your doubt.

like image 139
César Landesa Avatar answered Oct 20 '22 20:10

César Landesa