Moved common test set-up code to helper function

test/visits/DomainVisits.test.tsx

@@ -1,5 +1,4 @@
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+import { screen } from '@testing-library/react';
 import { MemoryRouter } from 'react-router-dom';
 import { Mock } from 'ts-mockery';
 import { formatISO } from 'date-fns';
@@ -10,6 +9,7 @@ import { DomainVisits } from '../../src/visits/reducers/domainVisits';
 import { Settings } from '../../src/settings/reducers/settings';
 import { SelectedServer } from '../../src/servers/data';
 import { Visit } from '../../src/visits/types';
+import { renderWithEvents } from '../__mocks__/setUpTest';
 
 jest.mock('react-router-dom', () => ({
   ...jest.requireActual('react-router-dom'),
@@ -22,21 +22,18 @@ describe('<DomainVisits />', () => {
   const cancelGetDomainVisits = jest.fn();
   const domainVisits = Mock.of<DomainVisits>({ visits: [Mock.of<Visit>({ date: formatISO(new Date()) })] });
   const DomainVisits = createDomainVisits(Mock.of<ReportExporter>({ exportVisits }));
-  const setUp = () => ({
-    user: userEvent.setup(),
-    ...render(
-      <MemoryRouter>
-        <DomainVisits
-          {...Mock.of<MercureBoundProps>({ mercureInfo: {} })}
-          getDomainVisits={getDomainVisits}
-          cancelGetDomainVisits={cancelGetDomainVisits}
-          domainVisits={domainVisits}
-          settings={Mock.all<Settings>()}
-          selectedServer={Mock.all<SelectedServer>()}
-        />
-      </MemoryRouter>,
-    ),
-  });
+  const setUp = () => renderWithEvents(
+    <MemoryRouter>
+      <DomainVisits
+        {...Mock.of<MercureBoundProps>({ mercureInfo: {} })}
+        getDomainVisits={getDomainVisits}
+        cancelGetDomainVisits={cancelGetDomainVisits}
+        domainVisits={domainVisits}
+        settings={Mock.all<Settings>()}
+        selectedServer={Mock.all<SelectedServer>()}
+      />
+    </MemoryRouter>,
+  );
 
   it('wraps visits stats and header', () => {
     setUp();

test/visits/NonOrphanVisits.test.tsx

@@ -1,5 +1,4 @@
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+import { screen } from '@testing-library/react';
 import { MemoryRouter } from 'react-router-dom';
 import { Mock } from 'ts-mockery';
 import { formatISO } from 'date-fns';
@@ -9,6 +8,7 @@ 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 { renderWithEvents } from '../__mocks__/setUpTest';
 
 describe('<NonOrphanVisits />', () => {
   const exportVisits = jest.fn();
@@ -16,21 +16,18 @@ describe('<NonOrphanVisits />', () => {
   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 setUp = () => ({
-    user: userEvent.setup(),
-    ...render(
-      <MemoryRouter>
-        <NonOrphanVisits
-          {...Mock.of<MercureBoundProps>({ mercureInfo: {} })}
-          getNonOrphanVisits={getNonOrphanVisits}
-          cancelGetNonOrphanVisits={cancelGetNonOrphanVisits}
-          nonOrphanVisits={nonOrphanVisits}
-          settings={Mock.all<Settings>()}
-          selectedServer={Mock.all<SelectedServer>()}
-        />
-      </MemoryRouter>,
-    ),
-  });
+  const setUp = () => renderWithEvents(
+    <MemoryRouter>
+      <NonOrphanVisits
+        {...Mock.of<MercureBoundProps>({ mercureInfo: {} })}
+        getNonOrphanVisits={getNonOrphanVisits}
+        cancelGetNonOrphanVisits={cancelGetNonOrphanVisits}
+        nonOrphanVisits={nonOrphanVisits}
+        settings={Mock.all<Settings>()}
+        selectedServer={Mock.all<SelectedServer>()}
+      />
+    </MemoryRouter>,
+  );
 
   it('wraps visits stats and header', () => {
     setUp();

test/visits/OrphanVisits.test.tsx

@@ -1,5 +1,4 @@
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+import { screen } from '@testing-library/react';
 import { MemoryRouter } from 'react-router-dom';
 import { Mock } from 'ts-mockery';
 import { formatISO } from 'date-fns';
@@ -9,27 +8,25 @@ 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 { renderWithEvents } from '../__mocks__/setUpTest';
 
 describe('<OrphanVisits />', () => {
   const getOrphanVisits = jest.fn();
   const exportVisits = jest.fn();
   const orphanVisits = Mock.of<VisitsInfo>({ visits: [Mock.of<Visit>({ date: formatISO(new Date()) })] });
   const OrphanVisits = createOrphanVisits(Mock.of<ReportExporter>({ exportVisits }));
-  const setUp = () => ({
-    user: userEvent.setup(),
-    ...render(
-      <MemoryRouter>
-        <OrphanVisits
-          {...Mock.of<MercureBoundProps>({ mercureInfo: {} })}
-          getOrphanVisits={getOrphanVisits}
-          orphanVisits={orphanVisits}
-          cancelGetOrphanVisits={jest.fn()}
-          settings={Mock.all<Settings>()}
-          selectedServer={Mock.all<SelectedServer>()}
-        />
-      </MemoryRouter>,
-    ),
-  });
+  const setUp = () => renderWithEvents(
+    <MemoryRouter>
+      <OrphanVisits
+        {...Mock.of<MercureBoundProps>({ mercureInfo: {} })}
+        getOrphanVisits={getOrphanVisits}
+        orphanVisits={orphanVisits}
+        cancelGetOrphanVisits={jest.fn()}
+        settings={Mock.all<Settings>()}
+        selectedServer={Mock.all<SelectedServer>()}
+      />
+    </MemoryRouter>,
+  );
 
   it('wraps visits stats and header', () => {
     setUp();

test/visits/ShortUrlVisits.test.tsx

@@ -1,5 +1,4 @@
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+import { screen } from '@testing-library/react';
 import { MemoryRouter } from 'react-router-dom';
 import { identity } from 'ramda';
 import { Mock } from 'ts-mockery';
@@ -11,29 +10,27 @@ import { MercureBoundProps } from '../../src/mercure/helpers/boundToMercureHub';
 import { ReportExporter } from '../../src/common/services/ReportExporter';
 import { Visit } from '../../src/visits/types';
 import { Settings } from '../../src/settings/reducers/settings';
+import { renderWithEvents } from '../__mocks__/setUpTest';
 
 describe('<ShortUrlVisits />', () => {
   const getShortUrlVisitsMock = jest.fn();
   const exportVisits = jest.fn();
   const shortUrlVisits = Mock.of<ShortUrlVisitsState>({ visits: [Mock.of<Visit>({ date: formatISO(new Date()) })] });
   const ShortUrlVisits = createShortUrlVisits(Mock.of<ReportExporter>({ exportVisits }));
-  const setUp = () => ({
-    user: userEvent.setup(),
-    ...render(
-      <MemoryRouter>
-        <ShortUrlVisits
-          {...Mock.all<ShortUrlVisitsProps>()}
-          {...Mock.of<MercureBoundProps>({ mercureInfo: {} })}
-          getShortUrlDetail={identity}
-          getShortUrlVisits={getShortUrlVisitsMock}
-          shortUrlVisits={shortUrlVisits}
-          shortUrlDetail={Mock.all<ShortUrlDetail>()}
-          settings={Mock.all<Settings>()}
-          cancelGetShortUrlVisits={() => {}}
-        />
-      </MemoryRouter>,
-    ),
-  });
+  const setUp = () => renderWithEvents(
+    <MemoryRouter>
+      <ShortUrlVisits
+        {...Mock.all<ShortUrlVisitsProps>()}
+        {...Mock.of<MercureBoundProps>({ mercureInfo: {} })}
+        getShortUrlDetail={identity}
+        getShortUrlVisits={getShortUrlVisitsMock}
+        shortUrlVisits={shortUrlVisits}
+        shortUrlDetail={Mock.all<ShortUrlDetail>()}
+        settings={Mock.all<Settings>()}
+        cancelGetShortUrlVisits={() => {}}
+      />
+    </MemoryRouter>,
+  );
 
   it('wraps visits stats and header', () => {
     setUp();

test/visits/ShortUrlVisitsHeader.test.tsx

@@ -1,10 +1,10 @@
-import { render, screen, waitFor } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+import { screen, waitFor } from '@testing-library/react';
 import { Mock } from 'ts-mockery';
 import { formatDistance, parseISO } from 'date-fns';
 import { ShortUrlVisitsHeader } from '../../src/visits/ShortUrlVisitsHeader';
 import { ShortUrlDetail } from '../../src/short-urls/reducers/shortUrlDetail';
 import { ShortUrlVisits } from '../../src/visits/reducers/shortUrlVisits';
+import { renderWithEvents } from '../__mocks__/setUpTest';
 
 describe('<ShortUrlVisitsHeader />', () => {
   const dateCreated = '2018-01-01T10:00:00+00:00';
@@ -23,12 +23,9 @@ describe('<ShortUrlVisitsHeader />', () => {
       },
       loading: false,
     });
-    return {
-      user: userEvent.setup(),
-      ...render(
-        <ShortUrlVisitsHeader shortUrlDetail={shortUrlDetail} shortUrlVisits={shortUrlVisits} goBack={goBack} />,
-      ),
-    };
+    return renderWithEvents(
+      <ShortUrlVisitsHeader shortUrlDetail={shortUrlDetail} shortUrlVisits={shortUrlVisits} goBack={goBack} />,
+    );
   };
 
   it('shows when the URL was created', async () => {

test/visits/TagVisits.test.tsx

@@ -1,5 +1,4 @@
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+import { screen } from '@testing-library/react';
 import { formatISO } from 'date-fns';
 import { MemoryRouter } from 'react-router-dom';
 import { Mock } from 'ts-mockery';
@@ -10,6 +9,7 @@ import { MercureBoundProps } from '../../src/mercure/helpers/boundToMercureHub';
 import { ReportExporter } from '../../src/common/services/ReportExporter';
 import { Visit } from '../../src/visits/types';
 import { Settings } from '../../src/settings/reducers/settings';
+import { renderWithEvents } from '../__mocks__/setUpTest';
 
 jest.mock('react-router-dom', () => ({
   ...jest.requireActual('react-router-dom'),
@@ -24,21 +24,18 @@ describe('<TagVisits />', () => {
     Mock.of<ColorGenerator>({ isColorLightForKey: () => false, getColorForKey: () => 'red' }),
     Mock.of<ReportExporter>({ exportVisits }),
   );
-  const setUp = () => ({
-    user: userEvent.setup(),
-    ...render(
-      <MemoryRouter>
-        <TagVisits
-          {...Mock.all<TagVisitsProps>()}
-          {...Mock.of<MercureBoundProps>({ mercureInfo: {} })}
-          getTagVisits={getTagVisitsMock}
-          tagVisits={tagVisits}
-          settings={Mock.all<Settings>()}
-          cancelGetTagVisits={() => {}}
-        />
-      </MemoryRouter>,
-    ),
-  });
+  const setUp = () => renderWithEvents(
+    <MemoryRouter>
+      <TagVisits
+        {...Mock.all<TagVisitsProps>()}
+        {...Mock.of<MercureBoundProps>({ mercureInfo: {} })}
+        getTagVisits={getTagVisitsMock}
+        tagVisits={tagVisits}
+        settings={Mock.all<Settings>()}
+        cancelGetTagVisits={() => {}}
+      />
+    </MemoryRouter>,
+  );
 
   it('wraps visits stats and header', () => {
     setUp();

test/visits/charts/DoughnutChart.test.tsx

@@ -1,6 +1,6 @@
 import { screen } from '@testing-library/react';
 import { DoughnutChart } from '../../../src/visits/charts/DoughnutChart';
-import { setUpCanvas } from '../../__mocks__/setUpCanvas';
+import { setUpCanvas } from '../../__mocks__/setUpTest';
 
 describe('<DoughnutChart />', () => {
   const stats = {

test/visits/charts/HorizontalBarChart.test.tsx

@@ -1,5 +1,5 @@
 import { HorizontalBarChart, HorizontalBarChartProps } from '../../../src/visits/charts/HorizontalBarChart';
-import { setUpCanvas } from '../../__mocks__/setUpCanvas';
+import { setUpCanvas } from '../../__mocks__/setUpTest';
 
 describe('<HorizontalBarChart />', () => {
   const setUp = (props: HorizontalBarChartProps) => setUpCanvas(<HorizontalBarChart {...props} />);

test/visits/charts/LineChartCard.test.tsx

@@ -4,7 +4,7 @@ import { formatISO, subDays, subMonths, subYears } from 'date-fns';
 import { Mock } from 'ts-mockery';
 import { LineChartCard } from '../../../src/visits/charts/LineChartCard';
 import { NormalizedVisit } from '../../../src/visits/types';
-import { setUpCanvas } from '../../__mocks__/setUpCanvas';
+import { setUpCanvas } from '../../__mocks__/setUpTest';
 
 describe('<LineChartCard />', () => {
   const setUp = (visits: NormalizedVisit[] = [], highlightedVisits: NormalizedVisit[] = []) => ({

test/visits/helpers/OpenMapModalBtn.test.tsx

@@ -1,8 +1,8 @@
-import { render, screen, waitFor } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+import { screen, waitFor } from '@testing-library/react';
 import { Mock } from 'ts-mockery';
 import { OpenMapModalBtn } from '../../../src/visits/helpers/OpenMapModalBtn';
 import { CityStats } from '../../../src/visits/types';
+import { renderWithEvents } from '../../__mocks__/setUpTest';
 
 describe('<OpenMapModalBtn />', () => {
   const title = 'Foo';
@@ -10,10 +10,9 @@ describe('<OpenMapModalBtn />', () => {
     Mock.of<CityStats>({ cityName: 'foo', count: 30, latLong: [5, 5] }),
     Mock.of<CityStats>({ cityName: 'bar', count: 45, latLong: [88, 88] }),
   ];
-  const setUp = (activeCities?: string[]) => ({
-    user: userEvent.setup(),
-    ...render(<OpenMapModalBtn modalTitle={title} locations={locations} activeCities={activeCities} />),
-  });
+  const setUp = (activeCities?: string[]) => renderWithEvents(
+    <OpenMapModalBtn modalTitle={title} locations={locations} activeCities={activeCities} />,
+  );
 
   it('renders tooltip on button hover and opens modal on click', async () => {
     const { user } = setUp();

test/visits/helpers/VisitsFilterDropdown.test.tsx

@@ -1,21 +1,18 @@
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
+import { screen } from '@testing-library/react';
 import { OrphanVisitType, VisitsFilter } from '../../../src/visits/types';
 import { VisitsFilterDropdown } from '../../../src/visits/helpers/VisitsFilterDropdown';
+import { renderWithEvents } from '../../__mocks__/setUpTest';
 
 describe('<VisitsFilterDropdown />', () => {
   const onChange = jest.fn();
-  const setUp = (selected: VisitsFilter = {}, isOrphanVisits = true, botsSupported = true) => ({
-    user: userEvent.setup(),
-    ...render(
-      <VisitsFilterDropdown
-        isOrphanVisits={isOrphanVisits}
-        botsSupported={botsSupported}
-        selected={selected}
-        onChange={onChange}
-      />,
-    ),
-  });
+  const setUp = (selected: VisitsFilter = {}, isOrphanVisits = true, botsSupported = true) => renderWithEvents(
+    <VisitsFilterDropdown
+      isOrphanVisits={isOrphanVisits}
+      botsSupported={botsSupported}
+      selected={selected}
+      onChange={onChange}
+    />,
+  );
 
   beforeEach(jest.clearAllMocks);