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('', () => {
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();
- 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().find(SortableBarChartCard).find('[title="Cities"]');
const extraHeaderContent = citiesChart.prop('extraHeaderContent');
expect(extraHeaderContent).toHaveLength(1);