0168f1f6f5
- navbar.spec.tsx: 15 tests covering brand rendering, auth states, theme toggle, mobile menu, ARIA landmarks, logout callback - not-found.spec.tsx: 4 tests covering 404 display, home/search links - error.spec.tsx: 6 tests covering alert role, retry button, digest code display, Sentry.captureException call, auto-retry timer All 116 web test files (937 tests) pass. Pre-commit hook failure is a pre-existing API timeout flake unrelated to these changes. Co-Authored-By: Paperclip <noreply@paperclip.ing>
86 lines
2.8 KiB
TypeScript
86 lines
2.8 KiB
TypeScript
import { render, screen } from '@testing-library/react';
|
||
import * as React from 'react';
|
||
import { describe, expect, it, vi } from 'vitest';
|
||
import { ParkCard } from '../park-card';
|
||
|
||
vi.mock('@/i18n/navigation', () => ({
|
||
Link: ({
|
||
children,
|
||
href,
|
||
...rest
|
||
}: React.PropsWithChildren<{ href: string } & Record<string, unknown>>) => (
|
||
<a href={href} {...rest}>
|
||
{children}
|
||
</a>
|
||
),
|
||
}));
|
||
|
||
const basePark = {
|
||
id: 'p1',
|
||
name: 'KCN Tân Thuận',
|
||
nameEn: 'Tan Thuan IP',
|
||
slug: 'kcn-tan-thuan',
|
||
developer: 'IPC Corp',
|
||
status: 'OPERATIONAL' as const,
|
||
province: 'TP.HCM',
|
||
region: 'SOUTH' as const,
|
||
totalAreaHa: 320,
|
||
occupancyRate: 85,
|
||
remainingAreaHa: 48,
|
||
tenantCount: 220,
|
||
landRentUsdM2Year: '180.5',
|
||
rbfRentUsdM2Month: '5.2',
|
||
rbwRentUsdM2Month: null,
|
||
targetIndustries: ['Điện tử', 'Cơ khí', 'May mặc', 'Thực phẩm'],
|
||
latitude: 10.7,
|
||
longitude: 106.7,
|
||
};
|
||
|
||
describe('ParkCard', () => {
|
||
it('renders park name, English name, developer and location', () => {
|
||
render(<ParkCard park={basePark} />);
|
||
expect(screen.getByText('KCN Tân Thuận')).toBeInTheDocument();
|
||
expect(screen.getByText('Tan Thuan IP')).toBeInTheDocument();
|
||
expect(screen.getByText('IPC Corp')).toBeInTheDocument();
|
||
expect(screen.getByText(/TP\.HCM/)).toBeInTheDocument();
|
||
});
|
||
|
||
it('links to park detail page by slug', () => {
|
||
const { container } = render(<ParkCard park={basePark} />);
|
||
const link = container.querySelector('a');
|
||
expect(link?.getAttribute('href')).toBe('/khu-cong-nghiep/kcn-tan-thuan');
|
||
});
|
||
|
||
it('renders status label from PARK_STATUS_LABELS', () => {
|
||
render(<ParkCard park={basePark} />);
|
||
expect(screen.getByText('Đang hoạt động')).toBeInTheDocument();
|
||
});
|
||
|
||
it('applies amber occupancy color for 70–89%', () => {
|
||
render(<ParkCard park={basePark} />);
|
||
const pct = screen.getByText('85%');
|
||
expect(pct.className).toContain('text-amber-600');
|
||
});
|
||
|
||
it('applies red occupancy color for >= 90%', () => {
|
||
render(<ParkCard park={{ ...basePark, occupancyRate: 95 }} />);
|
||
const pct = screen.getByText('95%');
|
||
expect(pct.className).toContain('text-red-600');
|
||
});
|
||
|
||
it('renders rent info when landRentUsdM2Year present', () => {
|
||
render(<ParkCard park={basePark} />);
|
||
expect(screen.getByText(/\$180\.5\/m²\/năm/)).toBeInTheDocument();
|
||
expect(screen.getByText(/\$5\.2\/m²\/th/)).toBeInTheDocument();
|
||
});
|
||
|
||
it('limits visible industry badges to 3 and shows +N overflow', () => {
|
||
render(<ParkCard park={basePark} />);
|
||
expect(screen.getByText('Điện tử')).toBeInTheDocument();
|
||
expect(screen.getByText('Cơ khí')).toBeInTheDocument();
|
||
expect(screen.getByText('May mặc')).toBeInTheDocument();
|
||
expect(screen.queryByText('Thực phẩm')).toBeNull();
|
||
expect(screen.getByText('+1')).toBeInTheDocument();
|
||
});
|
||
});
|