tooltip: buggy when deployed as an Angular Element

#### What is the expected behavior?
That tooltips are not buggy.

#### What is the current behavior?
Tooltips are buggy.

#### What are the steps to reproduce?
_app.module.ts_
`import { MatTooltipModule } from '@angular/material/tooltip';`

_somecomponent.component.html_
`
ÅPNE`

And then deploy the whole project as an Angular Element.

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Angular CLI: 7.3.6
Node: 10.15.2
OS: win32 x64
Angular: 7.2.10
@angular/material 7.3.5
typescript 3.1.1
Chrome Version 73.0.3683.86 (Official Build) (64-bit)

#### Is there anything else we should know?

Every time i hover on the button, a small grey "blob" is added to a "row" under the address-field in my browser.

When i click the button, a "tick()" is triggered (because angular elements needs that without ngZone) and the row of grey blobs is replaced with the tooltip. It's in the wrong spot, but it's there. I suspect this has something to do with how "Angular Elements" work? Since the grey blobs were only "converted" to the tooltip after a "tick()"?

@levgaas posted the same issue a year ago, but did not specify how he managed to fix it: https://github.com/angular/material2/issues/11361

Riproduci il problema usando app.module.ts, somecomponent.component.html, MatTooltipModule e matTooltip durante il deployment del progetto come Angular Element. Inizia osservando il comportamento al passaggio del mouse e al clic nella configurazione segnalata con Angular 7.2.10 e Material 7.3.5. Il lavoro è completo quando il passaggio del mouse produce un solo tooltip posizionato correttamente, senza accumulo di macchie grigie né necessità di un tick() manuale.

Scritto dal modello di indicizzazione a partire dal testo della issue.