Angular 2可观察的服务集成测试

Question

我想创建一个集成测试并点击我的实际服务(而不是模拟(。在Angular 2中我该怎么做？

这是我可观察的服务所拥有的：

import { Injectable } from '@angular/core';
import { Http, Response, RequestOptions, Headers } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import 'rxjs/add/observable/throw';
import { UserDetail } from '../models/user-detail.model';
export class GetUserDetailService {
  private _userDetailUrl : string = 'http://ourserver/api/GetCurrentUserDetail';
  constructor(private _http: Http) { }
  getUserDetail(): Observable<UserDetail> {
        return this._http.get(this._userDetailUrl)
        .map((response: Response) => <UserDetail> response.json())
        .do(data => console.log('All: ' +  JSON.stringify(data)))
        .catch(this.handleError);
  }
  private handleError(error: Response) {
      console.error(error);
      return Observable.throw(error.json().error || 'Server error');
  }
}

如何确保从服务返回对象？

// Third party imports
import { Observable } from 'rxjs/Observable';
import { HttpModule } from '@angular/http';
// Our imports
import { GetUserDetailService } from './get-user-detail.service';
import { UserDetail } from '../models/user-detail.model';
describe('GetUserDetailService', () => {
  beforeEach(() => {
    // What do I put here?
  });
  it('should get the user detail', () => {
    // What do I put here?
  });
});

Answer 1

如本示例所示，在Angular中进行XHR集成测试的一种方法就是仅使用HttpModule不用MockBackend：

describe('GetUserDetailService', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      provide: [GetUserDetailService],
      imports: [HttpModule]
    });
  });
  it('should get user detail', async(inject([Http, GetUserDetailService], (http, svc) => {
    spyOn(http, 'get').and.callThrough();
    svc.getUserDetail().subscribe(
      (userDetail: UserDetail) => {
        expect(userDetail).toEqual(...);
      }
    );
    expect(http.get).toHaveBeenCalledWith(...);
  })));
  it('shouldnot get user detail', async(inject([Http, GetUserDetailService], (http, svc) => {
    spyOn(http, 'get').and.callThrough();
    spyOn(svc, 'handleError').and.callThrough();
    svc._userDetailUrl = 'wrong url';
    svc.getUserDetail().subscribe(
      (userDetail: UserDetail) => { throw new Error('should fail') },
      (error) => {
        expect(svc.handleError).toHaveBeenCalledWith(...);
        expect(error).toEqual(...);
      }
    );
    expect(http.get).toHaveBeenCalledWith('wrong url');
  })));
});

fakeAsync助手不能在真正的异步测试中使用(如果使用时应该存在错误(，所以它是 async。

如果可观察到的错误，第一个测试会自动失败，因此不必在subscribe中捕获。