diff --git a/src/lib/tooltip/tooltip.spec.ts b/src/lib/tooltip/tooltip.spec.ts index bb3e6eb9548..951a5d50bae 100644 --- a/src/lib/tooltip/tooltip.spec.ts +++ b/src/lib/tooltip/tooltip.spec.ts @@ -113,6 +113,26 @@ describe('MatTooltip', () => { expect(tooltipDirective._tooltipInstance).toBeNull(); })); + it('should be able to re-open a tooltip if it was closed by detaching the overlay', + fakeAsync(() => { + tooltipDirective.show(); + tick(0); + expect(tooltipDirective._isTooltipVisible()).toBe(true); + fixture.detectChanges(); + tick(500); + + tooltipDirective._overlayRef!.detach(); + tick(0); + fixture.detectChanges(); + expect(tooltipDirective._isTooltipVisible()).toBe(false); + flushMicrotasks(); + expect(tooltipDirective._tooltipInstance).toBeNull(); + + tooltipDirective.show(); + tick(0); + expect(tooltipDirective._isTooltipVisible()).toBe(true); + })); + it('should show with delay', fakeAsync(() => { expect(tooltipDirective._tooltipInstance).toBeUndefined(); diff --git a/src/lib/tooltip/tooltip.ts b/src/lib/tooltip/tooltip.ts index 8e12056e2e1..4e37dbacc4f 100644 --- a/src/lib/tooltip/tooltip.ts +++ b/src/lib/tooltip/tooltip.ts @@ -255,13 +255,13 @@ export class MatTooltip implements OnDestroy { /** Create the tooltip to display */ private _createTooltip(): void { - let overlayRef = this._createOverlay(); - let portal = new ComponentPortal(TooltipComponent, this._viewContainerRef); + const overlayRef = this._createOverlay(); + const portal = new ComponentPortal(TooltipComponent, this._viewContainerRef); this._tooltipInstance = overlayRef.attach(portal).instance; - // Dispose the overlay when finished the shown tooltip. - this._tooltipInstance!.afterHidden().subscribe(() => { + // Dispose of the tooltip when the overlay is detached. + overlayRef.detachments().subscribe(() => { // Check first if the tooltip has already been removed through this components destroy. if (this._tooltipInstance) { this._disposeTooltip();