Question

Angular Experts，

我正在测试我的应用程序，我正在尝试一点。

具体来说，我想通过模拟Http对象来使用真实服务对组件进行单元测试。现在我试图自己存根，所以我在下面制作了 StubHttp 类。

Angular 2：2.4.7 + Karma，Jasmine。

这是它的简化版本：

let mockTest = '{"name":'John', // ...};

export class StubHttp {
  public post(url: string, body: any, options?: RequestOptionsArgs) 
            :Observable<Response> {
    let response = new ResponseOptions({body: JSON.stringify(mockTest)});
    return Observable.of(new Response(response));
  }
}

如果我在控制器中输入日志：

this.UsersService.getAll().subscribe(( data: any ) => {
   console.log('data = ', data);
});

和服务：

getAll( event: LazyLoadEvent) {
    return this.http.post( this.url + this.params, JSON.stringify( this.body ),new RequestOptions({headers: this.header}) )
        .map( response => response.json() )
        .catch( this.handleError );
}

这是输出：

LOG: 'data = ', Promise{}

哪里出错？

Answer 1

我通过使用XHRBackend和mockBackend而不是我的Http Stub来解决。

  it('Should show a list of 10 feed',
    inject([XHRBackend], (mockBackend) => {

      mockBackend.connections.subscribe((connection) => {
        connection.mockRespond(new Response(new ResponseOptions({
          body: {id: 55}
        })));
      });

      // ... 
    }));

https://blog.thoughtram.io/angular/2016/11/28/testing-services-with-http-in-angular-2.html

Angular 2 http存根

1 个答案: