src/components/atoms/figure/figure.test.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

import { describe, expect, it } from '@jest/globals';
import { render, screen as rtlScreen } from '@testing-library/react';
import { Figure } from './figure';

describe('Figure', () => {
  it('renders the figure contents', () => {
    const body = 'tempora et quis';

    render(<Figure>{body}</Figure>);

    expect(rtlScreen.getByRole('figure')).toHaveTextContent(body);
  });

  it('can render its contents with a caption', () => {
    const body = 'tempora et quis';
    const caption = 'velit dolores magnam';

    render(<Figure caption={caption}>{body}</Figure>);

    expect(rtlScreen.getByRole('figure', { name: caption })).toHaveTextContent(
      body
    );
  });

  it('can style the figure with borders', () => {
    const body = 'tempora et quis';

    render(<Figure hasBorders>{body}</Figure>);

    expect(rtlScreen.getByRole('figure')).toHaveClass('wrapper--has-borders');
  });
});