import { describe, it, expect } from 'vitest'; import { render, screen } from '@testing-library/react'; import { LoadingSpinner } from './loading-spinner'; describe('LoadingSpinner', () => { it('should render spinner', () => { render(); const spinner = screen.getByRole('status'); expect(spinner).toBeInTheDocument(); expect(spinner).toHaveAttribute('aria-label', 'Chargement en cours'); }); it('should render with default size', () => { render(); const spinner = screen.getByRole('status'); expect(spinner).toHaveClass('h-8', 'w-8'); }); it('should render with small size', () => { render(); const spinner = screen.getByRole('status'); expect(spinner).toHaveClass('h-4', 'w-4'); }); it('should render with large size', () => { render(); const spinner = screen.getByRole('status'); expect(spinner).toHaveClass('h-12', 'w-12'); }); it('should render with custom text', () => { render(); expect(screen.getByText('Chargement...')).toBeInTheDocument(); }); it('should not render text when not provided', () => { render(); const textElements = screen.queryByText(/Chargement/i); expect(textElements).not.toBeInTheDocument(); }); it('should apply custom className', () => { render(); const container = screen.getByRole('status').parentElement; expect(container).toHaveClass('custom-class'); }); it('should have accessibility attributes', () => { render(); const spinner = screen.getByRole('status'); expect(spinner).toHaveAttribute('aria-label', 'Chargement en cours'); const srOnly = screen.getByText('Chargement...'); expect(srOnly).toHaveClass('sr-only'); }); it('should have spinning animation', () => { render(); const spinner = screen.getByRole('status'); expect(spinner).toHaveClass('animate-spin'); }); });