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(); } } }