I am using redux-observable together with isomorphic-fetch to handle http requests in my React app. I am favouring this bination over using rxjs' ajax because I am testing with Jest - which runs tests in Node.js- and want to intercept http requests with nock. See this related question: Use fetch instead of ajax with redux-observable.

So here is the problem: I get an UnhandledPromiseRejectionWarning together with a scary: DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code. because I am not catching my promise rejections directly but rather leave that to the Observable:

// apiModule.js
import fetch from 'isomorphic-fetch'

const api = {
  getSomething: () => {
    const request = fetch('http://some-api/')
      .then(res => catchError(res)) // throwing an Error here if not response.ok
      .then(res => res.json())

    return Observable.from(request)
  }
}

Then in the epic:

// myReduxModule.js
import {api} from './apiModule.js'

const getSomethingEpic = action$ =>
  action$
    .ofType(GET_SOMETHING)
    .mergeMap(action =>
      api
        .getSomething()
        .map(response => getSomethingSucceeded(response))
        .catch(error => logError(error)) // error is handled here!
    )

So the promise rejection is handled in the Observable but not directly!

Any suggestions how to avoid the warning (and a possible future terminate with non-zero exit code) in this scenario?

I am using redux-observable together with isomorphic-fetch to handle http requests in my React app. I am favouring this bination over using rxjs' ajax because I am testing with Jest - which runs tests in Node.js- and want to intercept http requests with nock. See this related question: Use fetch instead of ajax with redux-observable.

So here is the problem: I get an UnhandledPromiseRejectionWarning together with a scary: DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code. because I am not catching my promise rejections directly but rather leave that to the Observable:

// apiModule.js
import fetch from 'isomorphic-fetch'

const api = {
  getSomething: () => {
    const request = fetch('http://some-api/')
      .then(res => catchError(res)) // throwing an Error here if not response.ok
      .then(res => res.json())

    return Observable.from(request)
  }
}

Then in the epic:

// myReduxModule.js
import {api} from './apiModule.js'

const getSomethingEpic = action$ =>
  action$
    .ofType(GET_SOMETHING)
    .mergeMap(action =>
      api
        .getSomething()
        .map(response => getSomethingSucceeded(response))
        .catch(error => logError(error)) // error is handled here!
    )

So the promise rejection is handled in the Observable but not directly!

Any suggestions how to avoid the warning (and a possible future terminate with non-zero exit code) in this scenario?

• javascript
• node.js
• reactjs
• redux
• redux-observable

Share Improve this question Follow asked Jun 8, 2017 at 9:06 mcmundermcmunder 44511 gold badge55 silver badges1111 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

From now on, every time you have a promise and you call the then, you must also implement the catch. Also in your tests.

 const request = fetch('http://some-api/')
      .then(res => catchError(res))
      .then(res => res.json())
      .catch(err => catchError(res)) // <= here you should implement the catch