diff --git a/src/material/tooltip/tooltip.spec.ts b/src/material/tooltip/tooltip.spec.ts index d4e7765c28e1..b5ef3c043d84 100644 --- a/src/material/tooltip/tooltip.spec.ts +++ b/src/material/tooltip/tooltip.spec.ts @@ -627,6 +627,25 @@ describe('MatTooltip', () => { expect(overlayContainerElement.textContent).toBe(''); })); + it('should hide when clicking away with an auxilliary button', fakeAsync(() => { + tooltipDirective.show(); + tick(0); + fixture.detectChanges(); + tick(500); + + expect(tooltipDirective._isTooltipVisible()).toBe(true); + expect(overlayContainerElement.textContent).toContain(initialTooltipMessage); + + dispatchFakeEvent(document.body, 'auxclick'); + tick(0); + fixture.detectChanges(); + tick(500); + fixture.detectChanges(); + + expect(tooltipDirective._isTooltipVisible()).toBe(false); + expect(overlayContainerElement.textContent).toBe(''); + })); + it('should not hide immediately if a click fires while animating', fakeAsync(() => { tooltipDirective.show(); tick(0); diff --git a/src/material/tooltip/tooltip.ts b/src/material/tooltip/tooltip.ts index 28f374f62393..54c26086bbe3 100644 --- a/src/material/tooltip/tooltip.ts +++ b/src/material/tooltip/tooltip.ts @@ -697,6 +697,7 @@ export class MatTooltip implements OnDestroy, AfterViewInit { // won't be rendered if the animations are disabled or there is no web animations polyfill. '[style.zoom]': '_visibility === "visible" ? 1 : null', '(body:click)': 'this._handleBodyInteraction()', + '(body:auxclick)': 'this._handleBodyInteraction()', 'aria-hidden': 'true', } })