/**
* Tests for the StatusBadge component
* @jest-environment jsdom
*/
import React from 'react';
import { render, screen } from '@testing-library/react';
import { StatusBadge, getRoleBadgeColor, getTicketStatusColor, getStatusColor } from '@/components/ui/StatusBadge';
describe('StatusBadge', () => {
describe('ticket type', () => {
it('should render PENDING status', () => {
render();
expect(screen.getByText('En attente')).toBeInTheDocument();
});
it('should render CLAIMED status', () => {
render();
expect(screen.getByText('Réclamé')).toBeInTheDocument();
});
it('should render REJECTED status', () => {
render();
expect(screen.getByText('Rejeté')).toBeInTheDocument();
});
it('should show icon when showIcon is true', () => {
const { container } = render();
// Check that SVG icon is rendered
expect(container.querySelector('svg')).toBeInTheDocument();
});
it('should not show icon by default', () => {
const { container } = render();
// Check that no SVG icon is rendered
expect(container.querySelector('svg')).not.toBeInTheDocument();
});
});
describe('role type', () => {
it('should render ADMIN role', () => {
render();
expect(screen.getByText('Admin')).toBeInTheDocument();
});
it('should render EMPLOYEE role', () => {
render();
expect(screen.getByText('Employé')).toBeInTheDocument();
});
it('should render CLIENT role', () => {
render();
expect(screen.getByText('Client')).toBeInTheDocument();
});
});
describe('status type', () => {
it('should render active status', () => {
render();
expect(screen.getByText('Actif')).toBeInTheDocument();
});
it('should render inactive status', () => {
render();
expect(screen.getByText('Inactif')).toBeInTheDocument();
});
it('should render verified status', () => {
render();
expect(screen.getByText('Vérifié')).toBeInTheDocument();
});
});
describe('custom className', () => {
it('should apply custom className', () => {
const { container } = render(
);
expect(container.firstChild).toHaveClass('custom-class');
});
});
});
describe('getRoleBadgeColor', () => {
it('should return correct colors for ADMIN', () => {
const result = getRoleBadgeColor('ADMIN');
expect(result).toContain('red');
});
it('should return correct colors for EMPLOYEE', () => {
const result = getRoleBadgeColor('EMPLOYEE');
expect(result).toContain('blue');
});
it('should return correct colors for CLIENT', () => {
const result = getRoleBadgeColor('CLIENT');
expect(result).toContain('green');
});
it('should return default colors for unknown role', () => {
const result = getRoleBadgeColor('UNKNOWN');
expect(result).toContain('gray');
});
});
describe('getTicketStatusColor', () => {
it('should return correct colors for PENDING', () => {
const result = getTicketStatusColor('PENDING');
expect(result).toContain('yellow');
});
it('should return correct colors for CLAIMED', () => {
const result = getTicketStatusColor('CLAIMED');
expect(result).toContain('green');
});
it('should return correct colors for REJECTED', () => {
const result = getTicketStatusColor('REJECTED');
expect(result).toContain('red');
});
it('should return default colors for unknown status', () => {
const result = getTicketStatusColor('UNKNOWN');
expect(result).toContain('gray');
});
});
describe('getStatusColor', () => {
it('should return correct colors for active', () => {
const result = getStatusColor('active');
expect(result).toContain('green');
});
it('should return correct colors for inactive', () => {
const result = getStatusColor('inactive');
expect(result).toContain('gray');
});
it('should return correct colors for verified', () => {
const result = getStatusColor('verified');
expect(result).toContain('green');
});
it('should return default colors for unknown status', () => {
const result = getStatusColor('unknown');
expect(result).toContain('gray');
});
});