In redux saga if we want to handle multiple promises, we can use all (which is equivalent of Promise.all):

yield all(
   users.map((user) => call(signUser, user)),
);

function* signUser() {
   yield call(someApi);
   yield put(someSuccessAction);
}

The problem is, even if one of the promises (calls) fail, the whole task is cancelled.

My goal is to keep the task alive, even if one of the promises failed.

In pure JS I could handle it with Promise.allSettled, but whats the proper way to do it in redux saga?

Edit: still didnt find any suitable solution, even if I wrap the yield all in try... catch block, still if even one of the calls failed, whole task is canceled.

In redux saga if we want to handle multiple promises, we can use all (which is equivalent of Promise.all):

yield all(
   users.map((user) => call(signUser, user)),
);

function* signUser() {
   yield call(someApi);
   yield put(someSuccessAction);
}

The problem is, even if one of the promises (calls) fail, the whole task is cancelled.

My goal is to keep the task alive, even if one of the promises failed.

In pure JS I could handle it with Promise.allSettled, but whats the proper way to do it in redux saga?

Edit: still didnt find any suitable solution, even if I wrap the yield all in try... catch block, still if even one of the calls failed, whole task is canceled.

• javascript
• reactjs
• promise
• react-redux
• redux-saga

• 2 Does this answer your question? Wait until all promises plete even if some rejected – Roamer-1888 Commented Aug 27, 2020 at 17:06
• @Roamer-1888 Thanks! But Im looking for a specified solution for redux saga – Patrickkx Commented Aug 27, 2020 at 18:11
• The principle will be the same even if the syntax differs slightly. – Roamer-1888 Commented Aug 27, 2020 at 19:21
• @Roamer-1888 Not really, sagas are held on generators – Patrickkx Commented Aug 27, 2020 at 19:57
• Patrickkx, what does that mean, can you give me a reference? – Roamer-1888 Commented Aug 27, 2020 at 19:58

3 Answers 3

Actually, you should change your array of Promises to the all method of Redux-Saga, you should write it like below:

yield all(
  users.map((item) =>
    (function* () {
      try {
        return yield call(signUser, item);
      } catch (e) {
        return e; // **
      }
    })()
  )
);

You pass a self-invoking generator function with handling the error and instead of throw use return. hence, the line with two stars(**).

By using this way all of your async actions return as resolved and the all method never seen rejection.

You can implement it by yourself. There is a PR. See below example:

import { all, put, call, takeLatest } from 'redux-saga/effects';
import { createStoreWithSaga } from '../../utils';

const someSuccessAction = { type: 'SIGN_USER_SUCCESS' };

function someApi(user) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      if (user < 5) {
        resolve('success');
      } else {
        reject('failed');
      }
    }, 1000);
  });
}

const allSettled = (effects) =>
  all(
    effects.map((effect) =>
      call(function* settle() {
        try {
          return { error: false, result: yield effect };
        } catch (err) {
          return { error: true, result: err };
        }
      }),
    ),
  );

function* batchSignUser(action) {
  const r = yield allSettled(action.payload.users.map((user) => call(signUser, user)));
  console.log(r);
}

function* signUser(user) {
  const r = yield call(someApi, user);
  yield put(someSuccessAction);
  return r;
}

function* watchBatchSignUser() {
  yield takeLatest('SIGN_USER', batchSignUser);
}
const store = createStoreWithSaga(watchBatchSignUser);

const users = [1, 2, 3, 4, 5, 6, 7];
store.dispatch({ type: 'SIGN_USER', payload: { users } });

The execution result:

[
  { error: false, result: 'success' },
  { error: false, result: 'success' },
  { error: false, result: 'success' },
  { error: false, result: 'success' },
  { error: true, result: 'failed' },
  { error: true, result: 'failed' },
  { error: true, result: 'failed' }
]

I was able to do it the old school way Promise.allSettled()!

const promises = [];
users.map((user) => promises.push(call(signUser, user)));


function* signUser() {
  let responses = [];
  responses = yield(yield Promise.allSettled(promises)));
  // filter the onces which are successfull unsuccessfull once don't have value
  responses = responses.filter(response => response.value);
}