如何获取父母的所有元素

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.

现在，我正在尝试为此获取所有childs节点，并尝试以下方法：

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