fix(tooltip): should not emit hide event multiple times

Author: RivaIvanova

projects/igniteui-angular/src/lib/directives/tooltip/tooltip-target.directive.ts

@@ -211,6 +211,8 @@ export class IgxTooltipTargetDirective extends IgxToggleActionDirective implemen
             return;
         }
 
+        this.target.tooltipTarget = this;
+
         this.checkOutletAndOutsideClick();
         const shouldReturn = this.preMouseEnterCheck();
         if (shouldReturn) {
@@ -303,6 +305,9 @@ export class IgxTooltipTargetDirective extends IgxToggleActionDirective implemen
         this._overlayDefaults.closeOnEscape = true;
 
         this.target.closing.pipe(takeUntil(this.destroy$)).subscribe((event) => {
+            if (this.target.tooltipTarget !== this) {
+                return;
+            }
             const hidingArgs = { target: this, tooltip: this.target, cancel: false };
             this.tooltipHide.emit(hidingArgs);
 
@@ -335,6 +340,8 @@ export class IgxTooltipTargetDirective extends IgxToggleActionDirective implemen
     public showTooltip() {
         clearTimeout(this.target.timeoutId);
 
+        this.target.tooltipTarget = this;
+
         if (!this.target.collapsed) {
             //  if close animation has started finish it, or close the tooltip with no animation
             this.target.forceClose(this.mergedOverlaySettings);

projects/igniteui-angular/src/lib/directives/tooltip/tooltip.directive.spec.ts

@@ -582,6 +582,32 @@ describe('IgxTooltip', () => {
             expect(targetOne.hideTooltip).not.toHaveBeenCalled();
             expect(targetTwo.hideTooltip).toHaveBeenCalledTimes(1);
         }));
+
+        it('should not emit tooltipHide event multiple times', fakeAsync(() => {
+            spyOn(targetOne.tooltipHide, 'emit');
+            spyOn(targetTwo.tooltipHide, 'emit');
+
+            hoverElement(buttonOne);
+            flush();
+
+            const tooltipHideArgsTargetOne = { target: targetOne, tooltip: fix.componentInstance.tooltip, cancel: false };
+            const tooltipHideArgsTargetTwo = { target: targetTwo, tooltip: fix.componentInstance.tooltip, cancel: false };
+
+            unhoverElement(buttonOne);
+            tick(500);
+            expect(targetOne.tooltipHide.emit).toHaveBeenCalledOnceWith(tooltipHideArgsTargetOne);
+            expect(targetTwo.tooltipHide.emit).not.toHaveBeenCalled();
+            flush();
+
+            hoverElement(buttonTwo);
+            flush();
+
+            unhoverElement(buttonTwo);
+            tick(500);
+            expect(targetOne.tooltipHide.emit).toHaveBeenCalledOnceWith(tooltipHideArgsTargetOne);
+            expect(targetTwo.tooltipHide.emit).toHaveBeenCalledOnceWith(tooltipHideArgsTargetTwo);
+            flush();
+        }))
     });
 
     describe('Tooltip integration', () => {