Why doesn't `finally` work in this case in RxJS?

Question

This does not print "drag end":

mouseDrags.forEach(drag => {
    console.log('drag start');
    drag.finally(_ => console.log('drag end'));
    drag.forEach(doSomething);
});

But this prints "drag end":

mouseDrags.forEach(drag => {
    console.log('drag start');
    drag.finally(_ => console.log('drag end')).forEach(_=>_);
    drag.forEach(doSomething);
});

Why does the forEach make a difference?

Answer 1

It is because .finally() returns another Observable which you need to subscribe to. Observable s are by default lazy, so they won't start emitting until they are subscribed to.

So you can do

mouseDrags.forEach(drag => {
    console.log('drag start');
    drag.finally(_ => console.log('drag end')).forEach(doSomething);
});

or even better

mouseDrags.flatMap(drag => {
    console.log('drag start');
    return drag.finally(_ => console.log('drag end'))  
}).forEach(doSomething);

Answer 2

What is the type of drag ? If it is an Observable, you need to subscribe to it. finally doesn't subscribe, but forEach does. You could test it by calling drag.finally(_ => console.log('x')).subscribe() . That should print it too.

The forEach is in fact an alias for subscribe , so using either is fine.