Covers Badge, Divider, EmptyState, Numeric, PriceDelta, Signal, Skeleton, StatusChip, Surface, StatCard, KpiCard, DensityToggle, Footer, MarketIndex, CompactHeader — rendering, variants, props, a11y attributes, className merging. All 1139 web tests pass. Zustand persist store mocked for DensityToggle to avoid jsdom localStorage incompatibility. Co-Authored-By: Paperclip <noreply@paperclip.ing>
47 lines
1.6 KiB
TypeScript
47 lines
1.6 KiB
TypeScript
import { render, screen } from '@testing-library/react';
|
|
import { describe, expect, it } from 'vitest';
|
|
import { KpiCard } from '../kpi-card';
|
|
|
|
describe('KpiCard', () => {
|
|
it('renders label', () => {
|
|
render(<KpiCard label="Giá TB" value="2.5 tỷ" />);
|
|
expect(screen.getByText('Giá TB')).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders value', () => {
|
|
render(<KpiCard label="Label" value="100" />);
|
|
expect(screen.getByText('100')).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders footnote', () => {
|
|
render(<KpiCard label="Label" value="100" footnote="Hôm nay" />);
|
|
expect(screen.getByText('Hôm nay')).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders PriceDelta when delta provided', () => {
|
|
render(<KpiCard label="Label" value="100" delta={1.5} />);
|
|
expect(screen.getByText('+1.50%')).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders icon', () => {
|
|
render(<KpiCard label="L" value="V" icon={<span data-testid="icon" />} />);
|
|
expect(screen.getByTestId('icon')).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders loading skeleton when loading=true', () => {
|
|
const { container } = render(<KpiCard label="L" value="V" loading />);
|
|
expect(container.querySelector('[aria-busy]')).toBeInTheDocument();
|
|
expect(container.querySelector('.animate-pulse')).toBeInTheDocument();
|
|
});
|
|
|
|
it('does not show value when loading', () => {
|
|
render(<KpiCard label="Label" value="100" loading />);
|
|
expect(screen.queryByText('100')).toBeNull();
|
|
});
|
|
|
|
it('merges custom className', () => {
|
|
render(<KpiCard data-testid="kc" label="L" value="V" className="extra" />);
|
|
expect(screen.getByTestId('kc')).toHaveClass('extra');
|
|
});
|
|
});
|