开玩笑测试Angular 6 Service

时间:2018-07-31 15:19:44

标签: angular typescript rxjs observable jestjs

你好,我有点被困在这里,所以我决定打开这个问题,

我正在尝试使用Jest测试服务。但是,即使没有通过所有测试,也都可以通过。

这是软件版本:

Angular v6.0.1 RxJs v6.2.1 笑话v23.1.0

我的服务如下(此时应该非常简单):

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { map, tap } from 'rxjs/operators';

import { BaseApiService } from './base-api.service';

@Injectable({ providedIn: 'root' })
export class ListsService extends BaseApiService {
  private static readonly LISTS_API = 'http://localhost:3000/lists';
  constructor(protected httpClient: HttpClient) {
    super();
  }
  public list(): Observable<BasicList[]> {
    return this.httpClient
      .get<BasicList[]>(ListsService.LISTS_API, BaseApiService.httpOptions)
      .pipe(map((res: Response) => res.json()));
  }
}

实际上,我确实有两个测试出于相同的目的,就像我在读此article时试图学习如何在没有测试床的情况下进行测试一样,所以这是TestBed的测试:

import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { inject, TestBed } from '@angular/core/testing';

import { ListsService } from './lists.service';

const basicListData = [
  {
    id: 1,
    name: "name 1"
  },
  {
    id: 2,
    name: "name 2"
  }
];

describe('Service: List Service', () => {
  let httpMock: HttpTestingController;
  let service: ListsService;

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

  beforeEach(inject([ListsService, HttpTestingController], (_service, _httpMock) => {
    service = _service;
    httpMock = _httpMock;
  }));

  it('list: should return a sorted list', () => {
    service.list().subscribe(lists => {
      expect(lists.length).toBe(2);
    });

    const req = httpMock.expectOne('http://localhost:3000/lists');
    req.flush(basicListData);
    httpMock.verify();
  });
});

问题与Expect.ToBe(2)表达式有关。因为我在那里写的数字都没有关系。只是认为还可以。即使您只写1000或0。而且我知道我可能会丢失某些内容,但无法弄清楚。

这也是相同的测试,但没有测试床:

import { of } from 'rxjs';

import { ListsService } from './lists.service';

const basicListData = [
  {
    id: 1,
    name: "name 1"
  },
  {
    id: 2,
    name: "name 2"
  }
];

const provide = (mock: any): any => mock;

describe('Service: Lists', () => {
  let listsService: ListsService;

  const http = { get: jest.fn(() => of(basicListData)) };
  beforeEach(() => {
    listsService = new ListsService(provide(http));
  });

  it('list$: Should return a list of List definitions', () => {
    listsService.list().subscribe(lists => {
      expect(http.get).toBeCalledWith('http://localhost:3000/lists');
      expect(lists.length).toBe(3);
    });
  });
});

在这个端点上都没有检查它,因此事件在那里丢失了更多。

在此先感谢您提供任何帮助,我希望这个问题能得到正确解释。

2 个答案:

答案 0 :(得分:1)

我遇到了同样的问题,为了解决这个问题,我使用了done。该测试在订阅完成之前执行,并完成迫使它等待。

 it('list$: Should return a list of List definitions', (done) => {
    listsService.list().subscribe(lists => {
      expect(http.get).toBeCalledWith('http://localhost:3000/lists');
      expect(lists.length).toBe(3);

done();

    });
  });

答案 1 :(得分:0)

似乎您需要在此处使用断言。由于操作是异步的,因此您的测试通过了,因为案例在调用回调之前执行。因此,“期望”永远不会被调用。您可以在这样调用断言之后尝试返回一个Promise:

it('list$: Should return a list of List definitions', () => {
    expect.assertions(1);
    return listsService.list().toPromise().then(
      lists => {
        expect(http.get).toBeCalledWith('http://localhost:3000/lists');
        expect(lists.length).toBe(3);
      });
  });