angular - 测试 Http 服务进行多次调用并在不映射响应的情况下返回可观察的

Question

我有一个数据服务，它从服务器获取数据并发出多个请求，然后返回一个可观察数组。我要测试数据。

我尝试做的是在我发送的 mockrespone 数组中，它包含两个可观察值，我不知道这是否是测试数据的正确方法。

但是测试失败了，尤其是异步测试 block 中的最后三个测试

重要:我想测试一下，当将 charId 设置为 falsy 并将 comicsId 设置为 falsy 时，调用方法，订阅它返回的可观察对象，在你模拟 http 之后，你会得到一个包含两个预期响应的数组。如果 charId 为真，则与 4 预期响应相同。当 comicsId 为真时，6 个预期响应也是如此

//获取数据的服务

getChar(): Observable<any> {

    const Observables = [];
    Observables.push(this.http.get('https://gateway.marvel.com:443/v1/public/characters?apikey'));
    Observables.push(this.http.get('https://gateway.marvel.com:443/v1/public/comics?apikey'));

    if (this.charId) {
      Observables.push(this.http.get(`${this.urlChar}${this.charId}${this.apiKey}`));
      Observables.push(this.http.get(`${this.urlChar}${this.charId}/comics${this.apiKey}`));
    }
    if (this.comicsId) {
      Observables.push(this.http.get(`${this.urlCom}${this.comicsId}${this.apiKey}`));
      Observables.push(this.http.get(`${this.urlCom}${this.comicsId}/creators${this.apiKey}`));
    }
    console.log([Observable, Observable]);
    return Observable.forkJoin(Observables);
  }
}

//我的测试

import { async, ComponentFixture, TestBed, getTestBed, inject } from '@angular/core/testing';
import { MockBackend, MockConnection } from '@angular/http/testing';
import { DataService } from './data.service';
import {
  BaseRequestOptions, Http, XHRBackend, HttpModule,
  Response, ResponseOptions, RequestMethod
} from '@angular/http';
import { Observable } from 'rxjs/Observable';

describe('DataService', () => {
  let mockBackend: MockBackend;

   beforeEach(async(() => {
    TestBed.configureTestingModule({
      providers: [
        DataService,
        MockBackend,
        BaseRequestOptions,
        {
          provide: Http,
          deps: [MockBackend, BaseRequestOptions],
          useFactory:
          (backend: XHRBackend, defaultOptions: BaseRequestOptions) => {
            return new Http(backend, defaultOptions);
          }
        }
      ],
      imports: [
        HttpModule
      ]
    });
    mockBackend = getTestBed().get(MockBackend);
  }));


  it('should get ObservableArr', (done) => {
    let dataService: DataService;

    getTestBed().compileComponents().then(() => {
      mockBackend.connections.subscribe(
        (connection: MockConnection) => {
          connection.mockRespond(new Response(
            new ResponseOptions({
              body: [Observable, Observable]
            }
            )));
        });

      dataService = getTestBed().get(DataService);
      expect(DataService).toBeDefined();

      dataService.getChar().subscribe((obsArr: Observable<any>[]) => {
        expect(obsArr.length).toBeDefined();
        expect(obsArr.length).toEqual(2);
        expect(obsArr.length).not.toBe(1);
        done();
      });
    });
  });


  it('should check the service',
    inject([DataService], (service: DataService) => {
      expect(service).toBeTruthy();
    }));

  it('should get ObservableArray async',
    async(inject([DataService], (dataService: DataService) => {
      mockBackend.connections.subscribe(
        (connection: MockConnection) => {
          connection.mockRespond(new Response(
            new ResponseOptions({
              body: [Observable, Observable]
            }
            )));
        });
      dataService.getChar().subscribe(
        (response) => {
          expect(response.length).toBe(2);
          expect(response[0]).toBe(Observable); <<<<<<<<<<<<<< Fails
          expect(response[1]).toBe(Observable); <<<<<<<<<<<<<< Fails
          expect(response).toEqual([Observable, Observable]); <<<<<< Fails
        });
    })));
});

Answer 1

首先，正如@Aviad P. 指出的那样，forkJoin 方法不返回可观察对象的 Observable 数组...它返回 forkJoin 中每个可观察对象的结果数组，并且observables 的结果不是 Observables 实例。

另外，您不是在模拟 getChart() 方法，您是在模拟后端模拟每个 http 调用，而不是方法 getChar() 本身。该数组的长度必须为 === 2，因为不存在 this.chartId 和 this.comicsId...

所以我会说返回的结构是这样的，所以 response[0] 是一个数组:

response = [[Observable, Observable], [Observable, Observable]]

也就是说，这个期望永远不会为真，因为没有一个数组会等于一个新创建的数组:

expect(response).toEqual([Observable, Observable])

修改所有应该可以解决您的问题的内容。另外，如果你的 Observables 返回了 Observable 实例，你的代码:' body: [Observable, Observable] ' 不返回 Observables 实例，它返回 Observable 定义函数，这将是一个不正确的模拟，尽管测试会通过.

这将是一个失败的测试示例:

const mockResponse = {isMockResponse: true};

it('should get ObservableArray async',
async(inject([DataService], (dataService: DataService) => {
  mockBackend.connections.subscribe(
    (connection: MockConnection) => {
      connection.mockRespond(new Response(
        new ResponseOptions({
          body: {...mockResponse}
        }
        )));
    });
  dataService.getChar().subscribe(
    (response) => {
      expect(response.length).toBe(2);
      expect(response[0].isMockResponse).toBe(true); <<< Is this expect really necessary?
      expect(response[1].isMockResponse).toBe(true); <<< Is this expect really necessary?
    });
})));

也就是说，唯一期望测试您的用例的是这个:

expect(response.length).toBe(2);

其他的是不必要的......所以你不是在测试你正在模拟的数据，你想测试由于变量 this 的值而执行的调用次数。 chartId 和 this.comicsIs。

希望这对您有所帮助。