71 lines
2.1 KiB
TypeScript
71 lines
2.1 KiB
TypeScript
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(<LoadingSpinner />);
|
|
|
|
const spinner = screen.getByRole('status');
|
|
expect(spinner).toBeInTheDocument();
|
|
expect(spinner).toHaveAttribute('aria-label', 'Chargement en cours');
|
|
});
|
|
|
|
it('should render with default size', () => {
|
|
render(<LoadingSpinner />);
|
|
|
|
const spinner = screen.getByRole('status');
|
|
expect(spinner).toHaveClass('h-8', 'w-8');
|
|
});
|
|
|
|
it('should render with small size', () => {
|
|
render(<LoadingSpinner size="sm" />);
|
|
|
|
const spinner = screen.getByRole('status');
|
|
expect(spinner).toHaveClass('h-4', 'w-4');
|
|
});
|
|
|
|
it('should render with large size', () => {
|
|
render(<LoadingSpinner size="lg" />);
|
|
|
|
const spinner = screen.getByRole('status');
|
|
expect(spinner).toHaveClass('h-12', 'w-12');
|
|
});
|
|
|
|
it('should render with custom text', () => {
|
|
render(<LoadingSpinner text="Chargement..." />);
|
|
|
|
expect(screen.getByText('Chargement...')).toBeInTheDocument();
|
|
});
|
|
|
|
it('should not render text when not provided', () => {
|
|
render(<LoadingSpinner />);
|
|
|
|
const textElements = screen.queryByText(/Chargement/i);
|
|
expect(textElements).not.toBeInTheDocument();
|
|
});
|
|
|
|
it('should apply custom className', () => {
|
|
render(<LoadingSpinner className="custom-class" />);
|
|
|
|
const container = screen.getByRole('status').parentElement;
|
|
expect(container).toHaveClass('custom-class');
|
|
});
|
|
|
|
it('should have accessibility attributes', () => {
|
|
render(<LoadingSpinner />);
|
|
|
|
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(<LoadingSpinner />);
|
|
|
|
const spinner = screen.getByRole('status');
|
|
expect(spinner).toHaveClass('animate-spin');
|
|
});
|
|
});
|