How to: Rxjs Observable Process values in order (concatMap), handling errors(catchError), without 'stopping' (switchmap)

Question

Goal: Process(async Call) all elements from Observable in order, finishing one before the next (concatMap style) while handling errors from bad elements without stopping.

It is understood that an observable that errors, will stop its emissions As per this question: rxjs error handling > on catchError source stops emitting

1. One solution might be - to extend the above solution, to include the sequenced processing of concatMap - Not sure how this would be done?

2. Another solution - add a switchMap and Observable to my Demo? The StackBlitz below is as far as I managed. It Demonstrates the desired behavior, but lacks a true source observable, that is 'error protected' - to keep it from stopping. https://stackblitz.com/edit/typescript-8akf2h?file=index.ts

Any help to establish the stated goal would be greatly appreciated.

TIA

Answer 1

If you add catch handler function out of concatMap, like this:

outer$.pipe(
  concatMap((a) => return whatever(errorHandler)),
  catchError()
)

Once inner stream throws an error, stream will end.

But if you add catchError() like this:

outer$.pipe(
  concatMap((a) => return whatever().pipe(catchError(errorHandler)))
)

It will continue, ofc you have to handle errors correctly in catch handler.