测试Http Service进行多次调用并返回observable而不映射响应

Question

我有一个数据服务,它从服务器获取数据并生成多个请求,然后返回一个可观察数组.我想测试数据.

我尝试做的是在我发送的mockrespone数组中包含两个observables我不知道这是否是测试数据的正确方法.

但测试失败,尤其是异步测试块中的最后三个测试

重要提示:我想测试一下,当将charId设置为falsy并将comicsId设置为falsy时,调用方法,订阅它返回的observable,在你模拟了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 实例。

另外，您不是在模拟 getChart() 方法，通过模拟后端，您是在模拟每个 http 调用，而不是方法 getChar() 本身。该数组必须是 length === 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 的值而执行的调用数量。

希望这可以帮助。