Rxjs toPromise() deprecated

Issue

I have read that toPromise() is being deprecated in RxJS 7 and will be removed in RxJS 8. I have often used it with async await syntax in angular to handle http calls. Is it considered an anti pattern? I understand the concept of streams but an http call only emit a single value. I don't get the point of observable for a simple http call. What should I use next? should I fully embrace reactive programming?

Solution

Why is this happening?

As mentioned here, these are the main reasons why toPromise is being deprecated:

1. One goal was to remove it from the Observable prototype and turn it into a standalone util function.

2. The naming of toPromise is not the best. Especially when used in combination with await it does not read very well: await categories$.toPromise() vs await lastValueFrom(categories$)

3. The type information of toPromise is wrong. When the source Observable completed without ever emitting a single value - it resolved with undefined. It should reject in that case. A Promise is a "promise" that when it resolves a value will be there - and be it undefined. But when the stream completes without ever emitting a value you can't differentiate between a stream that a emitted undefined on purpose and a stream that completed without ever emitting anymore

What should you use next?

If you really insist doing it the promise way, lastValueFrom/firstValueFrom. Otherwise switching to reactive programming would be the way to go.

Using toPromise ( deprecated ) -

public async loadCategories() {
    this.categories = await this.inventoryService
      .getCategories()
      .toPromise()
}

Using lastValueFrom ( new ) -

import { lastValueFrom } from 'rxjs';

public async loadCategories() {
    const categories$ = this.inventoryService.getCategories();
    this.categories = await lastValueFrom(categories$);
} 

This link should help -

https://indepth.dev/posts/1287/rxjs-heads-up-topromise-is-being-deprecated

Answered By - Pawan Sharma