Bug: ngMocks.findInstance does not find AsyncPipe in structural directive

[parloti]

Description of the bug

ngMocks.findInstance does not find AsyncPipe in structural directive like ngIf and ngFor, regardless of whether element is displayed or not.

A repo with an example of the bug

Link: stackblitz

Expected vs actual behavior

ngMocks.findInstance should find the pipe used in the structural directive.

[satanTime]

Hi @parloti,

thanks for the report.

I think, the issue comes because of * sugar, because the real template is like that:

<ng-container [ngFor]="... | async">
    <div class="array">
      item: {{ item }}
    </div>
</ng-container>
<ng-container [ngIf]="... | async">
    <div class="false>false</div>
</ng-container>
<div class="text">{{ text$ | async }}</div>
<ng-container [ngIf]="... | async">
    <div class="true">true</div>
</ng-container>

and therefore the search should be done on ng-container instead of inner nodes, and they should be rendered first.

Anyway, I'll take a look what can be done.

[satanTime]

So, I added "hungry" behavior, if a found element has a "structural directive" on its parent, then the parent also will be scanned.

It won't work with .false, because its div isn't rendered. However, it's possible to find its ngIf and fetch the pipe from it.

Could you test if it does what you expect? ng-mocks.zip

[parloti]

Perfect!
All pipes are found with ngMocks.findInstanceS, I can get the '.false' here.

I can also change
<div class="false" *ngIf="false$ | async">false</div>
to
<div class="false"><div *ngIf="false$ | async">false</div></div>
and it works too.

Thank you very much.

[satanTime]

thanks for feedback, I ran out of CI/CD minutes. Because of that, the fix will be released on the first weekend in May :) Meanwhile, I'll adapt the fix for all angular versions.

[satanTime]

v13.5.0 has been released and contains a fix for the issue. Feel free to reopen the issue or to submit a new one if you meet any problems.