bug(mat-dialog): Memory leak after close mat-dialog

[christophedurupt-yooz]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

When open and then close a mat-dialog, the elements linked to the mat-dialog and its contents remain in the DOM in memory in "Detached elements" state.
Each time a mat-dialog is opened/closed the phenomenon repeats itself, and the number of "detached elements" only increases.

Reproduction

Steps to reproduce:

1. Create new angular project
2. Create dialog component (like this: https://material.angular.io/components/dialog/overview)
3. put a element in the dialog-component.html
4. compile
5. open chrome dev tools -> memory
6. take a first snapshot with memory dev tools
7. open and close the dialog multiple times, use the garbage collector afterwards
8. take a second snapshot with memory dev tools
9. compare the two snapshots
10. look at "detached"
    => several count (for each open/close mat-dialog) of "Detached <mat-dialog-container" (and all children) stay in the DOM

Expected Behavior

After mat-dialog closed, we expect not to see "Detached " in memory (to prevent from memory leak)

Actual Behavior

Environment

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

[crisbeto]

I took a look and all the places retaining those elements are outside of Material. Sometimes the dev tools (e.g. InspectorOverlayHost) end up retaining references to elements. Closing since it's outside of our control.

[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.}