aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/atoms/buttons/button.test.tsx
blob: 073b9405fbd4e85246997db3d40cfa2b21e20e75 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
import { render, screen } from '@tests/utils';
import Button from './button';

describe('Button', () => {
  it('renders the Button component', () => {
    render(<Button onClick={() => null}>Button</Button>);
    expect(screen.getByRole('button')).toBeInTheDocument();
  });

  it('renders the Button component with disabled state', () => {
    render(
      <Button onClick={() => null} disabled={true}>
        Disabled Button
      </Button>
    );
    expect(screen.getByRole('button')).toBeDisabled();
  });
});
ighlight .fm { color: #0066bb; font-weight: bold } /* Name.Function.Magic */ .highlight .vc { color: #336699 } /* Name.Variable.Class */ .highlight .vg { color: #dd7700 } /* Name.Variable.Global */ .highlight .vi { color: #3333bb } /* Name.Variable.Instance */ .highlight .vm { color: #336699 } /* Name.Variable.Magic */ .highlight .il { color: #0000DD; font-weight: bold } /* Literal.Number.Integer.Long */
import { render, screen } from '@test-utils';
import Heading from './heading';

describe('Heading', () => {
  it('renders a h1', () => {
    render(<Heading level={1}>Level 1</Heading>);
    expect(screen.getByRole('heading', { level: 1 })).toHaveTextContent(
      'Level 1'
    );
  });

  it('renders a h2', () => {
    render(<Heading level={2}>Level 2</Heading>);
    expect(screen.getByRole('heading', { level: 2 })).toHaveTextContent(
      'Level 2'
    );
  });

  it('renders a h3', () => {
    render(<Heading level={3}>Level 3</Heading>);
    expect(screen.getByRole('heading', { level: 3 })).toHaveTextContent(
      'Level 3'
    );
  });

  it('renders a h4', () => {
    render(<Heading level={4}>Level 4</Heading>);
    expect(screen.getByRole('heading', { level: 4 })).toHaveTextContent(
      'Level 4'
    );
  });

  it('renders a h5', () => {
    render(<Heading level={5}>Level 5</Heading>);
    expect(screen.getByRole('heading', { level: 5 })).toHaveTextContent(
      'Level 5'
    );
  });

  it('renders a h6', () => {
    render(<Heading level={6}>Level 6</Heading>);
    expect(screen.getByRole('heading', { level: 6 })).toHaveTextContent(
      'Level 6'
    );
  });

  it('renders a text with heading styles', () => {
    render(
      <Heading isFake={true} level={2}>
        Fake heading
      </Heading>
    );
    expect(screen.queryByRole('heading', { level: 2 })).not.toBeInTheDocument();
    expect(screen.getByText('Fake heading')).toHaveClass('heading');
  });
});