MdTooltip leaking dom nodes when used in element inside *ngIf

[diginikkari]

Bug, feature request, or proposal:

Bug: MdTooltip is leaking dom nodes when used inside *ngIf

What is the expected behavior?

When parent element is destroyed by *ngIf, it's child nodes should be released and collected by garbage collection.

What is the current behavior?

None of the nodes inside element containing *ngIf are cleared from memory when there is element with MdTooltip -directive.

What are the steps to reproduce?

• Open chrome devtools and take heap -snapshot.
• Toggle tooltip item visible ten times.
• Press garbage collection
• Take a new heap -snapshot
• Compare with latest snapshot
• There are 10 new MdTooltip and 10 text nodes created and 0 deleted. So delta is +10.

<button (click)="showTooltip = !showTooltip">Toggle tooltip</button>
<br>
<div *ngIf="showTooltip">
  <span mdTooltip="Tooltip!">Show tooltip</span>
  <p>XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</p>
</div>

Example plunker:
https://plnkr.co/edit/6ayP5LKlM62GUwCpP6Fg?p=preview

What is the use-case or motivation for changing an existing behavior?

Save memory

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 4.2.3
Material 2.0.0-beta.7

Is there anything else we should know?

I'm not too familiar regarding memory management so correct me if I'm misunderstanding how this should work.

[willshowell]

Sounds similar to #4499. Does that look like what you're experiencing?

[diginikkari]

Yes, it's looks exactly same. Don't know why I didn't find that issue.

I also tested without hammerjs and there were no leak. So it seems to be related to that.

dupe #4499

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