Модульное тестирование http сервиса на Angular 5

Question

Я довольно озадачен тем, как протестировать службу данных, просто слишком много возможностей, и это ошеломляет.

У меня есть такая простая служба:

@Injectable()
export class DataService {

  constructor(private _http: HttpClient) { }

  getData<T>(path: string): Observable<T> {
    return this._http.get<T>(path);
  }

}

Я хочупроверить, что вызов getData<number>, на самом деле, вернет тип данных number.

Руководство по угловому тестированию *1011* разочаровывает, показывает несколько способов (используйте testbed, используйте beforeEach, используйте жасмин без testBed) и я попробовал их все, но без особого успеха.

Как мне это сделать, пожалуйста?Я до сих пор не смог даже дойти до вызова getData.Я хочу иметь возможность смоделировать Http, выдать ложные возвращаемые значения (как в jasmine.spy.and.returnValue(mockData)) и проверить, что dataService в порядке

У меня есть это в моем data.service.spec.ts:

describe('DataService', () => {

  beforeEach(() => {

    TestBed.configureTestingModule({
      imports: [
        HttpClientModule
      ],
      providers: [
        DataService,
        HttpClient
      ]
    });

  });

  // This was auto generated, and works
  it('should be created', inject([DataService], (service: DataService) => {
    expect(service).toBeTruthy();
  }));

  // I added this, but doesn't work
  describe('When getData() is called', () => {

    it('should return an observable of type T', inject([DataService], (service: DataService) => {

      service.getData<number>('mock-url')
        .subscribe(data => {
          expect(typeof(data)).toBe('number');
        });

    }));

  });

});

Когда я говорю, что это не работает ... второй тест проходит!но это не должноЯ вижу, как реальный запрос отправляется на консоли разработчика по (недействительному) URL-адресу, и эти ошибки выдаются, как и ожидалось, но тест просто проходит ...

Так что, я думаю, мой вопрос просто в Angular5, как мне издеваться над моим бэкэнд-сервисом и тестировать его, пожалуйста?

Answer 1

попробуйте проверить это так, используя метод flush

 inject(
  [HttpTestingController, DataService],
  (httpMock: HttpTestingController, service: DataService) =>{
     const mockResponse = 5;
     const mock-url = '...';

     service.getData<number>('mock-url').subscribe(data => {
        expect(data).toEqual(mockResponse);
         expect(typeof(data)).toBe('number');
    });

    const mockRequest = httpMock.expectOne((req: HttpRequest<any>) => req.url === mock-url); //get your request here

    expect(mockRequest.request.method).toBe('GET');

    mockRequest.flush(mockResponse);
   })