kimai-plugin-heatmap/assets/test/tooltip.test.ts

52 lines
1.7 KiB
TypeScript

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');
});
});
});