import { describe, it, expect, vi } from 'vitest';
import { render, screen, fireEvent } from '@testing-library/react';
import PersianDateInput from '@/components/ui/PersianDateInput';
describe('PersianDateInput', () => {
it('placeholder را وقتی مقدار خالی است نشان میدهد', () => {
render();
expect(screen.getByText('از تاریخ')).toBeInTheDocument();
});
it('از تقویم شمسی استفاده میکند نه input بومی میلادی', () => {
const { container } = render();
expect(container.querySelector('input[type="date"]')).toBeNull();
});
it('با کلیک، تقویم شمسی باز میشود (نام ماه فارسی)', () => {
const { container } = render();
fireEvent.click((container.firstChild as HTMLElement).firstChild as Element);
// 2024-03-25 میلادی = ۶ فروردین ۱۴۰۳ شمسی
expect(screen.getByText('فروردین')).toBeInTheDocument();
});
it('انتخاب روز، onChange را با YYYY-MM-DD میلادی صدا میزند', () => {
const onChange = vi.fn();
const { container } = render();
fireEvent.click((container.firstChild as HTMLElement).firstChild as Element);
// تقویم با createPortal به document.body میرود، پس بیرون از container است
const target = Array.from(document.body.querySelectorAll('button')).find(
(b) => b.textContent?.trim() === '۱۵',
);
expect(target).toBeTruthy();
fireEvent.click(target as Element);
expect(onChange).toHaveBeenCalledWith(expect.stringMatching(/^\d{4}-\d{2}-\d{2}$/));
});
it('دکمه پاککردن، onChange با رشته خالی میفرستد', () => {
const onChange = vi.fn();
const { container } = render();
const svgs = container.querySelectorAll('svg');
const clearIcon = svgs[svgs.length - 1];
fireEvent.click(clearIcon.parentElement as Element);
expect(onChange).toHaveBeenCalledWith('');
});
});