如何编写Angular中HTTPClient get()方法服务的单元测试用例？

Question

Currently, I'm facing an error:

Property 'subscribe' does not exist on type 'Subscription'. Did you mean 'unsubscribe'?

Need help to point out what I'm missing.

my-service.ts

import {Injectable} from "@angular/core";
import {HttpClient} from "@angular/common/http";
import {dummyModel} from "./patient2020/dummy1.model";
import {map} from "rxjs/operators";

@Injectable({
  providedIn: 'root'
})


export class RecentPatList {

  api = {  patinetList: `/list/version2020/may` };
  constructor(private http: HttpClient) {}


 testGetCall() {
    return this.http.get<dummyModel>(`${this.api.patinetList}`).subscribe(resp => {
      console.log("RESPONSE", resp);
    });
  }
}

my-service.spec.ts

import { RecentPatList } from './recentList.service';
import { TestBed, getTestBed, inject } from '@angular/core/testing';
import {
  HttpClientTestingModule,
  HttpTestingController
} from '@angular/common/http/testing';
import { Observable } from 'rxjs/Observable';

describe('RecentPatList', () => {
  let injector;
  let service: RecentPatList;
  let httpMock: HttpTestingController;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [HttpClientTestingModule],
      providers: [RecentPatList]
    });

    injector = getTestBed();
    service = injector.get(RecentPatList);
    httpMock = injector.get(HttpTestingController);
  });

  describe('#testGetCall', () => {
    it('should return an Observable<[]>', () => {
      const dummyUsers = [
        {
          // test data 0        
          {
            // netsted test data 0
          }
        },
        {
          // test data  1        
          {
            // netsted test data 1
          }
        }
      ];

      service.testGetCall().subscribe(data => {
        expect(data.length).toBe(2);
        expect(data).toEqual(dummyUsers);
      });

      const req = httpMock.expectOne(`/list/version2020/may`);
      expect(req.request.method).toBe('GET');
      req.flush(dummyUsers);
    });
  });
});

I couldn't understand what I'm doing wrong even after gone through lots of tutorials.

Answer 1

You are calling subscribe on subscription like the error said. testGetCall() returns a subscription.

Change .subscribe() to pipe() in testGetCall .

For best practices,

change `

testGetCall() {
    return this.http.get<dummyModel>(`${this.api.patinetList}`).subscribe(resp => {
      console.log("RESPONSE", resp);
    });
  }`

to

 testGetCall() {
    return this.http.get<dummyModel>(`${this.api.patinetList}`)
      .pipe(
        tap((resp)=> console.log("RESPONSE", resp))
       );
  }