Загрузка данных


import { fireEvent, render, screen } from '@testing-library/react';
import { type ButtonHTMLAttributes, type ReactNode } from 'react';

import { Button } from './index';

type MockButtonProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'size'> & {
  label?: ReactNode;
  size?: string;
};

jest.mock('exchange-elements/v2', () => ({
  Button: ({ label, size, ...props }: MockButtonProps) => (
    <button
      {...props}
      type="button"
      data-size={size}
    >
      {label}
    </button>
  ),
}));

describe('Button', () => {
  it('должен использовать размер sm по умолчанию', () => {
    render(<Button label="Кнопка" />);

    expect(screen.getByRole('button')).toHaveAttribute('data-size', 'sm');
  });

  it('должен использовать переданный размер', () => {
    render(
      <Button
        size="lg"
        label="Кнопка"
      />,
    );

    expect(screen.getByRole('button')).toHaveAttribute('data-size', 'lg');
  });

  it('должен добавлять класс pressed при активном состоянии', () => {
    render(
      <Button
        pressed
        label="Кнопка"
      />,
    );

    expect(screen.getByRole('button')).toHaveClass('button', 'pressed');
  });

  it('не должен добавлять классы состояний по умолчанию', () => {
    render(<Button label="Кнопка" />);

    const button = screen.getByRole('button');

    expect(button).not.toHaveClass('pressed');
    expect(button).not.toHaveClass('selected');
  });

  it('должен добавлять класс selected при выбранном состоянии', () => {
    render(
      <Button
        selected
        label="Кнопка"
      />,
    );

    expect(screen.getByRole('button')).toHaveClass('button', 'selected');
  });

  it('должен объединять переданный className с базовым классом', () => {
    render(
      <Button
        className="custom-class"
        label="Кнопка"
      />,
    );

    expect(screen.getByRole('button')).toHaveClass('button', 'custom-class');
  });

  it('должен передавать остальные свойства в базовый компонент кнопки', () => {
    const handleClick = jest.fn();

    render(
      <Button
        onClick={handleClick}
        label="Кнопка"
      />,
    );

    fireEvent.click(screen.getByRole('button'));

    expect(handleClick).toHaveBeenCalledTimes(1);
  });
});