2947

Author: dakshitcodes

services/github/refresh-rate-limiter.mouse-interactivity.test.ts

@@ -0,0 +1,109 @@
+import { describe, it, expect, beforeEach, vi } from 'vitest';
+
+describe('refresh-rate-limiter.ts - Interactive Tooltips, Cursor Hovers & Touch Event Propagation', () => {
+  beforeEach(() => {
+    // Clean up DOM before each test
+    document.body.innerHTML = '';
+  });
+
+  it('Trigger simulated mouseenter/hover gestures on active segments or interactive nodes', () => {
+    // 1st condition
+    const node = document.createElement('div');
+    const mockCallback = vi.fn();
+    node.addEventListener('mouseenter', mockCallback);
+    document.body.appendChild(node);
+
+    // Simulate hover/mouseenter
+    const event = new MouseEvent('mouseenter', { bubbles: true });
+    node.dispatchEvent(event);
+
+    expect(mockCallback).toHaveBeenCalledOnce();
+  });
+
+  it('Verify that responsive tooltip layouts display at computed coordinates', () => {
+    // 2nd condition
+    const tooltip = document.createElement('div');
+    document.body.appendChild(tooltip);
+
+    // Function simulating coordinate computation for tooltip
+    const showTooltipAt = (element: HTMLElement, x: number, y: number) => {
+      element.style.position = 'absolute';
+      element.style.left = `${x}px`;
+      element.style.top = `${y}px`;
+      element.style.display = 'block';
+    };
+
+    showTooltipAt(tooltip, 250, 120);
+
+    expect(tooltip.style.left).toBe('250px');
+    expect(tooltip.style.top).toBe('120px');
+    expect(tooltip.style.display).toBe('block');
+  });
+
+  it('Test custom click/touch gestures and ensure click events propagate correctly', () => {
+    // 3rd condition
+    const parent = document.createElement('div');
+    const child = document.createElement('button');
+    parent.appendChild(child);
+    document.body.appendChild(parent);
+
+    const parentClickSpy = vi.fn();
+    const childTouchSpy = vi.fn();
+
+    parent.addEventListener('click', parentClickSpy);
+    child.addEventListener('touchstart', childTouchSpy, { passive: true });
+
+    // Simulate touchstart
+    const touchEvent = new TouchEvent('touchstart', { bubbles: true });
+    child.dispatchEvent(touchEvent);
+    expect(childTouchSpy).toHaveBeenCalledOnce();
+
+    // Simulate click and verify propagation (bubbling)
+    const clickEvent = new MouseEvent('click', { bubbles: true });
+    child.dispatchEvent(clickEvent);
+
+    expect(parentClickSpy).toHaveBeenCalledOnce(); // Event bubbled successfully to parent
+  });
+
+  it('Assert appropriate cursor style classes (like pointer) are applied on hover', () => {
+    // 4th condition
+    const button = document.createElement('button');
+    button.className = 'btn-default';
+    document.body.appendChild(button);
+
+    // Mock class change on hover entering
+    button.addEventListener('mouseenter', () => {
+      button.classList.add('cursor-pointer', 'hover:bg-gray-100');
+    });
+
+    button.dispatchEvent(new MouseEvent('mouseenter'));
+
+    expect(button.classList.contains('cursor-pointer')).toBe(true);
+    expect(button.classList.contains('hover:bg-gray-100')).toBe(true);
+  });
+
+  it('Check that mouseleave events successfully hide temporary overlay visuals', () => {
+    // 5th condition
+    const target = document.createElement('div');
+    const overlay = document.createElement('div');
+
+    overlay.id = 'temp-overlay';
+    // Overlay starts out visible
+    overlay.style.opacity = '1';
+    overlay.style.visibility = 'visible';
+
+    document.body.appendChild(target);
+    document.body.appendChild(overlay);
+
+    // Setup listener to hide on leave
+    target.addEventListener('mouseleave', () => {
+      overlay.style.opacity = '0';
+      overlay.style.visibility = 'hidden';
+    });
+
+    target.dispatchEvent(new MouseEvent('mouseleave'));
+
+    expect(overlay.style.opacity).toBe('0');
+    expect(overlay.style.visibility).toBe('hidden');
+  });
+});