import { describe, it, expect, vi } from 'vitest'; import { render, screen } from '@testing-library/react'; import { GenerationCard } from './generation-card'; import { GenerationResponse } from '@/lib/api'; // Mock the WebSocket hook vi.mock('@/hooks/use-websocket', () => ({ useGenerationWebSocket: () => ({ lastMessage: null, status: 'connected' }) })); // Mock AudioPlayer to check if it receives correct props vi.mock('@/components/audio-player', () => ({ AudioPlayer: ({ src }: { src: string }) =>
Audio Player Mock
})); describe('GenerationCard', () => { const mockGeneration: GenerationResponse = { id: '123', status: 'completed', audio_path: '/music/test.wav', metadata: { prompt: 'Test prompt', analysis: { style: 'Rock', tempo: '120', mood: 'Energetic' } }, processing_time_seconds: 10, created_at: new Date().toISOString() }; it('renders audio player when status is completed', () => { render(); expect(screen.getByText('Completed')).toBeInTheDocument(); const audioPlayer = screen.getByTestId('audio-player'); expect(audioPlayer).toBeInTheDocument(); // Check URL construction logic (default API URL when env not set) expect(audioPlayer).toHaveAttribute('data-src', 'http://localhost:8000/music/test.wav'); }); it('does not render audio player when processing', () => { const processingGen = { ...mockGeneration, status: 'processing', audio_path: null }; render(); expect(screen.queryByTestId('audio-player')).not.toBeInTheDocument(); expect(screen.getByText('Generating...')).toBeInTheDocument(); }); it('renders error message when failed', () => { const failedGen = { ...mockGeneration, status: 'failed', error_message: 'GPU Error', audio_path: null }; render(); expect(screen.getByText('Failed')).toBeInTheDocument(); expect(screen.getByText('GPU Error')).toBeInTheDocument(); expect(screen.queryByTestId('audio-player')).not.toBeInTheDocument(); }); });