コンポーネント内のコンポーネントの単位テスト角度4

Question

ブログの投稿thoughtramを使用してタブコントロールを使用しています。ここには同じもののplnkrがあります。

タブコンポーネントを内部的に使用しているタブコンポーネントのユニットテストケースを作成しようとしていました。そして、Angular 4でどうすればいいのかわからないので、Jasmineとしてください。

タブのコンポーネントにタブを挿入して、ngAfterContentInit()とselectTab()メソッドをカバーする方法はありますか？

おかげ..

Answer 1

私は以下のように、その上のテストコンポーネントと実行アサーションにラッピングすることにより、ユニットテストtabsでしょう：

@Component({ 
    template: ` 
    <tabs> 
     <tab title="tab-1"></tab> 
     <tab title="tab-2"></tab> 
    </tabs>`, 
}) 
class TestTabsComponent { } 


describe("Component: Tabs",() => { 
    let component: TestTabsComponent; 
    let fixture: ComponentFixture<TestTabsComponent>; 

    beforeEach(() => { 
    TestBed 
     .configureTestingModule({ 
     declarations: [ 
      TabsComponent, 
      TabComponent, 
      TestTabsComponent, 
     ], 
     }); 

    fixture = TestBed.createComponent(TestTabsComponent); 
    component = fixture.componentInstance; 
    }); 

    it('should have tab title', async(() => { 
    fixture.detectChanges(); 
    let compiled = fixture.debugElement.queryAll(By.css('tab')); 
    expect(compiled[0].nativeElement.title).toBe('tab-1'); 
    expect(compiled[1].nativeElement.title).toBe('tab-2'); 
    })); 

    afterEach(() => { 
    fixture.destroy(); 
    }); 
}); 

はそれが役立つだろう願っています！