From 04045d2fadf96620e95f02758569ad387b0a8559 Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Tue, 27 Mar 2018 18:59:11 +0200
Subject: [PATCH] feat(tooltip): allow for position to be updated while open
 (#10362)

Allows for the position of a tooltip to be updated while it's still open. Previously we closed the tooltip, because it wasn't possible for the overlay position to be updated.
---
 src/demo-app/tooltip/tooltip-demo.scss |  2 +-
 src/lib/tooltip/tooltip.spec.ts        | 28 +++++++++++---------------
 src/lib/tooltip/tooltip.ts             |  5 ++---
 3 files changed, 15 insertions(+), 20 deletions(-)

diff --git a/src/demo-app/tooltip/tooltip-demo.scss b/src/demo-app/tooltip/tooltip-demo.scss
index e76bfadce79..f9f3fefa071 100644
--- a/src/demo-app/tooltip/tooltip-demo.scss
+++ b/src/demo-app/tooltip/tooltip-demo.scss
@@ -5,7 +5,7 @@
     overflow: auto;
 
     button {
-      margin: 16px;
+      margin: 75px 16px 16px;
     }
   }
   .mat-radio-button {
diff --git a/src/lib/tooltip/tooltip.spec.ts b/src/lib/tooltip/tooltip.spec.ts
index 34c0f2d87b7..c417894183d 100644
--- a/src/lib/tooltip/tooltip.spec.ts
+++ b/src/lib/tooltip/tooltip.spec.ts
@@ -28,7 +28,6 @@ import {
   MatTooltipModule,
   SCROLL_THROTTLE_MS,
   TOOLTIP_PANEL_CLASS,
-  TooltipPosition,
   MAT_TOOLTIP_DEFAULT_OPTIONS,
 } from './index';
 
@@ -306,24 +305,21 @@ describe('MatTooltip', () => {
       expect(tooltipDirective._isTooltipVisible()).toBe(true);
     }));
 
-    it('should remove the tooltip when changing position', () => {
-      const initialPosition: TooltipPosition = 'below';
-      const changedPosition: TooltipPosition = 'above';
-
-      assertTooltipInstance(tooltipDirective, false);
-
-      tooltipDirective.position = initialPosition;
+    it('should be able to update the tooltip position while open', fakeAsync(() => {
+      tooltipDirective.position = 'below';
       tooltipDirective.show();
-      expect(tooltipDirective._tooltipInstance).toBeTruthy();
+      tick();
 
-      // Same position value should not remove the tooltip
-      tooltipDirective.position = initialPosition;
-      expect(tooltipDirective._tooltipInstance).toBeTruthy();
+      assertTooltipInstance(tooltipDirective, true);
 
-      // Different position value should destroy the tooltip
-      tooltipDirective.position = changedPosition;
-      assertTooltipInstance(tooltipDirective, false);
-    });
+      tooltipDirective.position = 'above';
+      spyOn(tooltipDirective._overlayRef!, 'updatePosition').and.callThrough();
+      fixture.detectChanges();
+      tick();
+
+      assertTooltipInstance(tooltipDirective, true);
+      expect(tooltipDirective._overlayRef!.updatePosition).toHaveBeenCalled();
+    }));
 
     it('should be able to modify the tooltip message', fakeAsync(() => {
       assertTooltipInstance(tooltipDirective, false);
diff --git a/src/lib/tooltip/tooltip.ts b/src/lib/tooltip/tooltip.ts
index ee5cf42d45a..6c3200e927f 100644
--- a/src/lib/tooltip/tooltip.ts
+++ b/src/lib/tooltip/tooltip.ts
@@ -119,10 +119,9 @@ export class MatTooltip implements OnDestroy {
       this._position = value;
 
       if (this._overlayRef) {
-        // TODO(andrewjs): When the overlay's position can be
-        // dynamically changed, do not destroy the tooltip.
-        this._detach();
         this._updatePosition();
+        this._tooltipInstance!.show(value, 0);
+        this._overlayRef.updatePosition();
       }
     }
   }