import React from 'react';
import { cleanup } from '@testing-library/react';
import { render } from '../../../utils/theme-render-wrapper';
import { InfoCardWithDate } from './info-card-with-date';

afterEach(cleanup);

const title = 'Billing Cycle';
const data = 'Monthly';
const dateDescription = 'Next billing date:';
const date = 'Apr 02, 2021';

const Wrapper = () => (
  <InfoCardWithDate title={title} data={data} dateDescription={dateDescription} date={date} />
);

it(`Should render InfoCardWithDate with a all data`, () => {
  const { queryByText } = render(<Wrapper />);
  let elm = queryByText(title);
  expect(elm?.innerHTML).toBe(title);
  elm = queryByText(data);
  expect(elm?.innerHTML).toBe(data);
  elm = queryByText(dateDescription);
  expect(elm?.innerHTML).toBe(dateDescription);
  elm = queryByText(date);
  expect(elm?.innerHTML).toBe(date);
});