bug([mat-table]): mat-tab-group messes up expandable rows in table

[aklajnert]

Reproduction

Stackblitz project: https://stackblitz.com/edit/github-itepdn
To see the bug, just open the app, switch to the second tab and go back to the first one.
The bug only shows with enabled Ivy compiler.

Expected Behavior

Switching tabs in mat-tab-group shouldn't affect the expanded rows in the table.

Actual Behavior

All rows in the table are expanded after switching to the second tab and back. This shouldn't be possible as normally the table allows only for one expanded row at a time.

Environment

• Angular: 9.1.0
• CDK/Material: 9.2.0
• Browser(s): Chrome
• Operating System (e.g. Windows, macOS, Ubuntu): Windows and Ubuntu
• Enabled Ivy

[raibait-merix]

I face the same issue. Manually disabling Ivy in tsconfig.json helps, but obviously thats not a solution.

[aklajnert]

@raibait-merix thanks for pointing that out, seems like disabling Ivy is a good workaround. I've updated my stackblitz example to reflect that.

[Diralytic]

Is there any other solution yet?

[andrewseguin]

This is an issue related to how Angular handles animations. To resolve this, you can lazily load your tab content as a workaround.

https://stackblitz.com/edit/github-itepdn-3sq67o?file=src/app/app.component.html

    <mat-tab label="Table">
       <ng-template matTabContent>
         <app-table></app-table>
       </ng-template>
    </mat-tab>

[Diralytic]

@andrewseguin Thank you for the workaround, but i don't want to lazily load the tab.
Please re-open this issue, it's not fixed yet.

[aklajnert]

@andrewseguin I confirm that switching to lazy-loading fixed the issue for me, I'm good with that.
However, as I understand - the bug is still there and this is just a workaround. Not sure if the issue should be closed already.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}