clinicpro/assets/admin/components/ui/Switch.test.tsx

import { describe, it, expect, vi } from 'vitest';
import { render, screen, fireEvent } from '@testing-library/react';
import Switch from './Switch';

/**
 * سوییچ تنها شکل مجاز ورودی boolean در پنل است؛ چک‌باکس نیتیو جایی ندارد.
 * این تست‌ها قرارداد آن را قفل می‌کنند: نقش `switch`، نامِ دسترسی‌پذیرِ کوتاه،
 * و ظاهرِ آمده از کلاس‌های دیزاین‌سیستم.
 */
describe('Switch', () => {
  it('نقشش switch است نه checkbox', () => {
    render(<Switch checked={false} onChange={() => {}} label="فعال است" />);

    expect(screen.getByRole('switch', { name: 'فعال است' })).toBeInTheDocument();
    expect(screen.queryByRole('checkbox')).not.toBeInTheDocument();
  });

  it('ظاهرش از کلاس‌های دیزاین‌سیستم می‌آید', () => {
    const { container } = render(<Switch checked onChange={() => {}} ariaLabel="وضعیت" />);

    expect(container.querySelector('.switch')).not.toBeNull();
    expect(container.querySelector('.switch-track .switch-thumb')).not.toBeNull();
  });

  it('کلیک مقدار تازه را می‌دهد، نه رویداد خام', () => {
    const onChange = vi.fn();
    render(<Switch checked={false} onChange={onChange} label="فعال است" />);

    fireEvent.click(screen.getByRole('switch'));
    expect(onChange).toHaveBeenCalledWith(true);
  });

  /** متنِ `<label>` شاملِ hint می‌شود؛ نامِ دسترسی‌پذیر باید همان برچسبِ کوتاه بماند. */
  it('hint وارد نام دسترسی‌پذیر نمی‌شود', () => {
    render(<Switch checked onChange={() => {}} label="فعال است" hint="توضیح بلند و اضافی" />);

    expect(screen.getByRole('switch', { name: 'فعال است' })).toBeInTheDocument();
    expect(screen.getByText('توضیح بلند و اضافی')).toBeInTheDocument();
  });

  it('کلیک روی برچسب هم سوییچ را می‌زند', () => {
    const onChange = vi.fn();
    render(<Switch checked={false} onChange={onChange} label="فعال است" />);

    fireEvent.click(screen.getByText('فعال است'));
    expect(onChange).toHaveBeenCalledWith(true);
  });

  /* `fireEvent.click` در jsdom قید `disabled` را دور می‌زند، پس خودِ صفت سنجیده
     می‌شود — همان چیزی که مرورگر واقعی به آن تکیه می‌کند. */
  it('در حالت غیرفعال، ورودی قفل است', () => {
    render(<Switch checked={false} onChange={() => {}} label="فعال است" disabled />);

    expect(screen.getByRole('switch')).toBeDisabled();
  });

  /** بدون برچسبِ دیداری — سلول جدول و ردیف فشرده — نام از `ariaLabel` می‌آید. */
  it('بدون label، نام از ariaLabel می‌آید', () => {
    render(<Switch checked onChange={() => {}} ariaLabel="دسترسی نوبت‌ها" />);

    expect(screen.getByRole('switch', { name: 'دسترسی نوبت‌ها' })).toBeInTheDocument();
  });
});