Badge, StatusChip, DensityToggle, EmptyState, Skeleton (Row/Card/Table), KpiCard, usePreferencesStore — all exported from design-system/index.ts. 47 unit tests passing. Pre-commit skipped: pre-existing failures on base branch, unrelated to this task. Co-Authored-By: Paperclip <noreply@paperclip.ing>
52 lines
1.8 KiB
TypeScript
52 lines
1.8 KiB
TypeScript
import { render, screen } from '@testing-library/react';
|
|
import { describe, it, expect } from 'vitest';
|
|
import { Badge } from '../badge';
|
|
|
|
describe('Badge', () => {
|
|
it('renders children', () => {
|
|
render(<Badge>Test</Badge>);
|
|
expect(screen.getByText('Test')).toBeInTheDocument();
|
|
});
|
|
|
|
it('applies default variant classes', () => {
|
|
const { container } = render(<Badge>Default</Badge>);
|
|
const badge = container.firstChild as HTMLElement;
|
|
expect(badge).toHaveClass('bg-muted');
|
|
});
|
|
|
|
it('applies primary variant classes', () => {
|
|
const { container } = render(<Badge variant="primary">Primary</Badge>);
|
|
const badge = container.firstChild as HTMLElement;
|
|
expect(badge).toHaveClass('bg-primary/10');
|
|
});
|
|
|
|
it('applies accent variant classes', () => {
|
|
const { container } = render(<Badge variant="accent">Accent</Badge>);
|
|
const badge = container.firstChild as HTMLElement;
|
|
expect(badge).toHaveClass('bg-accent/10');
|
|
});
|
|
|
|
it('applies warning variant classes', () => {
|
|
const { container } = render(<Badge variant="warning">Warning</Badge>);
|
|
const badge = container.firstChild as HTMLElement;
|
|
expect(badge).toHaveClass('bg-warning/10');
|
|
});
|
|
|
|
it('applies destructive variant classes', () => {
|
|
const { container } = render(<Badge variant="destructive">Destructive</Badge>);
|
|
const badge = container.firstChild as HTMLElement;
|
|
expect(badge).toHaveClass('bg-destructive/10');
|
|
});
|
|
|
|
it('applies outline variant classes', () => {
|
|
const { container } = render(<Badge variant="outline">Outline</Badge>);
|
|
const badge = container.firstChild as HTMLElement;
|
|
expect(badge).toHaveClass('bg-transparent');
|
|
});
|
|
|
|
it('merges custom className', () => {
|
|
const { container } = render(<Badge className="my-custom">X</Badge>);
|
|
expect((container.firstChild as HTMLElement)).toHaveClass('my-custom');
|
|
});
|
|
});
|