測試ngSwitch茉莉

Question

我有一段HTML在我的組件：

<div [ngSwitch]="data.mode" class="data-mode"> 
    <span ngSwitchWhen="mode1">Mode 1 Activated</span> 
    <span ngSwitchWhen="mode2">Mode 2 Activated</span> 
</div> 

，我想通過卡瑪 - 茉莉對它進行測試。我可以得到根元素

const headerMode = fixture.debugElement.query(By.css(".data-mode")); 

此方法返回2種元素的根節點，但我看不出這兩者是有效的。

我該怎麼做？

Answer 1

By.css('.data-mode > span')應該返回激活的元素。請記得致電fixture.detectChanges();強制Angular的變化檢測運行，並在測試前影響測試中的元素。