Как проверить, содержит ли Angular mat-nav-list элемент?

Question

Я хотел бы проверить, содержит ли 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 элемент и ожидаю его визуализации.Хотя компонент содержит элемент, я хотел бы проверить, отображается ли он в списке.

Answer 1

попробуйте queryAll

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

, а затем вы можете проверить правильность длины после списка поддельных предметов

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