Angular2 HTTP呼び出しのテストは二回実行

Question

私は私のテストが2回実行されている

@Component({ 
    selector: 'Techs', 
    template: '', 
    providers: [HTTP_PROVIDERS] 
}) 
export class Techs { 
    public techs: Tech[]; 

    constructor(http: Http) { 
    http 
     .get('src/app/techs/techs.json') 
     .map(response => response.json()) 
     .subscribe(result => this.techs = result); 
    } 
} 

単純なコンポーネントとAngular2アプリを持っています

クローム49.0.2623する（Mac OS X 10.11.4） ：実行さ6の0 SUCCESS（0秒/ 0秒）

LOG： 'テストの終わり'

クロム49.0.2623する（Mac OS X 10.11.4）：実行さ6 6のSUCCESS（0.182私は、HTTPのテストを1回だけ実行され呼び出す削除する場合秒/ 0.153秒）しかし

クローム49.0.2623する（Mac OS X 10.11.4）：実行される6 SUCCESSの6（0.182ここでは秒/ 0.153秒）

は私のテスト

describe('techs component',() => { 
    it('should render 3 elements <tech>', injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => { 
    return tcb 
     .createAsync(Techs) 
     .then(fixture => { 
     fixture.componentInstance.techs = [{}, {}, {}]; 
     fixture.detectChanges(); 
     const techs = fixture.nativeElement; 
     expect(techs.querySelectorAll('tech').length).toBe(3); 
     }); 
    })); 
}); 

Answer 1

である私はあなたの問題は、非同期のASPEから来ていると思いますあなたのHTTPコールのct。もう一つの方法は、あなたのHTTPオブジェクトは、HTTP呼び出しをシミュレートするためにモックになり

• ：私はこれを修正する2つの方法を見ることになります。これは、MockBackendクラスを使用して行うことができます。ここで

XHRBackendクラスに対してそれを設定することです：

beforeEachProviders(() => { 
    return [ 
    HTTP_PROVIDERS, 
    provide(XHRBackend, { useClass: MockBackend }), 
]; 
}); 

、あなたが反応して欲しいものを返す方法：

it('Should return a list of dogs', inject([XHRBackend, HttpService, Injector], (mockBackend, httpService, injector) => { 
    mockBackend.connections.subscribe(
    (connection: MockConnection) => { 
     connection.mockRespond(new Response(
     new ResponseOptions({ 
      body: [ { name: 'test' }, ... ] 
     }))); 
    } 
    (...) 

• ご使用することができ、おそらく何かAngular2の偽の非同期サポート。この方法で非同期処理を同期的に制御することができます... https://angular.io/docs/ts/latest/api/testing/fakeAsync-function.htmlを参照してください。