fix: ion tooltip close on scroll (#848)

Brisanet · Sep 28, 2023 · 88d3bd9 · 88d3bd9
1 parent db46be3
commit 88d3bd9
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 0 deletions.
diff --git a/projects/ion/src/lib/tooltip/tooltip.directive.spec.ts b/projects/ion/src/lib/tooltip/tooltip.directive.spec.ts
@@ -7,6 +7,7 @@ import {
   TooltipTrigger,
 } from '../core/types';
 import { IonTooltipModule } from './tooltip.module';
+import { IonTooltipDirective } from './tooltip.directive';
 
 @Component({
   template: `
@@ -130,6 +131,17 @@ describe('Directive: Tooltip', () => {
     );
   });
 
+  it('should close the tooltip when scrolling the page', async () => {
+    await sut();
+    const directive = IonTooltipDirective.prototype;
+    jest.spyOn(directive, 'onScroll');
+
+    fireEvent.mouseEnter(screen.getByTestId('hostTooltip'));
+    fireEvent.scroll(window);
+    expect(directive.onScroll).toBeCalled();
+    expect(screen.queryByTestId('ion-tooltip')).not.toBeInTheDocument();
+  });
+
   describe('trigger: click', () => {
     afterEach(async () => {
       fireEvent.click(screen.getByTestId('hostTooltip'));

diff --git a/projects/ion/src/lib/tooltip/tooltip.directive.ts b/projects/ion/src/lib/tooltip/tooltip.directive.ts
@@ -157,6 +157,10 @@ export class IonTooltipDirective implements OnDestroy, OnInit {
     }
   }
 
+  @HostListener('window:scroll') onScroll(): void {
+    this.destroyComponent();
+  }
+
   ngOnDestroy(): void {
     this.destroyComponent();
     this.subscription$.unsubscribe();