組件是https://github.com/valor-software/ngx-bootstrap下拉列表。Angular2茉莉花單元測試組件與第三方指令
模板我有這樣的:
<span dropdown placement="bottom right">
<a id="droplist-label" href="javascript:void(0)" dropdownToggle>
<span>{{conf.title}}</span>
</a>
<ul class="dropdown-menu pull-right" *dropdownMenu>
<li *ngFor="let item of items">
<a class="dropdown-item" (click)="listClick(item.value)" href="javascript:void(0)">{{item.label}}</a>
</li>
</ul>
</span>
未添加了UL,直到標籤被點擊 - 爲此我不能在測試訪問它。
調用點擊:
let droplist = fixture.debugElement.query(By.css('#droplist-label')).nativeElement;
droplist.click();
不工作 - 如果我試圖尋找dropdown-menu
是空的:
it('should test if droplist has title', async(() => {
fixture.detectChanges();
let droplist = fixture.debugElement.query(By.css('#droplist-label')).nativeElement;
droplist.click();
fixture.whenStable().then(() => {
let droplistOptions = fixture.debugElement.queryAll(By.css('.dropdown-item'));
expect(droplistOptions.length).toBeGreaterThan(0);
});
}));
該指令有click事件的hostlistener似乎 - 我怎麼能觸發它,使得ul變得可用?
好像如果組件使用內 - queryAll不正確,如果你看一下被任何的裏面去工作。必須使用.children來獲取元素列表。 – Agony
同樣的問題對我來說... –
@ M'sieurToph'看看我的答案。 – Agony