2017-04-10 6 views
4

コンポーネントはhttps://github.com/valor-software/ngx-bootstrapドロップダウンです。テンプレートでAngular2ジャスミン単位テストコンポーネントと第三者指令

私はこれを持っている:

ラベルがクリックされるまで、ULが追加されていない
<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> 

- その私はテストでそれにアクセスすることはできません。

クリックコール:

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); 
    }); 
})); 

ディレクティブは、それが思わクリックイベントのためhostlistenerている - どのようにすることができますがulが利用可能になるようにトリガーしますか?

+0

はそう - あなたは