開玩笑測試 Angular 6 服務

Question

你好，我有點卡在這里所以我決定打開這個問題，

我正在嘗試使用 Jest 測試服務。 但是所有的測試都通過了，即使他們不應該。

這是軟件版本：

Angular v6.0.1 RxJs v6.2.1 Jest 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()));
  }
}

實際上，我確實有兩個出於相同目的的測試，因為我在閱讀本文時試圖了解如何在沒有測試平台的情況下進行測試，因此這是使用 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);
    });
  });
});

在這甚至沒有檢查端點，因此事件在那里丟失了一點。

在此先感謝任何形式的幫助，我希望問題得到正確解釋。

Answer 1

我遇到了同樣的問題，為了解決它，我已經完成了。 測試在訂閱完成之前執行並完成強制它等待。

 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();

    });
  });

Answer 2

似乎您需要在這里使用斷言。 由於操作是異步的，您的測試通過，因為案例在調用回調之前執行。 因此永遠不會調用“期望”。 您可以嘗試在像這樣調用斷言后返回一個承諾：

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);
      });
  });