Highlighting testing streams using HttpClientTestingModule

Observables that are returned from the HTTP client are frequently used in our Angular code, but how can we test those streams? Let’s look at the pattern we can use to test those Observables. We will be shifting our focus away from general testing practices and narrowing our attention specifically to testing our recipe app.

Consider the following method inside RecipeService:

  saveRecipe(formValue: Recipe): Observable<Recipe> {
    return this.http.post<Recipe>(
      `${BASE_PATH}/recipes`, formValue);
  }

The saveRecipe method issues an HTTP request and returns an Observable of recipe. In order to test the output Observable, there is a very useful API that can be used: HttpClientTestingModule. This API allows us to test HTTP methods that use the HTTP client. It also allows us to easily mock HTTP requests by providing the HttpTestingController...