Redux-Saga race timeout leaves pending API request unresolved

Answer

In a saga race the delay effect and the call(fetch…) effect run concurrently. If the delay wins, the saga is cancelled, but the underlying fetch promise keeps running unless you abort it yourself.

What actually happens

• Cancellation only throws CancelledError into the generator; the promise is untouched.
• When the timeout wins, the saga’s finally block runs.
• If you created an AbortController before the race and passed its signal to call(fetch, url, {signal}), calling abort() inside the finally will reject the promise with AbortError.
• The saga can catch that rejection and swallow it, so no SUCCESS action is dispatched.

Concrete steps for this scenario

1. Instantiate const controller = new AbortController() before the race.
2. Pass the signal to the fetch call: yield call(fetch, url, {signal: controller.signal}).
3. Start the race: const { timeout } = yield race({ timeout: delay(ms), fetch: call(...)});
4. In a finally block, if timeout is truthy, call controller.abort() and yield cancel(fetchTask) (if you kept a reference).
5. Wrap the fetch effect in a try/catch that ignores AbortError and does not dispatch a success action.

Why the original promise can’t update state after the timeout

Because the promise is rejected by AbortError, the catch block in the saga prevents the success branch from running. If you do not abort, the promise will resolve later; the saga’s generator has already finished, so the put that would update state is never executed.

Missing diagnostic detail

Does your runtime’s fetch implementation honor AbortSignal (e.g., browsers, node-fetch, axios with fetch adapter)? If it does not, aborting will have no effect and the request will continue to run.