test(definitiontooltip): increase test coverage to 100%

carbon-design-system · Sep 12, 2024 · 1807e6a · 1807e6a
1 parent a6f1b23
commit 1807e6a
Showing 1 changed file with 117 additions and 0 deletions.
diff --git a/packages/react/src/components/Tooltip/__tests__/DefinitionTooltip-test.js b/packages/react/src/components/Tooltip/__tests__/DefinitionTooltip-test.js
@@ -29,6 +29,123 @@ describe('DefintiionTooltip', () => {
   });
 
   describe('Component API', () => {
+    it('should open onKeyDown', async () => {
+      const user = userEvent.setup();
+      const definition = 'Uniform Resource Locator';
+      render(
+        <DefinitionTooltip
+          data-testid="test"
+          definition={definition}
+          className="tooltip-class">
+          URL
+        </DefinitionTooltip>
+      );
+
+      const button = screen.getByRole('button');
+
+      await user.tab();
+      expect(button).toHaveAttribute('aria-expanded', 'true');
+
+      await user.keyboard('[Escape]');
+      expect(button).toHaveAttribute('aria-expanded', 'false');
+    });
+    it('should close when trigger is blurred', async () => {
+      const user = userEvent.setup();
+      const definition = 'Uniform Resource Locator';
+      render(
+        <DefinitionTooltip
+          data-testid="test"
+          definition={definition}
+          className="tooltip-class">
+          URL
+        </DefinitionTooltip>
+      );
+
+      const button = screen.getByRole('button');
+
+      await user.tab();
+      expect(button).toHaveAttribute('aria-expanded', 'true');
+      await user.tab();
+      expect(button).toHaveAttribute('aria-expanded', 'false');
+    });
+    it('should close on unhover/mouseout when openOnHover is false', async () => {
+      const user = userEvent.setup();
+      const definition = 'Uniform Resource Locator';
+      render(
+        <DefinitionTooltip
+          data-testid="test"
+          definition={definition}
+          className="tooltip-class"
+          defaultOpen>
+          URL
+        </DefinitionTooltip>
+      );
+
+      const content = screen.getByText(definition);
+
+      expect(content).toBeVisible();
+      await userEvent.unhover(content);
+      expect(screen.getByRole('button')).toHaveAttribute(
+        'aria-expanded',
+        'false'
+      );
+    });
+    it('should open on hover when openOnHover', async () => {
+      const user = userEvent.setup();
+      const definition = 'Uniform Resource Locator';
+      render(
+        <DefinitionTooltip
+          data-testid="test"
+          definition={definition}
+          className="tooltip-class"
+          openOnHover>
+          URL
+        </DefinitionTooltip>
+      );
+
+      const content = screen.getByText(definition);
+      const trigger = screen.getByRole('button');
+
+      expect(screen.getByRole('button')).toHaveAttribute(
+        'aria-expanded',
+        'false'
+      );
+      await user.hover(trigger);
+      expect(screen.getByRole('button')).toHaveAttribute(
+        'aria-expanded',
+        'true'
+      );
+      await user.unhover(trigger);
+      expect(screen.getByRole('button')).toHaveAttribute(
+        'aria-expanded',
+        'false'
+      );
+    });
+    it('should not open on hover by default', async () => {
+      const user = userEvent.setup();
+      const definition = 'Uniform Resource Locator';
+      render(
+        <DefinitionTooltip
+          data-testid="test"
+          definition={definition}
+          className="tooltip-class">
+          URL
+        </DefinitionTooltip>
+      );
+
+      const content = screen.getByText(definition);
+      const trigger = screen.getByRole('button');
+
+      expect(screen.getByRole('button')).toHaveAttribute(
+        'aria-expanded',
+        'false'
+      );
+      await user.hover(trigger);
+      expect(screen.getByRole('button')).toHaveAttribute(
+        'aria-expanded',
+        'false'
+      );
+    });
     it('should apply additional props to the underlying button element', () => {
       const definition = 'Uniform Resource Locator';
       render(