@eureca/eureca-ui/src/components/TrackContextHeader/__tests__/track-context-header.test.js

UI component library of Eureca's user and admin apps

import React from 'react';
import { render } from '@testing-library/react';
import { format } from 'date-fns';
import { FiLayers } from 'react-icons/fi';

import { TrackContextHeader } from '..';

const data = {
  title: 'Online',
  icon: <FiLayers />,
  status: 'open',
  endDate: new Date(),
  score: 300,
  totalScore: 500,
  results: false,
};

function renderHeader(data) {
  return render(<TrackContextHeader {...data} />);
}

describe('Track Context Header', () => {
  it('shows the correct title', async () => {
    const { getByText } = renderHeader({ ...data });

    const title = getByText(`Fase ${data.title}`);
    expect(title.textContent).toEqual(`Fase ${data.title}`);
  });

  it('shows the correct date', async () => {
    const { getByText } = renderHeader({ ...data });

    const status = getByText(/Aberta/);
    expect(status.textContent).toMatch(`${format(new Date(), 'dd/MM')}`);
  });

  it('shows the correct score', async () => {
    const { getByText } = renderHeader({ ...data });

    const score = getByText(/300/);
    expect(score.textContent).toMatch(`${data.score}`);
  });

  it('shows the correct total score', async () => {
    const { getByText } = renderHeader({ ...data });

    const totalScore = getByText(/500/);
    expect(totalScore.textContent).toMatch(`${data.totalScore}`);
  });
});