diff --git a/x-pack/plugins/uptime/public/components/common/__tests__/uptime_date_picker.test.tsx b/x-pack/plugins/uptime/public/components/common/__tests__/uptime_date_picker.test.tsx
index 445d9302e3a9..16853211433c 100644
--- a/x-pack/plugins/uptime/public/components/common/__tests__/uptime_date_picker.test.tsx
+++ b/x-pack/plugins/uptime/public/components/common/__tests__/uptime_date_picker.test.tsx
@@ -6,7 +6,7 @@
import React from 'react';
import { UptimeDatePicker } from '../uptime_date_picker';
-import { renderWithRouter, shallowWithRouter } from '../../../lib';
+import { renderWithRouter, shallowWithRouter, MountWithReduxProvider } from '../../../lib';
describe('UptimeDatePicker component', () => {
it('validates props with shallow render', () => {
@@ -15,7 +15,11 @@ describe('UptimeDatePicker component', () => {
});
it('renders properly with mock data', () => {
- const component = renderWithRouter();
+ const component = renderWithRouter(
+
+
+
+ );
expect(component).toMatchSnapshot();
});
});
diff --git a/x-pack/plugins/uptime/public/components/common/charts/__tests__/monitor_bar_series.test.tsx b/x-pack/plugins/uptime/public/components/common/charts/__tests__/monitor_bar_series.test.tsx
index 4522f8d633fa..5e49d303c5c6 100644
--- a/x-pack/plugins/uptime/public/components/common/charts/__tests__/monitor_bar_series.test.tsx
+++ b/x-pack/plugins/uptime/public/components/common/charts/__tests__/monitor_bar_series.test.tsx
@@ -6,7 +6,7 @@
import React from 'react';
import { MonitorBarSeries, MonitorBarSeriesProps } from '../monitor_bar_series';
-import { renderWithRouter, shallowWithRouter } from '../../../../lib';
+import { renderWithRouter, shallowWithRouter, MountWithReduxProvider } from '../../../../lib';
import { HistogramPoint } from '../../../../../common/runtime_types';
describe('MonitorBarSeries component', () => {
@@ -197,7 +197,11 @@ describe('MonitorBarSeries component', () => {
});
it('renders if the data series is present', () => {
- const component = renderWithRouter();
+ const component = renderWithRouter(
+
+
+
+ );
expect(component).toMatchSnapshot();
});
});
diff --git a/x-pack/plugins/uptime/public/components/common/charts/__tests__/ping_histogram.test.tsx b/x-pack/plugins/uptime/public/components/common/charts/__tests__/ping_histogram.test.tsx
index 21c1fa86eeee..57a38f2a949e 100644
--- a/x-pack/plugins/uptime/public/components/common/charts/__tests__/ping_histogram.test.tsx
+++ b/x-pack/plugins/uptime/public/components/common/charts/__tests__/ping_histogram.test.tsx
@@ -6,7 +6,7 @@
import React from 'react';
import { PingHistogramComponent, PingHistogramComponentProps } from '../ping_histogram';
-import { renderWithRouter, shallowWithRouter } from '../../../../lib';
+import { renderWithRouter, shallowWithRouter, MountWithReduxProvider } from '../../../../lib';
describe('PingHistogram component', () => {
const props: PingHistogramComponentProps = {
@@ -49,7 +49,12 @@ describe('PingHistogram component', () => {
});
it('renders the component without errors', () => {
- const component = renderWithRouter();
+ const component = renderWithRouter(
+
+
+
+ );
+
expect(component).toMatchSnapshot();
});
});
diff --git a/x-pack/plugins/uptime/public/components/overview/monitor_list/__tests__/filter_status_button.test.tsx b/x-pack/plugins/uptime/public/components/overview/monitor_list/__tests__/filter_status_button.test.tsx
index 58c305f0d15a..612ede2c556e 100644
--- a/x-pack/plugins/uptime/public/components/overview/monitor_list/__tests__/filter_status_button.test.tsx
+++ b/x-pack/plugins/uptime/public/components/overview/monitor_list/__tests__/filter_status_button.test.tsx
@@ -6,7 +6,7 @@
import React from 'react';
import { FilterStatusButton, FilterStatusButtonProps } from '../filter_status_button';
-import { renderWithRouter, shallowWithRouter } from '../../../../lib';
+import { renderWithRouter, shallowWithRouter, MountWithReduxProvider } from '../../../../lib';
describe('FilterStatusButton', () => {
let props: FilterStatusButtonProps;
@@ -26,7 +26,11 @@ describe('FilterStatusButton', () => {
});
it('renders without errors for valid props', () => {
- const wrapper = renderWithRouter();
+ const wrapper = renderWithRouter(
+
+
+
+ );
expect(wrapper).toMatchSnapshot();
});
});
diff --git a/x-pack/plugins/uptime/public/components/overview/monitor_list/__tests__/status_filter.test.tsx b/x-pack/plugins/uptime/public/components/overview/monitor_list/__tests__/status_filter.test.tsx
index a1288513eb78..d09bbad5cb9e 100644
--- a/x-pack/plugins/uptime/public/components/overview/monitor_list/__tests__/status_filter.test.tsx
+++ b/x-pack/plugins/uptime/public/components/overview/monitor_list/__tests__/status_filter.test.tsx
@@ -5,7 +5,12 @@
*/
import React from 'react';
-import { mountWithRouter, renderWithRouter, shallowWithRouter } from '../../../../lib';
+import {
+ mountWithRouter,
+ renderWithRouter,
+ shallowWithRouter,
+ MountWithReduxProvider,
+} from '../../../../lib';
import { createMemoryHistory } from 'history';
import { StatusFilter } from '../status_filter';
import { FilterStatusButton } from '../filter_status_button';
@@ -18,7 +23,12 @@ describe('StatusFilterComponent', () => {
initialEntries: [`/?g=%22%22&statusFilter=${status}`],
});
- const wrapper = mountWithRouter(, history);
+ const wrapper = mountWithRouter(
+
+
+ ,
+ history
+ );
const filterBtns = wrapper.find(FilterStatusButton);
const allBtn = filterBtns.at(0);
@@ -34,7 +44,11 @@ describe('StatusFilterComponent', () => {
});
it('renders without errors for valid props', () => {
- const wrapper = renderWithRouter();
+ const wrapper = renderWithRouter(
+
+
+
+ );
expect(wrapper).toMatchSnapshot();
});
diff --git a/x-pack/plugins/uptime/public/hooks/__tests__/__snapshots__/use_url_params.test.tsx.snap b/x-pack/plugins/uptime/public/hooks/__tests__/__snapshots__/use_url_params.test.tsx.snap
index 827c9257893a..5d2565b7210d 100644
--- a/x-pack/plugins/uptime/public/hooks/__tests__/__snapshots__/use_url_params.test.tsx.snap
+++ b/x-pack/plugins/uptime/public/hooks/__tests__/__snapshots__/use_url_params.test.tsx.snap
@@ -137,30 +137,95 @@ exports[`useUrlParams deletes keys that do not have truthy values 1`] = `
}
}
>
-
+
-
- {"absoluteDateRangeStart":20,"absoluteDateRangeEnd":20,"autorefreshInterval":60000,"autorefreshIsPaused":false,"dateRangeStart":"now-12","dateRangeEnd":"now","filters":"","search":"","selectedPingStatus":"","statusFilter":"","pagination":"foo"}
-
-
-
-
+
+
+ {"absoluteDateRangeStart":20,"absoluteDateRangeEnd":20,"autorefreshInterval":60000,"autorefreshIsPaused":false,"dateRangeStart":"now-12","dateRangeEnd":"now","filters":"","search":"","selectedPingStatus":"","statusFilter":"","pagination":"foo"}
+
+
+
+
+
+
`;
@@ -301,24 +366,89 @@ exports[`useUrlParams gets the expected values using the context 1`] = `
}
}
>
-
-
- {"absoluteDateRangeStart":20,"absoluteDateRangeEnd":20,"autorefreshInterval":60000,"autorefreshIsPaused":false,"dateRangeStart":"now-15m","dateRangeEnd":"now","filters":"","search":"","selectedPingStatus":"","statusFilter":""}
-
-
-
-
+
+
+ {"absoluteDateRangeStart":20,"absoluteDateRangeEnd":20,"autorefreshInterval":60000,"autorefreshIsPaused":false,"dateRangeStart":"now-15m","dateRangeEnd":"now","filters":"","search":"","selectedPingStatus":"","statusFilter":""}
+
+
+
+
+
+
`;
diff --git a/x-pack/plugins/uptime/public/hooks/__tests__/use_breadcrumbs.test.tsx b/x-pack/plugins/uptime/public/hooks/__tests__/use_breadcrumbs.test.tsx
index 306919015fcb..d688660f564c 100644
--- a/x-pack/plugins/uptime/public/hooks/__tests__/use_breadcrumbs.test.tsx
+++ b/x-pack/plugins/uptime/public/hooks/__tests__/use_breadcrumbs.test.tsx
@@ -10,7 +10,7 @@ import { Route } from 'react-router-dom';
import { mountWithRouter } from '../../lib';
import { OVERVIEW_ROUTE } from '../../../common/constants';
import { KibanaContextProvider } from '../../../../../../src/plugins/kibana_react/public';
-import { UptimeUrlParams, getSupportedUrlParams } from '../../lib/helper';
+import { UptimeUrlParams, getSupportedUrlParams, MountWithReduxProvider } from '../../lib/helper';
import { makeBaseBreadcrumb, useBreadcrumbs } from '../use_breadcrumbs';
describe('useBreadcrumbs', () => {
@@ -34,11 +34,13 @@ describe('useBreadcrumbs', () => {
};
mountWithRouter(
-
-
-
-
-
+
+
+
+
+
+
+
);
const urlParams: UptimeUrlParams = getSupportedUrlParams({});
diff --git a/x-pack/plugins/uptime/public/hooks/__tests__/use_url_params.test.tsx b/x-pack/plugins/uptime/public/hooks/__tests__/use_url_params.test.tsx
index deb1f163c132..af5c113a0283 100644
--- a/x-pack/plugins/uptime/public/hooks/__tests__/use_url_params.test.tsx
+++ b/x-pack/plugins/uptime/public/hooks/__tests__/use_url_params.test.tsx
@@ -8,7 +8,7 @@ import DateMath from '@elastic/datemath';
import React, { useState, Fragment } from 'react';
import { useUrlParams, UptimeUrlParamsHook } from '../use_url_params';
import { UptimeRefreshContext } from '../../contexts';
-import { mountWithRouter } from '../../lib';
+import { mountWithRouter, MountWithReduxProvider } from '../../lib';
import { createMemoryHistory } from 'history';
interface MockUrlParamsComponentProps {
@@ -52,9 +52,11 @@ describe('useUrlParams', () => {
jest.spyOn(history, 'push');
const component = mountWithRouter(
-
-
- ,
+
+
+
+
+ ,
history
);
@@ -68,14 +70,16 @@ describe('useUrlParams', () => {
it('gets the expected values using the context', () => {
const component = mountWithRouter(
-
-
-
+
+
+
+
+
);
const getUrlParamsButton = component.find('#getUrlParams');
@@ -92,14 +96,16 @@ describe('useUrlParams', () => {
jest.spyOn(history, 'push');
const component = mountWithRouter(
-
-
- ,
+
+
+
+
+ ,
history
);
diff --git a/x-pack/plugins/uptime/public/lib/helper/helper_with_redux.tsx b/x-pack/plugins/uptime/public/lib/helper/helper_with_redux.tsx
new file mode 100644
index 000000000000..a68184dbdff9
--- /dev/null
+++ b/x-pack/plugins/uptime/public/lib/helper/helper_with_redux.tsx
@@ -0,0 +1,21 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React from 'react';
+import { Provider as ReduxProvider } from 'react-redux';
+
+export const MountWithReduxProvider: React.FC = ({ children }) => (
+
+ {children}
+
+);
diff --git a/x-pack/plugins/uptime/public/lib/helper/index.ts b/x-pack/plugins/uptime/public/lib/helper/index.ts
index cf49328141b8..10663163e8fd 100644
--- a/x-pack/plugins/uptime/public/lib/helper/index.ts
+++ b/x-pack/plugins/uptime/public/lib/helper/index.ts
@@ -9,3 +9,4 @@ export * from './observability_integration';
export { getChartDateLabel } from './charts';
export { seriesHasDownValues } from './series_has_down_values';
export { UptimeUrlParams, getSupportedUrlParams } from './url_params';
+export { MountWithReduxProvider } from './helper_with_redux';
diff --git a/x-pack/plugins/uptime/public/lib/index.ts b/x-pack/plugins/uptime/public/lib/index.ts
index 06ac06e647ad..92787737d579 100644
--- a/x-pack/plugins/uptime/public/lib/index.ts
+++ b/x-pack/plugins/uptime/public/lib/index.ts
@@ -4,4 +4,5 @@
* you may not use this file except in compliance with the Elastic License.
*/
+export { MountWithReduxProvider } from './helper';
export { renderWithRouter, shallowWithRouter, mountWithRouter } from './helper/helper_with_router';
diff --git a/x-pack/plugins/uptime/public/pages/__tests__/page_header.test.tsx b/x-pack/plugins/uptime/public/pages/__tests__/page_header.test.tsx
index c9e4eef38676..63d4c24f965d 100644
--- a/x-pack/plugins/uptime/public/pages/__tests__/page_header.test.tsx
+++ b/x-pack/plugins/uptime/public/pages/__tests__/page_header.test.tsx
@@ -6,47 +6,33 @@
import React from 'react';
import { PageHeader } from '../page_header';
-import { renderWithRouter } from '../../lib';
-import { Provider } from 'react-redux';
+import { renderWithRouter, MountWithReduxProvider } from '../../lib';
describe('PageHeader', () => {
it('shallow renders with the date picker', () => {
const component = renderWithRouter(
-
+
-
+
);
expect(component).toMatchSnapshot('page_header_with_date_picker');
});
it('shallow renders without the date picker', () => {
const component = renderWithRouter(
-
+
-
+
);
expect(component).toMatchSnapshot('page_header_no_date_picker');
});
it('shallow renders extra links', () => {
const component = renderWithRouter(
-
+
-
+
);
expect(component).toMatchSnapshot('page_header_with_extra_links');
});
});
-
-const MockReduxProvider = ({ children }: { children: React.ReactElement }) => (
-
- {children}
-
-);