@eureca/eureca-ui/src/components/Inputs/__tests__/select-datepicker.test.js

UI component library of Eureca's user and admin apps

import React from 'react';
import '@testing-library/jest-dom/extend-expect';
import { render, fireEvent } from '@testing-library/react';
import { MuiPickersUtilsProvider } from '@material-ui/pickers';
import DateFnsUtils from '@date-io/date-fns';
import { format } from 'date-fns';
import { ptBR } from 'date-fns/locale';

import { SelectDatePicker } from '..';

const onChangeMock = jest.fn();

function renderSelectDatepicker({ onChange }) {
  return render(
    <MuiPickersUtilsProvider utils={DateFnsUtils} locale={ptBR}>
      <SelectDatePicker onChange={onChange} />
    </MuiPickersUtilsProvider>
  );
}

describe('Select timepicker component', () => {
  it('opens the date picker by clicking the right option', async () => {
    const { getByTestId } = renderSelectDatepicker({
      onChange: onChangeMock,
    });

    const selectDatePicker = getByTestId('select-timepicker');

    fireEvent.click(selectDatePicker);

    const radioSelect = getByTestId('radio-selecionar-prazo');
    expect(radioSelect.firstChild.firstChild).toHaveProperty('checked', false);

    fireEvent.click(radioSelect.firstChild.firstChild);
    const datepicker = getByTestId('material-datepicker');
    expect(datepicker).toBeInTheDocument();

    const currentDate = format(new Date(), 'dd/MM/yyyy');
    const displayedDate = datepicker.children[1].children[0].value;

    expect(displayedDate).toEqual(currentDate);
  });
});