import { describe, it, expect, beforeEach } from 'vitest';
import { createTooltip, showTooltip, hideTooltip } from '../src/shared/tooltip';

describe('tooltip', () => {
  beforeEach(() => {
    document.body.innerHTML = '';
  });

  describe('createTooltip', () => {
    it('returns a div with class heatmap-tooltip and display none', () => {
      const tip = createTooltip();
      expect(tip).toBeInstanceOf(HTMLDivElement);
      expect(tip.className).toBe('heatmap-tooltip');
      expect(tip.style.display).toBe('none');
    });

    it('appends tooltip to document.body with fixed positioning', () => {
      const tip = createTooltip();
      expect(document.body.contains(tip)).toBe(true);
      expect(tip.style.position).toBe('fixed');
    });

    it('removes existing tooltip before creating new one', () => {
      const first = createTooltip();
      const second = createTooltip();
      const tooltips = document.querySelectorAll('.heatmap-tooltip');
      expect(tooltips.length).toBe(1);
      expect(tooltips[0]).toBe(second);
      expect(document.body.contains(first)).toBe(false);
    });
  });

  describe('showTooltip', () => {
    it('sets display to block and positions tooltip', () => {
      const tip = createTooltip();
      const rect = { left: 100, top: 200 } as DOMRect;
      showTooltip(tip, '<strong>Test</strong>', rect, 13);
      expect(tip.style.display).toBe('block');
      expect(tip.innerHTML).toBe('<strong>Test</strong>');
      expect(tip.style.left).toBe('106.5px'); // 100 + 13/2
    });
  });

  describe('hideTooltip', () => {
    it('sets display to none', () => {
      const tip = createTooltip();
      tip.style.display = 'block';
      hideTooltip(tip);
      expect(tip.style.display).toBe('none');
    });
  });
});