From eab072831d90c0f854364fc1f61237fbe7489f04 Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandrocelaya@gmail.com>
Date: Mon, 7 Feb 2022 22:55:32 +0100
Subject: [PATCH] Fixed VisitsStats test

---
 CHANGELOG.md                     |  1 +
 test/visits/VisitsStats.test.tsx | 25 ++++++++++++++++++-------
 2 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9eff9ec1..0bf303b3 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,6 +11,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ### Changed
 * [#567](https://github.com/shlinkio/shlink-web-client/pull/567) Improved Shlink 3.0.0 compatibility by checking the `INVALID_SHORT_URL_DELETION` error code when deleting short URLs.
+* [#524](https://github.com/shlinkio/shlink-web-client/pull/524) Updated to react-router v6.
 
 ### Deprecated
 * *Nothing*
diff --git a/test/visits/VisitsStats.test.tsx b/test/visits/VisitsStats.test.tsx
index 24529b7a..1fe1f5c5 100644
--- a/test/visits/VisitsStats.test.tsx
+++ b/test/visits/VisitsStats.test.tsx
@@ -1,6 +1,8 @@
 import { shallow, ShallowWrapper } from 'enzyme';
 import { Button, Progress } from 'reactstrap';
+import { sum } from 'ramda';
 import { Mock } from 'ts-mockery';
+import { Route } from 'react-router-dom';
 import VisitStats from '../../src/visits/VisitsStats';
 import Message from '../../src/utils/Message';
 import { Visit, VisitsInfo } from '../../src/visits/types';
@@ -75,18 +77,27 @@ describe('<VisitsStats />', () => {
 
   it('renders expected amount of charts', () => {
     const wrapper = createComponent({ loading: false, error: false, visits });
-    const charts = wrapper.find(DoughnutChartCard);
-    const sortableCharts = wrapper.find(SortableBarChartCard);
-    const lineChart = wrapper.find(LineChartCard);
-    const table = wrapper.find(VisitsTable);
+    const total = sum(wrapper.find(Route).map((element) => {
+      const ElementComponents = () => element.prop('element');
+      // @ts-expect-error Wrapped element
+      const wrappedElement = shallow(<ElementComponents />);
 
-    expect(charts.length + sortableCharts.length + lineChart.length).toEqual(6);
-    expect(table).toHaveLength(1);
+      const charts = wrappedElement.find(DoughnutChartCard);
+      const sortableCharts = wrappedElement.find(SortableBarChartCard);
+      const lineChart = wrappedElement.find(LineChartCard);
+      const table = wrappedElement.find(VisitsTable);
+
+      return charts.length + sortableCharts.length + lineChart.length + table.length;
+    }));
+
+    expect(total).toEqual(7);
   });
 
   it('holds the map button content generator on cities chart extraHeaderContent', () => {
     const wrapper = createComponent({ loading: false, error: false, visits });
-    const citiesChart = wrapper.find(SortableBarChartCard).find('[title="Cities"]');
+    const ElementComponent = () => wrapper.find(Route).findWhere((element) => element.prop('path') === 'by-location')
+      .prop('element');
+    const citiesChart = shallow(<ElementComponent />).find(SortableBarChartCard).find('[title="Cities"]');
     const extraHeaderContent = citiesChart.prop('extraHeaderContent');
 
     expect(extraHeaderContent).toHaveLength(1);