department-of-veterans-affairs/vets-website

View on GitHub
src/applications/check-in/components/pages/Appointments/AppointmentsPage.unit.spec.jsx

Summary

Maintainability
C
1 day
Test Coverage
/* eslint-disable camelcase */
import React from 'react';
import { expect } from 'chai';
import sinon from 'sinon';
import format from 'date-fns/format';
import { render } from '@testing-library/react';
import { setupI18n, teardownI18n } from '../../../utils/i18n/i18n';
import AppointmentsPage from './index';
import CheckInProvider from '../../../tests/unit/utils/CheckInProvider';
import * as useGetCheckInDataModule from '../../../hooks/useGetCheckInData';

describe('unified check-in experience', () => {
  beforeEach(() => {
    setupI18n();
  });
  afterEach(() => {
    teardownI18n();
  });
  describe('AppointmentsPage', () => {
    const appointmentsOn = {
      check_in_experience_upcoming_appointments_enabled: true,
    };
    const appointmentsOff = {
      check_in_experience_upcoming_appointments_enabled: false,
    };
    it('renders regions', () => {
      // Mock the return value for the useGetCheckInData hook
      const useGetCheckInDataStub = sinon
        .stub(useGetCheckInDataModule, 'useGetCheckInData')
        .returns({
          isComplete: true,
        });

      const { getByTestId } = render(
        <CheckInProvider store={{ features: appointmentsOn }}>
          <AppointmentsPage />
        </CheckInProvider>,
      );

      expect(getByTestId('what-to-do-next')).to.exist;
      expect(getByTestId('upcoming-appointments-vista')).to.exist;
      expect(getByTestId('appointments-accordions')).to.exist;
      expect(getByTestId('link-list-block')).to.exist;

      // Restore the hook
      useGetCheckInDataStub.restore();
    });
    it('displays a loading component if data is loading', () => {
      // Mock the return value for the useGetCheckInData hook
      const useGetCheckInDataStub = sinon
        .stub(useGetCheckInDataModule, 'useGetCheckInData')
        .returns({
          isComplete: false,
          isLoading: true,
        });
      const screen = render(
        <CheckInProvider store={{ appointments: [], features: appointmentsOn }}>
          <AppointmentsPage />
        </CheckInProvider>,
      );

      expect(screen.getByTestId('loading-indicator')).to.exist;
      // restore the hook
      useGetCheckInDataStub.restore();
    });
    it('shows the date & time the appointments were loaded & a refresh link', () => {
      const checkIn = render(
        <CheckInProvider store={{ features: appointmentsOn }}>
          <AppointmentsPage />
        </CheckInProvider>,
      );
      expect(checkIn.getByTestId('update-text')).to.have.text(
        `Latest update: ${format(new Date(), "MMMM d, yyyy 'at' h:mm aaaa")}`,
      );
      const refreshButton = checkIn.queryByTestId(
        'refresh-appointments-button',
      );
      expect(refreshButton).to.exist;
    });
    it('displays upcoming vista appointments with the feature off', () => {
      const checkIn = render(
        <CheckInProvider store={{ features: appointmentsOff }}>
          <AppointmentsPage />
        </CheckInProvider>,
      );
      expect(checkIn.queryByTestId('upcoming-appointments-vista')).to.exist;
      expect(checkIn.getByTestId('upcoming-appointments-header-vista')).to
        .exist;
    });
    it('shows a privacy act modal if the link is clicked', () => {
      const checkIn = render(
        <CheckInProvider store={{ features: appointmentsOn }}>
          <AppointmentsPage />
        </CheckInProvider>,
      );
      const privacyActLink = checkIn.getByTestId('privacy-act-statement-link');
      expect(privacyActLink).to.exist;
      privacyActLink.click();
      expect(checkIn.getByTestId('privacy-act-statement-text')).to.exist;
    });
  });
});