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>
46 lines
1.5 KiB
TypeScript
46 lines
1.5 KiB
TypeScript
import { render, screen } from '@testing-library/react';
|
|
import { describe, expect, it } from 'vitest';
|
|
import { Numeric } from '../numeric';
|
|
|
|
describe('Numeric', () => {
|
|
it('formats VND by default', () => {
|
|
render(<Numeric value={1000000} />);
|
|
// Intl.NumberFormat vi-VN with currency VND — should contain digits
|
|
expect(screen.getByText(/1\.000\.000/)).toBeInTheDocument();
|
|
});
|
|
|
|
it('formats percent', () => {
|
|
render(<Numeric value={5.5} format="percent" />);
|
|
expect(screen.getByText('+5.5%')).toBeInTheDocument();
|
|
});
|
|
|
|
it('formats negative percent without plus sign', () => {
|
|
render(<Numeric value={-3.2} format="percent" />);
|
|
expect(screen.getByText('-3.2%')).toBeInTheDocument();
|
|
});
|
|
|
|
it('formats decimal', () => {
|
|
render(<Numeric value={1234.5} format="decimal" fractionDigits={2} />);
|
|
// vi-VN decimal uses comma as decimal separator
|
|
expect(screen.getByText(/1\.234/)).toBeInTheDocument();
|
|
});
|
|
|
|
it('formats compact', () => {
|
|
render(<Numeric value={2000000} format="compact" />);
|
|
expect(screen.getByText(/\d/)).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders as span with data-numeric attribute', () => {
|
|
render(<Numeric value={100} data-testid="num" />);
|
|
const el = screen.getByTestId('num');
|
|
expect(el.tagName).toBe('SPAN');
|
|
expect(el).toHaveAttribute('data-numeric');
|
|
});
|
|
|
|
it('has tabular-nums and font-mono classes', () => {
|
|
render(<Numeric value={100} data-testid="num" />);
|
|
const el = screen.getByTestId('num');
|
|
expect(el).toHaveClass('tabular-nums', 'font-mono');
|
|
});
|
|
});
|