Using custom RxJS log() operator

log.operator.ts

export function log(task: string) {
 const announceCompleted = () =>  {
    console.log(`${task} %ccomplete`, 'color: green');
 };
 return function<T>(source: Observable<T>) {
   return source.pipe(
     tap(
      console.log, 
      console.error, 
      announceCompleted 
    )
   );
  };
}

Usage

const source = interval(1000).pipe(
  delay(750),
  takeUntil(fromEvent(document,'click')),
  log('Interval Countdown'),
  map(x => `Hello ${x}!`),
);

See:

• StackBlitz Demo
• Caroso Blog

Can also use long form:

export function log() {
  return function logFn<T>(source: Observable<T>) {
    const output = new Observable<T>(observer => {
      const subscription = source.subscribe(
        (val:T) => {
          console.log(val);
          observer.next(val);
        },
        (err) => {
          console.error(err);
          observer.error(err);
        },
        () => {
          console.log('%ccomplete', 'color: green');
          observer.complete();
        }
      );
      return () => {
        subscription.unsubscribe();
      };
    });

    return output;
  };
}