Как получить все элементы родительского

Question

Извините за вопрос новичка, но я новичок в этом тесте Angular.

У меня есть большой HTML-файл, в котором я пытаюсь найти содержимое ниже:

<clr-button-group class="btn-sm btn-icon" id="leaseBtnGroup">
        <clr-button *ngFor="let day of leaseOptions" 
        [clrInMenu]="day !== 7" 
        (click)="performVmAction(vm, 'extend_lease', day)"
        [disabled]="vm.action?.loading"> {{day}} </clr-button>
</clr-button-group>

Итак, я пытаюсь это:

const debugElement = fixture.debugElement.query(By.css('#leaseBtnGroup'));

Это получит:

<clr-button-group .. element.

Теперь я пытаюсь получить все дочерние узлы для этого и пытаюсь это:

const childElements = debugElement.nativeElement.children;
forEach(childElements, (eachElement) => {
   eachElement.click(); 
   console.log(eachElement.textContent); // but this doesnt print all.
})

Но приведенный выше код не получает все дочерние узлы. Может кто-нибудь, пожалуйста, помогите мне здесь.

Вот мой полный тест:

fit('should call extend lease with correct parameter on button click', () => {
component.allVMs = testVMs;
component.leaseOptions = [7, 6, 5, 4, 3, 2, 1];
fixture.detectChanges();
const debugElement = fixture.debugElement.query(By.css('#leaseBtnGroup'));
const leaseElements = debugElement.nativeElement.children;
forEach(leaseElements, (eachLeaseElement) => {
  eachLeaseElement.click();
  console.log(eachLeaseElement.textContent);
});
});