frontend/tests/components/waveform-visualizer.test.js

import { WaveformVisualizer } from '../../js/components/waveform-visualizer.js';

function makeCanvas() {
    const canvas = document.createElement('canvas');
    const ctx = {
        fillStyle: '',
        strokeStyle: '',
        lineWidth: 0,
        fillRect: jest.fn(),
        beginPath: jest.fn(),
        moveTo: jest.fn(),
        lineTo: jest.fn(),
        stroke: jest.fn(),
    };
    canvas.getContext = jest.fn(() => ctx);
    return { canvas, ctx };
}

describe('WaveformVisualizer', () => {
    let viz, userCanvas, agentCanvas;

    beforeEach(() => {
        ({ canvas: userCanvas } = makeCanvas());
        ({ canvas: agentCanvas } = makeCanvas());
        viz = new WaveformVisualizer(userCanvas, agentCanvas);
    });

    afterEach(() => {
        viz.stop();
    });

    test('initialises canvas dimensions', () => {
        expect(userCanvas.width).toBe(350);
        expect(userCanvas.height).toBe(60);
        expect(agentCanvas.width).toBe(350);
        expect(agentCanvas.height).toBe(60);
    });

    test('stopAgentSpeaking resets isAgentSpeaking flag', () => {
        viz.startAgentSpeaking();
        viz.stopAgentSpeaking();
        expect(viz.isAgentSpeaking).toBe(false);
    });

    test('stop cancels animation frame', () => {
        const cancelSpy = jest.spyOn(global, 'cancelAnimationFrame');
        viz.start(() => null, () => null);
        viz.stop();
        expect(cancelSpy).toHaveBeenCalled();
        expect(viz.animationId).toBeNull();
    });
});