如何测试Angular mat-nav-list是否包含元素?

时间:2019-03-26 11:07:43

标签: javascript angular unit-testing karma-jasmine jasmine2.0

我想检查Angular mat-nav-list是否包含元素。

我可以用fixture.debugElement.query(By.css('.items'))来选择它,但是我不确定如何检查它是否包含任何东西。

我的模板:

<mat-nav-list class="items">
    <a class="list-item" mat-list-item *ngFor="let item of items">
        <app-item-display [item]="item"></app-item-display>
    </a>
</mat-nav-list>

在我的测试中,我注入了1个项目并期望它能够渲染。 虽然组件确实包含一个项目,但我想检查它是否在列表中呈现。

1 个答案:

答案 0 :(得分:2)

尝试queryAll

const items= fixture.debugElement.queryAll(By.css('.list-item'));

然后您可以在伪造物品列表之后检查长度是否正确

expect(items.length).toBe(2) // or your fake data length