组件是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