/* eslint-disable no-undef */
import React from 'react';
import { cleanup } from '@testing-library/react';
import '@testing-library/jest-dom';

import testWrapper from '../helpers/testWrapper';
import Typography from '../components/Typography';

describe('Typography component', () => {
  afterEach(cleanup);

  test('check title style', () => {
    const { getByText } = testWrapper(
      <Typography variant="title">title</Typography>,
    );

    expect(getByText('title')).toHaveStyle(
      'font-size: 1.35rem;color: #000000;',
    );
  });

  test('check subtitle style', () => {
    const { queryByText } = testWrapper(
      <Typography variant="subtitle">title</Typography>,
    );

    expect(queryByText('title')).toHaveStyle(
      'font-size: 1.2rem;color: #000000;',
    );
  });
});