redux-saga some of the rapid fired same actions missed

Question

Hi there I have a onChange callback in one of the React components that dispatches an action several times through a map call like this:

onChange: (items, newRatio) => {
  items.map( item => {
    dispatch(itemActions.updateStart({
      ...item,
      adjusted_ratio: _.round(item.adjusted_ratio + newRatio, 1),
    }))
  })
}

and I have a Saga for the "items" like so:

  // Updating an Item 
  function* watchUpdate() {
    while(true) {
      const { record: unsavedItem, } = yield take(itemTypes.ITEMS_UPDATE_START);
      const task = yield fork( updateItemDbCrud, unsavedItem )
    }
  }
  function* updateItemDbCrud(unsavedItem) {
    const savedItem = yield call( api.update, unsavedItem );
    const result = yield put ( itemActions.updateSuccess(savedItem) )
  }

  export default [watchUpdate]

In other words, I expected that whenever the ITEMS_UPDATE_START action gets dispatched, it forks a new updateItemDbCrud and proceeds to do some API work, but I notice that only the first of the sequence of dispatches goes through. Am I using the fork wrong?

Thank you!

Answer 1

It's a known issue (https://github.com/yelouafi/redux-saga/issues/50) and it has to do with the nature of promises and its use in Redux Sagas core.

It's been resolved in version 0.6.

if you want to learn more about what caused the issue I recommend reading the above github issue and also Jake Archibalds article on tasks, microtasks, queues and schedules.

https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules/