How can I exit early from a chain of Promise.then in Promise.catch?

I have this code (view on JSFiddle):

fetch('https://some.invalid.url').then(resp => resp.text())
.catch(err => console.log("got error: " + err))
.then(text => console.log("got text: " + text));

Currently this logs the two lines

"got error: TypeError: Failed to fetch"
"got text: undefined"

I would like it to only log the line

"got error: TypeError: Failed to fetch"

In other words, I would like the promise chain to end once the .catch is called and not go into the .then. How can I do this?

(I could throw an exception inside the .catch, but I think that results in a unhandledrejection event which is undesirable).

Your issue is that your .catch() returns a resolved promise (resolving with the return value of console.log(), ie undefined).

Either move the .catch() to the end of the promise chain

fetch('https://some.invalid.url').then(resp => resp.text())
.then(text => console.log("got text: " + text))
.catch(err => console.log("got error: " + err));

or have it continue rejecting the chain (but note this will throw an uncaught promise rejection error)

fetch('https://some.invalid.url').then(resp => resp.text())
.catch(err => {
  console.log("got error: " + err);
  return Promise.reject(err);
})
.then(text => console.log("got text: " + text));

You need to swap the ordering so the .catch() is at the end of the chain.

fetch('https://some.invalid.url').then(resp => resp.text())
.then(text => console.log("got text should fail: " + text))
.catch(err => console.log("got error should fail: " + err));


fetch('https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js').then(resp => resp.text())
.then(text => console.log("got text that should succeed: " + text))
.catch(err => console.log("got error should succeed: " + err));

(view on JSFiddle)

Cancellable promises are not supported in ECMASCRIPT, but you could process catch clauses conditionally upon the type of error argument. E.G. Say you know every real error argument is non-null. Then you could

1. Throw null in a catch handler after logging or processing a real error.
2. Check if the err argument at the beginning of every catch handler to see if it is null. If so, re-throw the null error value immediately.
3. At the end of the promise chain, put an additional catch handler that re-throws its argument if it is not null - to report uncaught errors during development.

Potentially this could be used to work around the absence of cancellable promises in JS - but I do not suggest using it without dire need. As comments have suggested, moving catch handlers to the end of the chain, or logging an error and re-throwing it in the same catch handler is the more common approach.