Treecomponent is coming undefined in test cases

[bhawin]

Minimal reproduction of the bug/regression with instructions:

1: I am using a tree component with nodes as :
{
level: 1,
levelDescription: 'hello',
children: [{
level: 2,
levelDescription: 'hello1'
}],
}

options: {
useCheckbox: true,
displayField: 'levelDescription',
useVirtualScroll: true
}

I am referencing the tree in my ts file like this :
@ViewChild('tree') tree: TreeComponent;

I have a function , where i am calling on clicking of checkbox:

check(node) {
this.tree.treeModel.collapseAll();
node.toggleSelected();
this.onTreeLoad(true);
}

<tree-root #tree [nodes]="nodes" [options]="options" (initialized)="onTreeLoad()">
This is my code in html

Now , this code works well in browser , but when i test check()
function in unit testing , it gives error :

TypeError: Cannot read property 'treeModel' of undefined

Versions of Angular Tree Component, Angular, Node, affected browser(s) and operating system(s):

"@circlon/angular-tree-component": "^11.0.4",
angular 9

Other information:

I would be willing to submit a PR to fix this issue

[ ] Yes (Assistance will be provided if you need help to submit a pull request)
[ ] No

[kwbonte]

Our team has some fairly complex actions associated with the expansion of trees and I have found that we needed to use ngAfterViewInit to ensure we grabbed the tree component for expansion, in our test cases we used component.AfterViewInit to explicitly ensure that the treeComponent exists. This changed with Angular 11 because they treat ng-container differently now. Worth a look into the angular lifecycle, here's an overview https://angular.io/guide/lifecycle-hooks