From 8edb3dc923616df362b1bc5318bf0e64d5348c46 Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandrocelaya@gmail.com>
Date: Sun, 1 May 2022 16:52:33 +0200
Subject: [PATCH] Migrated NonOrphanVisits test to react testing library

---
 test/visits/NonOrphanVisits.test.tsx | 50 ++++++++++++++++------------
 1 file changed, 28 insertions(+), 22 deletions(-)

diff --git a/test/visits/NonOrphanVisits.test.tsx b/test/visits/NonOrphanVisits.test.tsx
index 9419b327..136ee61d 100644
--- a/test/visits/NonOrphanVisits.test.tsx
+++ b/test/visits/NonOrphanVisits.test.tsx
@@ -1,13 +1,13 @@
-import { shallow } from 'enzyme';
+import { fireEvent, render, screen } from '@testing-library/react';
+import { MemoryRouter } from 'react-router-dom';
 import { Mock } from 'ts-mockery';
+import { formatISO } from 'date-fns';
 import { NonOrphanVisits as createNonOrphanVisits } from '../../src/visits/NonOrphanVisits';
 import { MercureBoundProps } from '../../src/mercure/helpers/boundToMercureHub';
-import { VisitsInfo } from '../../src/visits/types';
-import VisitsStats from '../../src/visits/VisitsStats';
+import { Visit, VisitsInfo } from '../../src/visits/types';
 import { Settings } from '../../src/settings/reducers/settings';
 import { ReportExporter } from '../../src/common/services/ReportExporter';
 import { SelectedServer } from '../../src/servers/data';
-import VisitsHeader from '../../src/visits/VisitsHeader';
 
 jest.mock('react-router-dom', () => ({
   ...jest.requireActual('react-router-dom'),
@@ -16,31 +16,37 @@ jest.mock('react-router-dom', () => ({
 }));
 
 describe('<NonOrphanVisits />', () => {
-  it('wraps visits stats and header', () => {
-    const getNonOrphanVisits = jest.fn();
-    const cancelGetNonOrphanVisits = jest.fn();
-    const nonOrphanVisits = Mock.all<VisitsInfo>();
-    const NonOrphanVisits = createNonOrphanVisits(Mock.all<ReportExporter>());
+  const exportVisits = jest.fn();
+  const getNonOrphanVisits = jest.fn();
+  const cancelGetNonOrphanVisits = jest.fn();
+  const nonOrphanVisits = Mock.of<VisitsInfo>({ visits: [Mock.of<Visit>({ date: formatISO(new Date()) })] });
+  const NonOrphanVisits = createNonOrphanVisits(Mock.of<ReportExporter>({ exportVisits }));
 
-    const wrapper = shallow(
+  beforeEach(() => render(
+    <MemoryRouter>
       <NonOrphanVisits
         {...Mock.of<MercureBoundProps>({ mercureInfo: {} })}
         getNonOrphanVisits={getNonOrphanVisits}
-        nonOrphanVisits={nonOrphanVisits}
         cancelGetNonOrphanVisits={cancelGetNonOrphanVisits}
+        nonOrphanVisits={nonOrphanVisits}
         settings={Mock.all<Settings>()}
         selectedServer={Mock.all<SelectedServer>()}
-      />,
-    ).dive();
-    const stats = wrapper.find(VisitsStats);
-    const header = wrapper.find(VisitsHeader);
+      />
+    </MemoryRouter>,
+  ));
 
-    expect(stats).toHaveLength(1);
-    expect(header).toHaveLength(1);
-    expect(stats.prop('cancelGetVisits')).toEqual(cancelGetNonOrphanVisits);
-    expect(stats.prop('visitsInfo')).toEqual(nonOrphanVisits);
-    expect(stats.prop('isOrphanVisits')).not.toBeDefined();
-    expect(header.prop('visits')).toEqual(nonOrphanVisits.visits);
-    expect(header.prop('goBack')).toEqual(expect.any(Function));
+  it('wraps visits stats and header', () => {
+    expect(screen.getByRole('heading', { name: 'Non-orphan visits' })).toBeInTheDocument();
+    expect(getNonOrphanVisits).toHaveBeenCalled();
+  });
+
+  it('exports visits when clicking the button', () => {
+    const btn = screen.getByRole('button', { name: 'Export (1)' });
+
+    expect(exportVisits).not.toHaveBeenCalled();
+    expect(btn).toBeInTheDocument();
+
+    fireEvent.click(btn);
+    expect(exportVisits).toHaveBeenCalledWith('non_orphan_visits.csv', expect.anything());
   });
 });