mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 17:59:23 -04:00
[Uptime] Refactor snapshots into RTL (#113727)
This commit is contained in:
Shahzad
GitHub
parent
1f60a1662f
commit
abffa79ba2
24 changed files with 186 additions and 4626 deletions
|
|
@ -1,202 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`FingerprintCol renders expected elements for valid props 1`] = `
|
||||
.c1 .euiButtonEmpty__content {
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
.c0 {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
<span>
|
||||
<span
|
||||
class="c0 eui-textNoWrap"
|
||||
data-test-subj="CA06F56B258B7A0D4F2B05470939478651151984"
|
||||
>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
class="euiButtonEmpty euiButtonEmpty--primary c1"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent euiButtonEmpty__content"
|
||||
>
|
||||
<span
|
||||
class="euiButtonEmpty__text"
|
||||
>
|
||||
SHA 1
|
||||
</span>
|
||||
</span>
|
||||
</button>
|
||||
</span>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Click to copy fingerprint value"
|
||||
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
|
||||
title="Click to copy fingerprint value"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="copy"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
</span>
|
||||
<span
|
||||
class="c0 eui-textNoWrap"
|
||||
data-test-subj="3111500C4A66012CDAE333EC3FCA1C9DDE45C954440E7EE413716BFF3663C074"
|
||||
>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
class="euiButtonEmpty euiButtonEmpty--primary c1"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent euiButtonEmpty__content"
|
||||
>
|
||||
<span
|
||||
class="euiButtonEmpty__text"
|
||||
>
|
||||
SHA 256
|
||||
</span>
|
||||
</span>
|
||||
</button>
|
||||
</span>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Click to copy fingerprint value"
|
||||
class="euiButtonIcon euiButtonIcon--primary euiButtonIcon--empty euiButtonIcon--xSmall"
|
||||
title="Click to copy fingerprint value"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiButtonIcon__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="copy"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
`;
|
||||
|
||||
exports[`FingerprintCol shallow renders expected elements for valid props 1`] = `
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"history": Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
},
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"match": Object {
|
||||
"isExact": true,
|
||||
"params": Object {},
|
||||
"path": "/",
|
||||
"url": "/",
|
||||
},
|
||||
"staticContext": undefined,
|
||||
}
|
||||
}
|
||||
>
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
}
|
||||
}
|
||||
>
|
||||
<FingerprintCol
|
||||
cert={
|
||||
Object {
|
||||
"common_name": "github.com",
|
||||
"issuer": "DigiCert SHA2 Extended Validation Server CA",
|
||||
"monitors": Array [
|
||||
Object {
|
||||
"id": "github",
|
||||
"name": "",
|
||||
"url": "https://github.com/",
|
||||
},
|
||||
],
|
||||
"not_after": "2020-05-08T00:00:00.000Z",
|
||||
"not_before": "2018-05-08T00:00:00.000Z",
|
||||
"sha1": "ca06f56b258b7a0d4f2b05470939478651151984",
|
||||
"sha256": "3111500c4a66012cdae333ec3fca1c9dde45c954440e7ee413716bff3663c074",
|
||||
}
|
||||
}
|
||||
/>
|
||||
</ContextProvider>
|
||||
</ContextProvider>
|
||||
`;
|
||||
|
|
@ -6,9 +6,9 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { renderWithRouter, shallowWithRouter } from '../../lib';
|
||||
import { FingerprintCol } from './fingerprint_col';
|
||||
import moment from 'moment';
|
||||
import { FingerprintCol } from './fingerprint_col';
|
||||
import { render } from '../../lib/helper/rtl_helpers';
|
||||
|
||||
describe('FingerprintCol', () => {
|
||||
const cert = {
|
||||
|
|
@ -16,18 +16,19 @@ describe('FingerprintCol', () => {
|
|||
not_after: '2020-05-08T00:00:00.000Z',
|
||||
not_before: '2018-05-08T00:00:00.000Z',
|
||||
issuer: 'DigiCert SHA2 Extended Validation Server CA',
|
||||
sha1: 'ca06f56b258b7a0d4f2b05470939478651151984',
|
||||
sha256: '3111500c4a66012cdae333ec3fca1c9dde45c954440e7ee413716bff3663c074',
|
||||
sha1: 'ca06f56b258b7a0d4f2b05470939478651151984'.toUpperCase(),
|
||||
sha256: '3111500c4a66012cdae333ec3fca1c9dde45c954440e7ee413716bff3663c074'.toUpperCase(),
|
||||
common_name: 'github.com',
|
||||
};
|
||||
|
||||
it('shallow renders expected elements for valid props', () => {
|
||||
expect(shallowWithRouter(<FingerprintCol cert={cert} />)).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders expected elements for valid props', () => {
|
||||
it('renders expected elements for valid props', async () => {
|
||||
cert.not_after = moment().add('4', 'months').toISOString();
|
||||
const { findByText, findByTestId } = render(<FingerprintCol cert={cert} />);
|
||||
|
||||
expect(renderWithRouter(<FingerprintCol cert={cert} />)).toMatchSnapshot();
|
||||
expect(await findByText('SHA 1')).toBeInTheDocument();
|
||||
expect(await findByText('SHA 256')).toBeInTheDocument();
|
||||
|
||||
expect(await findByTestId(cert.sha1)).toBeInTheDocument();
|
||||
expect(await findByTestId(cert.sha256)).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,184 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`UptimeDatePicker component renders properly with mock data 1`] = `
|
||||
<div
|
||||
class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow euiSuperDatePicker__flexWrapper"
|
||||
>
|
||||
<div
|
||||
class="euiFlexItem"
|
||||
>
|
||||
<div
|
||||
class="euiFormControlLayout euiFormControlLayout--group euiSuperDatePicker"
|
||||
>
|
||||
<div
|
||||
class="euiPopover euiPopover--anchorDownLeft"
|
||||
>
|
||||
<div
|
||||
class="euiPopover__anchor euiQuickSelectPopover__anchor"
|
||||
>
|
||||
<button
|
||||
aria-label="Date quick select"
|
||||
class="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--xSmall euiFormControlLayout__prepend"
|
||||
data-test-subj="superDatePickerToggleQuickMenuButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent euiButtonContent--iconRight euiButtonEmpty__content"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="arrowDown"
|
||||
/>
|
||||
<span
|
||||
class="euiButtonEmpty__text euiQuickSelectPopover__buttonText"
|
||||
>
|
||||
<span
|
||||
data-euiicon-type="clock"
|
||||
/>
|
||||
</span>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="euiFormControlLayout__childrenWrapper"
|
||||
>
|
||||
<div
|
||||
class="euiDatePickerRange euiDatePickerRange--inGroup"
|
||||
>
|
||||
<button
|
||||
class="euiSuperDatePicker__prettyFormat"
|
||||
data-test-subj="superDatePickerShowDatesButton"
|
||||
>
|
||||
Last 15 minutes
|
||||
<span
|
||||
class="euiSuperDatePicker__prettyFormatLink"
|
||||
>
|
||||
Show dates
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="euiFlexItem euiFlexItem--flexGrowZero"
|
||||
>
|
||||
<span
|
||||
class="euiToolTipAnchor"
|
||||
>
|
||||
<button
|
||||
class="euiButton euiButton--primary euiButton--fill euiSuperUpdateButton"
|
||||
data-test-subj="superDatePickerApplyTimeButton"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent euiButton__content"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="refresh"
|
||||
/>
|
||||
<span
|
||||
class="euiButton__text euiSuperUpdateButton__text"
|
||||
>
|
||||
Refresh
|
||||
</span>
|
||||
</span>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`UptimeDatePicker component validates props with shallow render 1`] = `
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"history": Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
},
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"match": Object {
|
||||
"isExact": true,
|
||||
"params": Object {},
|
||||
"path": "/",
|
||||
"url": "/",
|
||||
},
|
||||
"staticContext": undefined,
|
||||
}
|
||||
}
|
||||
>
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
}
|
||||
}
|
||||
>
|
||||
<UptimeDatePicker />
|
||||
</ContextProvider>
|
||||
</ContextProvider>
|
||||
`;
|
||||
|
|
@ -7,52 +7,33 @@
|
|||
|
||||
import React from 'react';
|
||||
import { UptimeDatePicker } from './uptime_date_picker';
|
||||
import {
|
||||
renderWithRouter,
|
||||
shallowWithRouter,
|
||||
MountWithReduxProvider,
|
||||
mountWithRouterRedux,
|
||||
} from '../../lib';
|
||||
import { UptimeStartupPluginsContextProvider } from '../../contexts';
|
||||
import { startPlugins } from '../../lib/__mocks__/uptime_plugin_start_mock';
|
||||
import { ClientPluginsStart } from '../../apps/plugin';
|
||||
import { createMemoryHistory } from 'history';
|
||||
import { render } from '../../lib/helper/rtl_helpers';
|
||||
import { fireEvent } from '@testing-library/dom';
|
||||
|
||||
describe('UptimeDatePicker component', () => {
|
||||
it('validates props with shallow render', () => {
|
||||
const component = shallowWithRouter(<UptimeDatePicker />);
|
||||
expect(component).toMatchSnapshot();
|
||||
it('renders properly with mock data', async () => {
|
||||
const { findByText } = render(<UptimeDatePicker />);
|
||||
expect(await findByText('Last 15 minutes')).toBeInTheDocument();
|
||||
expect(await findByText('Refresh')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders properly with mock data', () => {
|
||||
const component = renderWithRouter(
|
||||
<MountWithReduxProvider>
|
||||
<UptimeDatePicker />
|
||||
</MountWithReduxProvider>
|
||||
);
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
it('uses shared date range state when there is no url date range state', async () => {
|
||||
const customHistory = createMemoryHistory({
|
||||
initialEntries: ['/?dateRangeStart=now-15m&dateRangeEnd=now'],
|
||||
});
|
||||
|
||||
it('uses shared date range state when there is no url date range state', () => {
|
||||
const customHistory = createMemoryHistory();
|
||||
jest.spyOn(customHistory, 'push');
|
||||
|
||||
const component = mountWithRouterRedux(
|
||||
<UptimeStartupPluginsContextProvider
|
||||
{...(startPlugins as unknown as Partial<ClientPluginsStart>)}
|
||||
>
|
||||
<UptimeDatePicker />
|
||||
</UptimeStartupPluginsContextProvider>,
|
||||
{ customHistory }
|
||||
);
|
||||
const { findByText } = render(<UptimeDatePicker />, {
|
||||
history: customHistory,
|
||||
core: startPlugins,
|
||||
});
|
||||
|
||||
const startBtn = component.find('[data-test-subj="superDatePickerstartDatePopoverButton"]');
|
||||
expect(await findByText('~ 15 minutes ago')).toBeInTheDocument();
|
||||
|
||||
expect(startBtn.text()).toBe('~ 30 minutes ago');
|
||||
|
||||
const endBtn = component.find('[data-test-subj="superDatePickerendDatePopoverButton"]');
|
||||
|
||||
expect(endBtn.text()).toBe('~ 15 minutes ago');
|
||||
expect(await findByText('~ 30 minutes ago')).toBeInTheDocument();
|
||||
|
||||
expect(customHistory.push).toHaveBeenCalledWith({
|
||||
pathname: '/',
|
||||
|
|
@ -60,25 +41,19 @@ describe('UptimeDatePicker component', () => {
|
|||
});
|
||||
});
|
||||
|
||||
it('should use url date range even if shared date range is present', () => {
|
||||
it('should use url date range even if shared date range is present', async () => {
|
||||
const customHistory = createMemoryHistory({
|
||||
initialEntries: ['/?g=%22%22&dateRangeStart=now-10m&dateRangeEnd=now'],
|
||||
});
|
||||
|
||||
jest.spyOn(customHistory, 'push');
|
||||
|
||||
const component = mountWithRouterRedux(
|
||||
<UptimeStartupPluginsContextProvider
|
||||
{...(startPlugins as unknown as Partial<ClientPluginsStart>)}
|
||||
>
|
||||
<UptimeDatePicker />
|
||||
</UptimeStartupPluginsContextProvider>,
|
||||
{ customHistory }
|
||||
);
|
||||
const { findByText } = render(<UptimeDatePicker />, {
|
||||
history: customHistory,
|
||||
core: startPlugins,
|
||||
});
|
||||
|
||||
const showDateBtn = component.find('[data-test-subj="superDatePickerShowDatesButton"]');
|
||||
|
||||
expect(showDateBtn.childAt(0).text()).toBe('Last 10 minutes');
|
||||
expect(await findByText('Last 10 minutes')).toBeInTheDocument();
|
||||
|
||||
// it should update shared state
|
||||
|
||||
|
|
@ -87,4 +62,39 @@ describe('UptimeDatePicker component', () => {
|
|||
to: 'now',
|
||||
});
|
||||
});
|
||||
|
||||
it('should handle on change', async () => {
|
||||
const customHistory = createMemoryHistory({
|
||||
initialEntries: ['/?g=%22%22&dateRangeStart=now-10m&dateRangeEnd=now'],
|
||||
});
|
||||
|
||||
jest.spyOn(customHistory, 'push');
|
||||
|
||||
const { findByText, getByTestId, findByTestId } = render(<UptimeDatePicker />, {
|
||||
history: customHistory,
|
||||
core: startPlugins,
|
||||
});
|
||||
|
||||
expect(await findByText('Last 10 minutes')).toBeInTheDocument();
|
||||
|
||||
fireEvent.click(getByTestId('superDatePickerToggleQuickMenuButton'));
|
||||
|
||||
fireEvent.click(await findByTestId('superDatePickerCommonlyUsed_Today'));
|
||||
|
||||
expect(await findByText('Today')).toBeInTheDocument();
|
||||
|
||||
// it should update shared state
|
||||
|
||||
expect(startPlugins.data.query.timefilter.timefilter.setTime).toHaveBeenCalledTimes(3);
|
||||
|
||||
expect(startPlugins.data.query.timefilter.timefilter.setTime).toHaveBeenCalledWith({
|
||||
from: 'now-10m',
|
||||
to: 'now',
|
||||
});
|
||||
|
||||
expect(startPlugins.data.query.timefilter.timefilter.setTime).toHaveBeenLastCalledWith({
|
||||
from: 'now/d',
|
||||
to: 'now',
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,78 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`ShowLicenseInfo renders without errors 1`] = `
|
||||
Array [
|
||||
<div
|
||||
class="euiCallOut euiCallOut--primary license-info-trial"
|
||||
data-test-subj="uptimeMLLicenseInfo"
|
||||
>
|
||||
<div
|
||||
class="euiCallOutHeader"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiCallOutHeader__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="help"
|
||||
/>
|
||||
<span
|
||||
class="euiCallOutHeader__title"
|
||||
>
|
||||
Start free 14-day trial
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="euiText euiText--small"
|
||||
>
|
||||
<div
|
||||
class="euiTextColor euiTextColor--default"
|
||||
>
|
||||
<p>
|
||||
In order to access duration anomaly detection, you have to be subscribed to an Elastic Platinum license.
|
||||
</p>
|
||||
<a
|
||||
class="euiButton euiButton--primary"
|
||||
href="/app/management/stack/license_management/home"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent euiButton__content"
|
||||
>
|
||||
<span
|
||||
class="euiButton__text"
|
||||
>
|
||||
Start free 14-day trial
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>,
|
||||
<div
|
||||
class="euiSpacer euiSpacer--l"
|
||||
/>,
|
||||
]
|
||||
`;
|
||||
|
||||
exports[`ShowLicenseInfo shallow renders without errors 1`] = `
|
||||
<Fragment>
|
||||
<EuiCallOut
|
||||
className="license-info-trial"
|
||||
color="primary"
|
||||
data-test-subj="uptimeMLLicenseInfo"
|
||||
iconType="help"
|
||||
title="Start free 14-day trial"
|
||||
>
|
||||
<p>
|
||||
In order to access duration anomaly detection, you have to be subscribed to an Elastic Platinum license.
|
||||
</p>
|
||||
<EuiButton
|
||||
color="primary"
|
||||
href="/app/management/stack/license_management/home"
|
||||
>
|
||||
Start free 14-day trial
|
||||
</EuiButton>
|
||||
</EuiCallOut>
|
||||
<EuiSpacer />
|
||||
</Fragment>
|
||||
`;
|
||||
|
|
@ -1,242 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`ML Flyout component renders without errors 1`] = `
|
||||
<EuiFlyout
|
||||
data-test-subj="uptimeMLFlyout"
|
||||
onClose={[Function]}
|
||||
size="s"
|
||||
>
|
||||
<EuiFlyoutHeader>
|
||||
<EuiTitle>
|
||||
<h2>
|
||||
Enable anomaly detection
|
||||
</h2>
|
||||
</EuiTitle>
|
||||
<EuiSpacer
|
||||
size="s"
|
||||
/>
|
||||
</EuiFlyoutHeader>
|
||||
<EuiFlyoutBody>
|
||||
<EuiText>
|
||||
<p>
|
||||
Here you can create a machine learning job to calculate anomaly scores on
|
||||
response durations for Uptime Monitor. Once enabled, the monitor duration chart on the details page
|
||||
will show the expected bounds and annotate the graph with anomalies. You can also potentially
|
||||
identify periods of increased latency across geographical regions.
|
||||
</p>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
defaultMessage="Once a job is created, you can manage it and see more details in the {mlJobsPageLink}."
|
||||
id="xpack.uptime.ml.enableAnomalyDetectionPanel.manageMLJobDescription"
|
||||
values={
|
||||
Object {
|
||||
"mlJobsPageLink": <EuiLink
|
||||
href="/app/ml"
|
||||
>
|
||||
Machine Learning jobs management page
|
||||
</EuiLink>,
|
||||
}
|
||||
}
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<em>
|
||||
Note: It might take a few minutes for the job to begin calculating results.
|
||||
</em>
|
||||
</p>
|
||||
</EuiText>
|
||||
<EuiSpacer />
|
||||
</EuiFlyoutBody>
|
||||
<EuiFlyoutFooter>
|
||||
<EuiFlexGroup
|
||||
justifyContent="spaceBetween"
|
||||
>
|
||||
<EuiFlexItem
|
||||
grow={false}
|
||||
>
|
||||
<EuiButtonEmpty
|
||||
disabled={false}
|
||||
onClick={[Function]}
|
||||
>
|
||||
Cancel
|
||||
</EuiButtonEmpty>
|
||||
</EuiFlexItem>
|
||||
<EuiFlexItem
|
||||
grow={false}
|
||||
>
|
||||
<EuiButton
|
||||
data-test-subj="uptimeMLCreateJobBtn"
|
||||
disabled={false}
|
||||
fill={true}
|
||||
isLoading={false}
|
||||
onClick={[Function]}
|
||||
>
|
||||
Create new job
|
||||
</EuiButton>
|
||||
</EuiFlexItem>
|
||||
</EuiFlexGroup>
|
||||
</EuiFlyoutFooter>
|
||||
</EuiFlyout>
|
||||
`;
|
||||
|
||||
exports[`ML Flyout component shows license info if no ml available 1`] = `
|
||||
<div
|
||||
data-eui="EuiFlyout"
|
||||
data-test-subj="uptimeMLFlyout"
|
||||
role="dialog"
|
||||
>
|
||||
<button
|
||||
data-test-subj="euiFlyoutCloseButton"
|
||||
type="button"
|
||||
/>
|
||||
<div
|
||||
class="euiFlyoutHeader"
|
||||
>
|
||||
<h2
|
||||
class="euiTitle euiTitle--medium"
|
||||
>
|
||||
Enable anomaly detection
|
||||
</h2>
|
||||
<div
|
||||
class="euiSpacer euiSpacer--s"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="euiFlyoutBody"
|
||||
>
|
||||
<div
|
||||
class="euiFlyoutBody__overflow"
|
||||
tabindex="0"
|
||||
>
|
||||
<div
|
||||
class="euiFlyoutBody__overflowContent"
|
||||
>
|
||||
<div
|
||||
class="euiCallOut euiCallOut--primary license-info-trial"
|
||||
data-test-subj="uptimeMLLicenseInfo"
|
||||
>
|
||||
<div
|
||||
class="euiCallOutHeader"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="euiCallOutHeader__icon"
|
||||
color="inherit"
|
||||
data-euiicon-type="help"
|
||||
/>
|
||||
<span
|
||||
class="euiCallOutHeader__title"
|
||||
>
|
||||
Start free 14-day trial
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="euiText euiText--small"
|
||||
>
|
||||
<div
|
||||
class="euiTextColor euiTextColor--default"
|
||||
>
|
||||
<p>
|
||||
In order to access duration anomaly detection, you have to be subscribed to an Elastic Platinum license.
|
||||
</p>
|
||||
<a
|
||||
class="euiButton euiButton--primary"
|
||||
href="/app/management/stack/license_management/home"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent euiButton__content"
|
||||
>
|
||||
<span
|
||||
class="euiButton__text"
|
||||
>
|
||||
Start free 14-day trial
|
||||
</span>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="euiSpacer euiSpacer--l"
|
||||
/>
|
||||
<div
|
||||
class="euiText euiText--medium"
|
||||
>
|
||||
<p>
|
||||
Here you can create a machine learning job to calculate anomaly scores on
|
||||
response durations for Uptime Monitor. Once enabled, the monitor duration chart on the details page
|
||||
will show the expected bounds and annotate the graph with anomalies. You can also potentially
|
||||
identify periods of increased latency across geographical regions.
|
||||
</p>
|
||||
<p>
|
||||
Once a job is created, you can manage it and see more details in the
|
||||
<a
|
||||
class="euiLink euiLink--primary"
|
||||
href="/app/ml"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Machine Learning jobs management page
|
||||
</a>
|
||||
.
|
||||
</p>
|
||||
<p>
|
||||
<em>
|
||||
Note: It might take a few minutes for the job to begin calculating results.
|
||||
</em>
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
class="euiSpacer euiSpacer--l"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="euiFlyoutFooter"
|
||||
>
|
||||
<div
|
||||
class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow euiFlexGroup--responsive"
|
||||
>
|
||||
<div
|
||||
class="euiFlexItem euiFlexItem--flexGrowZero"
|
||||
>
|
||||
<button
|
||||
class="euiButtonEmpty euiButtonEmpty--primary"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent euiButtonEmpty__content"
|
||||
>
|
||||
<span
|
||||
class="euiButtonEmpty__text"
|
||||
>
|
||||
Cancel
|
||||
</span>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="euiFlexItem euiFlexItem--flexGrowZero"
|
||||
>
|
||||
<button
|
||||
class="euiButton euiButton--primary euiButton--fill euiButton-isDisabled"
|
||||
data-test-subj="uptimeMLCreateJobBtn"
|
||||
disabled=""
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="euiButtonContent euiButton__content"
|
||||
>
|
||||
<span
|
||||
class="euiButton__text"
|
||||
>
|
||||
Create new job
|
||||
</span>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
|
@ -6,9 +6,9 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { renderWithIntl, shallowWithIntl } from '@kbn/test/jest';
|
||||
import { ShowLicenseInfo } from './license_info';
|
||||
import * as redux from 'react-redux';
|
||||
import { render } from '../../../lib/helper/rtl_helpers';
|
||||
|
||||
describe('ShowLicenseInfo', () => {
|
||||
beforeEach(() => {
|
||||
|
|
@ -18,13 +18,9 @@ describe('ShowLicenseInfo', () => {
|
|||
const spy1 = jest.spyOn(redux, 'useSelector');
|
||||
spy1.mockReturnValue(true);
|
||||
});
|
||||
it('shallow renders without errors', () => {
|
||||
const wrapper = shallowWithIntl(<ShowLicenseInfo />);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders without errors', () => {
|
||||
const wrapper = renderWithIntl(<ShowLicenseInfo />);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
it('renders without errors', async () => {
|
||||
const { findAllByText } = render(<ShowLicenseInfo />);
|
||||
expect((await findAllByText('Start free 14-day trial'))[0]).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -6,11 +6,12 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { renderWithIntl, shallowWithIntl } from '@kbn/test/jest';
|
||||
import { MLFlyoutView } from './ml_flyout';
|
||||
import { UptimeSettingsContext } from '../../../contexts';
|
||||
import { CLIENT_DEFAULTS } from '../../../../common/constants';
|
||||
import * as redux from 'react-redux';
|
||||
import { render } from '../../../lib/helper/rtl_helpers';
|
||||
import * as labels from './translations';
|
||||
|
||||
describe('ML Flyout component', () => {
|
||||
const createJob = () => {};
|
||||
|
|
@ -25,18 +26,7 @@ describe('ML Flyout component', () => {
|
|||
spy1.mockReturnValue(true);
|
||||
});
|
||||
|
||||
it('renders without errors', () => {
|
||||
const wrapper = shallowWithIntl(
|
||||
<MLFlyoutView
|
||||
isCreatingJob={false}
|
||||
onClickCreate={createJob}
|
||||
onClose={onClose}
|
||||
canCreateMLJob={true}
|
||||
/>
|
||||
);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
it('shows license info if no ml available', () => {
|
||||
it('shows license info if no ml available', async () => {
|
||||
const spy1 = jest.spyOn(redux, 'useSelector');
|
||||
|
||||
// return false value for no license
|
||||
|
|
@ -50,7 +40,7 @@ describe('ML Flyout component', () => {
|
|||
isInfraAvailable: true,
|
||||
isLogsAvailable: true,
|
||||
};
|
||||
const wrapper = renderWithIntl(
|
||||
const { findByText, findAllByText } = render(
|
||||
<UptimeSettingsContext.Provider value={value}>
|
||||
<MLFlyoutView
|
||||
isCreatingJob={false}
|
||||
|
|
@ -60,12 +50,12 @@ describe('ML Flyout component', () => {
|
|||
/>
|
||||
</UptimeSettingsContext.Provider>
|
||||
);
|
||||
const licenseComponent = wrapper.find('.license-info-trial');
|
||||
expect(licenseComponent.length).toBe(1);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
|
||||
expect(await findByText(labels.ENABLE_ANOMALY_DETECTION)).toBeInTheDocument();
|
||||
expect(await findAllByText(labels.START_TRAIL)).toHaveLength(2);
|
||||
});
|
||||
|
||||
it('able to create job if valid license is available', () => {
|
||||
it('able to create job if valid license is available', async () => {
|
||||
const value = {
|
||||
basePath: '',
|
||||
dateRangeStart: DATE_RANGE_START,
|
||||
|
|
@ -74,7 +64,7 @@ describe('ML Flyout component', () => {
|
|||
isInfraAvailable: true,
|
||||
isLogsAvailable: true,
|
||||
};
|
||||
const wrapper = renderWithIntl(
|
||||
const { queryByText } = render(
|
||||
<UptimeSettingsContext.Provider value={value}>
|
||||
<MLFlyoutView
|
||||
isCreatingJob={false}
|
||||
|
|
@ -85,7 +75,6 @@ describe('ML Flyout component', () => {
|
|||
</UptimeSettingsContext.Provider>
|
||||
);
|
||||
|
||||
const licenseComponent = wrapper.find('.license-info-trial');
|
||||
expect(licenseComponent.length).toBe(0);
|
||||
expect(queryByText(labels.START_TRAIL)).not.toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,368 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`AvailabilityReporting component renders correctly against snapshot 1`] = `
|
||||
Array [
|
||||
@media (max-width:1042px) {
|
||||
|
||||
}
|
||||
|
||||
<div
|
||||
class="euiSpacer euiSpacer--s"
|
||||
/>,
|
||||
.c0 {
|
||||
white-space: nowrap;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@media (max-width:1042px) {
|
||||
.c0 {
|
||||
display: inline-block;
|
||||
margin-right: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
<div
|
||||
class="euiBasicTable"
|
||||
>
|
||||
<div>
|
||||
<table
|
||||
class="euiTable euiTable--compressed"
|
||||
id="generated-id"
|
||||
tabindex="-1"
|
||||
>
|
||||
<caption
|
||||
class="euiScreenReaderOnly euiTableCaption"
|
||||
/>
|
||||
<thead>
|
||||
<tr>
|
||||
<th
|
||||
class="euiTableHeaderCell"
|
||||
data-test-subj="tableHeaderCell_label_0"
|
||||
role="columnheader"
|
||||
scope="col"
|
||||
>
|
||||
<span
|
||||
class="euiTableCellContent"
|
||||
>
|
||||
<span
|
||||
class="euiTableCellContent__text"
|
||||
>
|
||||
Location
|
||||
</span>
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class="euiTableHeaderCell"
|
||||
data-test-subj="tableHeaderCell_availability_1"
|
||||
role="columnheader"
|
||||
scope="col"
|
||||
>
|
||||
<span
|
||||
class="euiTableCellContent euiTableCellContent--alignRight"
|
||||
>
|
||||
<span
|
||||
class="euiTableCellContent__text"
|
||||
>
|
||||
Availability
|
||||
</span>
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class="euiTableHeaderCell"
|
||||
data-test-subj="tableHeaderCell_timestamp_2"
|
||||
role="columnheader"
|
||||
scope="col"
|
||||
>
|
||||
<span
|
||||
class="euiTableCellContent euiTableCellContent--alignRight"
|
||||
>
|
||||
<span
|
||||
class="euiTableCellContent__text"
|
||||
>
|
||||
Last check
|
||||
</span>
|
||||
</span>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr
|
||||
class="euiTableRow"
|
||||
>
|
||||
<td
|
||||
class="euiTableRowCell"
|
||||
>
|
||||
<div
|
||||
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
|
||||
>
|
||||
Location
|
||||
</div>
|
||||
<div
|
||||
class="euiTableCellContent euiTableCellContent--truncateText euiTableCellContent--overflowingContent"
|
||||
>
|
||||
<div
|
||||
class="c0"
|
||||
>
|
||||
<span
|
||||
class="euiBadge euiBadge--iconLeft"
|
||||
style="background-color:#6dccb1;color:#000"
|
||||
>
|
||||
<span
|
||||
class="euiBadge__content"
|
||||
>
|
||||
<span
|
||||
class="euiBadge__text"
|
||||
>
|
||||
au-heartbeat
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="euiTableRowCell"
|
||||
>
|
||||
<div
|
||||
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
|
||||
>
|
||||
Availability
|
||||
</div>
|
||||
<div
|
||||
class="euiTableCellContent euiTableCellContent--alignRight euiTableCellContent--overflowingContent"
|
||||
>
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
100.00 %
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="euiTableRowCell"
|
||||
>
|
||||
<div
|
||||
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
|
||||
>
|
||||
Last check
|
||||
</div>
|
||||
<div
|
||||
class="euiTableCellContent euiTableCellContent--alignRight"
|
||||
>
|
||||
<span
|
||||
class="euiTableCellContent__text"
|
||||
>
|
||||
36m ago
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr
|
||||
class="euiTableRow"
|
||||
>
|
||||
<td
|
||||
class="euiTableRowCell"
|
||||
>
|
||||
<div
|
||||
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
|
||||
>
|
||||
Location
|
||||
</div>
|
||||
<div
|
||||
class="euiTableCellContent euiTableCellContent--truncateText euiTableCellContent--overflowingContent"
|
||||
>
|
||||
<div
|
||||
class="c0"
|
||||
>
|
||||
<span
|
||||
class="euiBadge euiBadge--iconLeft"
|
||||
style="background-color:#ff7e62;color:#000"
|
||||
>
|
||||
<span
|
||||
class="euiBadge__content"
|
||||
>
|
||||
<span
|
||||
class="euiBadge__text"
|
||||
>
|
||||
nyc-heartbeat
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="euiTableRowCell"
|
||||
>
|
||||
<div
|
||||
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
|
||||
>
|
||||
Availability
|
||||
</div>
|
||||
<div
|
||||
class="euiTableCellContent euiTableCellContent--alignRight euiTableCellContent--overflowingContent"
|
||||
>
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
100.00 %
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="euiTableRowCell"
|
||||
>
|
||||
<div
|
||||
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
|
||||
>
|
||||
Last check
|
||||
</div>
|
||||
<div
|
||||
class="euiTableCellContent euiTableCellContent--alignRight"
|
||||
>
|
||||
<span
|
||||
class="euiTableCellContent__text"
|
||||
>
|
||||
36m ago
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr
|
||||
class="euiTableRow"
|
||||
>
|
||||
<td
|
||||
class="euiTableRowCell"
|
||||
>
|
||||
<div
|
||||
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
|
||||
>
|
||||
Location
|
||||
</div>
|
||||
<div
|
||||
class="euiTableCellContent euiTableCellContent--truncateText euiTableCellContent--overflowingContent"
|
||||
>
|
||||
<div
|
||||
class="c0"
|
||||
>
|
||||
<span
|
||||
class="euiBadge euiBadge--iconLeft"
|
||||
style="background-color:#ff7e62;color:#000"
|
||||
>
|
||||
<span
|
||||
class="euiBadge__content"
|
||||
>
|
||||
<span
|
||||
class="euiBadge__text"
|
||||
>
|
||||
spa-heartbeat
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="euiTableRowCell"
|
||||
>
|
||||
<div
|
||||
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
|
||||
>
|
||||
Availability
|
||||
</div>
|
||||
<div
|
||||
class="euiTableCellContent euiTableCellContent--alignRight euiTableCellContent--overflowingContent"
|
||||
>
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
100.00 %
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
<td
|
||||
class="euiTableRowCell"
|
||||
>
|
||||
<div
|
||||
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
|
||||
>
|
||||
Last check
|
||||
</div>
|
||||
<div
|
||||
class="euiTableCellContent euiTableCellContent--alignRight"
|
||||
>
|
||||
<span
|
||||
class="euiTableCellContent__text"
|
||||
>
|
||||
36m ago
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>,
|
||||
]
|
||||
`;
|
||||
|
||||
exports[`AvailabilityReporting component shallow renders correctly against snapshot 1`] = `
|
||||
<Fragment>
|
||||
<EuiSpacer
|
||||
size="s"
|
||||
/>
|
||||
<EuiBasicTable
|
||||
columns={
|
||||
Array [
|
||||
Object {
|
||||
"field": "label",
|
||||
"name": "Location",
|
||||
"render": [Function],
|
||||
"truncateText": true,
|
||||
},
|
||||
Object {
|
||||
"align": "right",
|
||||
"field": "availability",
|
||||
"name": "Availability",
|
||||
"render": [Function],
|
||||
},
|
||||
Object {
|
||||
"align": "right",
|
||||
"field": "timestamp",
|
||||
"name": "Last check",
|
||||
},
|
||||
]
|
||||
}
|
||||
compressed={true}
|
||||
items={
|
||||
Array [
|
||||
Object {
|
||||
"availability": 100,
|
||||
"color": "#d3dae6",
|
||||
"label": "au-heartbeat",
|
||||
"status": "up",
|
||||
"timestamp": "36m ago",
|
||||
},
|
||||
Object {
|
||||
"availability": 100,
|
||||
"color": "#d3dae6",
|
||||
"label": "nyc-heartbeat",
|
||||
"status": "down",
|
||||
"timestamp": "36m ago",
|
||||
},
|
||||
Object {
|
||||
"availability": 100,
|
||||
"color": "#d3dae6",
|
||||
"label": "spa-heartbeat",
|
||||
"status": "down",
|
||||
"timestamp": "36m ago",
|
||||
},
|
||||
]
|
||||
}
|
||||
noItemsMessage="No items found"
|
||||
onChange={[Function]}
|
||||
responsive={false}
|
||||
tableLayout="fixed"
|
||||
/>
|
||||
</Fragment>
|
||||
`;
|
||||
File diff suppressed because it is too large
Load diff
|
|
@ -6,15 +6,9 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { renderWithIntl, shallowWithIntl } from '@kbn/test/jest';
|
||||
import { AvailabilityReporting } from './availability_reporting';
|
||||
import { StatusTag } from './location_status_tags';
|
||||
|
||||
jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => {
|
||||
return {
|
||||
htmlIdGenerator: () => () => `generated-id`,
|
||||
};
|
||||
});
|
||||
import { render } from '../../../../lib/helper/rtl_helpers';
|
||||
|
||||
describe('AvailabilityReporting component', () => {
|
||||
let allLocations: StatusTag[];
|
||||
|
|
@ -45,13 +39,10 @@ describe('AvailabilityReporting component', () => {
|
|||
];
|
||||
});
|
||||
|
||||
it('shallow renders correctly against snapshot', () => {
|
||||
const component = shallowWithIntl(<AvailabilityReporting allLocations={allLocations} />);
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
it('renders correctly against snapshot', async () => {
|
||||
const { findByText } = render(<AvailabilityReporting allLocations={allLocations} />);
|
||||
|
||||
it('renders correctly against snapshot', () => {
|
||||
const component = renderWithIntl(<AvailabilityReporting allLocations={allLocations} />);
|
||||
expect(component).toMatchSnapshot();
|
||||
expect(await findByText('This table contains 3 rows.')).toBeInTheDocument();
|
||||
expect(await findByText('au-heartbeat')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -6,9 +6,8 @@
|
|||
*/
|
||||
|
||||
import React, { useState } from 'react';
|
||||
import { EuiBasicTable, EuiSpacer } from '@elastic/eui';
|
||||
import { EuiBasicTable, EuiSpacer, Criteria, Pagination } from '@elastic/eui';
|
||||
import { FormattedMessage } from '@kbn/i18n/react';
|
||||
import { Pagination } from '@elastic/eui/src/components/basic_table/pagination_bar';
|
||||
import { StatusTag } from './location_status_tags';
|
||||
import { TagLabel } from './tag_label';
|
||||
import { AvailabilityLabel, LastCheckLabel, LocationLabel } from '../translations';
|
||||
|
|
@ -66,8 +65,8 @@ export const AvailabilityReporting: React.FC<Props> = ({ allLocations }) => {
|
|||
hidePerPageOptions: true,
|
||||
};
|
||||
|
||||
const onTableChange = ({ page }: any) => {
|
||||
setPageIndex(page.index);
|
||||
const onTableChange = ({ page }: Criteria<StatusTag>) => {
|
||||
setPageIndex(page?.index ?? 0);
|
||||
};
|
||||
|
||||
const paginationProps = allLocations.length > pageSize ? { pagination } : {};
|
||||
|
|
|
|||
|
|
@ -6,10 +6,10 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { renderWithIntl, shallowWithIntl } from '@kbn/test/jest';
|
||||
import { MonitorLocation } from '../../../../../common/runtime_types/monitor';
|
||||
import { LocationStatusTags } from './index';
|
||||
import { mockMoment } from '../../../../lib/helper/test_helpers';
|
||||
import { render } from '../../../../lib/helper/rtl_helpers';
|
||||
|
||||
mockMoment();
|
||||
|
||||
|
|
@ -22,7 +22,7 @@ jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => {
|
|||
describe('LocationStatusTags component', () => {
|
||||
let monitorLocations: MonitorLocation[];
|
||||
|
||||
it('renders properly against props', () => {
|
||||
it('renders properly against props', async () => {
|
||||
monitorLocations = [
|
||||
{
|
||||
summary: { up: 4, down: 0 },
|
||||
|
|
@ -36,21 +36,21 @@ describe('LocationStatusTags component', () => {
|
|||
geo: { name: 'Berlin', location: { lat: '52.487448', lon: ' 13.394798' } },
|
||||
timestamp: 'Oct 26, 2020 7:49:20 AM',
|
||||
up_history: 4,
|
||||
down_history: 0,
|
||||
down_history: 2,
|
||||
},
|
||||
{
|
||||
summary: { up: 0, down: 2 },
|
||||
geo: { name: 'Berlin', location: { lat: '52.487448', lon: ' 13.394798' } },
|
||||
timestamp: 'Oct 26, 2020 7:49:20 AM',
|
||||
up_history: 4,
|
||||
down_history: 0,
|
||||
down_history: 1,
|
||||
},
|
||||
];
|
||||
const component = shallowWithIntl(<LocationStatusTags locations={monitorLocations} />);
|
||||
expect(component).toMatchSnapshot();
|
||||
const { findByText } = render(<LocationStatusTags locations={monitorLocations} />);
|
||||
expect(await findByText('100.00 %')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders when there are many location', () => {
|
||||
it('renders when there are many location', async () => {
|
||||
monitorLocations = [
|
||||
{
|
||||
summary: { up: 0, down: 1 },
|
||||
|
|
@ -64,28 +64,28 @@ describe('LocationStatusTags component', () => {
|
|||
geo: { name: 'Berlin', location: { lat: '52.487448', lon: ' 13.394798' } },
|
||||
timestamp: 'Oct 26, 2020 7:49:20 AM',
|
||||
up_history: 4,
|
||||
down_history: 0,
|
||||
down_history: 3,
|
||||
},
|
||||
{
|
||||
summary: { up: 0, down: 1 },
|
||||
geo: { name: 'st-paul', location: { lat: '52.487448', lon: ' 13.394798' } },
|
||||
timestamp: 'Oct 26, 2020 7:49:20 AM',
|
||||
up_history: 4,
|
||||
down_history: 0,
|
||||
down_history: 2,
|
||||
},
|
||||
{
|
||||
summary: { up: 0, down: 1 },
|
||||
geo: { name: 'Tokyo', location: { lat: '52.487448', lon: ' 13.394798' } },
|
||||
timestamp: 'Oct 26, 2020 7:49:20 AM',
|
||||
up_history: 4,
|
||||
down_history: 0,
|
||||
down_history: 1,
|
||||
},
|
||||
{
|
||||
summary: { up: 0, down: 1 },
|
||||
geo: { name: 'New York', location: { lat: '52.487448', lon: ' 13.394798' } },
|
||||
timestamp: 'Oct 26, 2020 7:49:20 AM',
|
||||
up_history: 4,
|
||||
down_history: 0,
|
||||
down_history: 4,
|
||||
},
|
||||
{
|
||||
summary: { up: 0, down: 1 },
|
||||
|
|
@ -109,11 +109,11 @@ describe('LocationStatusTags component', () => {
|
|||
down_history: 0,
|
||||
},
|
||||
];
|
||||
const component = renderWithIntl(<LocationStatusTags locations={monitorLocations} />);
|
||||
expect(component).toMatchSnapshot();
|
||||
const { findAllByText } = render(<LocationStatusTags locations={monitorLocations} />);
|
||||
expect(await findAllByText('100.00 %')).toHaveLength(3);
|
||||
});
|
||||
|
||||
it('renders when all locations are up', () => {
|
||||
it('renders when all locations are up', async () => {
|
||||
monitorLocations = [
|
||||
{
|
||||
summary: { up: 4, down: 0 },
|
||||
|
|
@ -130,28 +130,28 @@ describe('LocationStatusTags component', () => {
|
|||
down_history: 0,
|
||||
},
|
||||
];
|
||||
const component = renderWithIntl(<LocationStatusTags locations={monitorLocations} />);
|
||||
expect(component).toMatchSnapshot();
|
||||
const { findAllByText } = render(<LocationStatusTags locations={monitorLocations} />);
|
||||
expect(await findAllByText('100.00 %')).toHaveLength(2);
|
||||
});
|
||||
|
||||
it('renders when all locations are down', () => {
|
||||
it('renders when all locations are down', async () => {
|
||||
monitorLocations = [
|
||||
{
|
||||
summary: { up: 0, down: 2 },
|
||||
geo: { name: 'Islamabad', location: { lat: '52.487448', lon: ' 13.394798' } },
|
||||
timestamp: 'Oct 26, 2020 7:49:20 AM',
|
||||
up_history: 4,
|
||||
down_history: 0,
|
||||
up_history: 0,
|
||||
down_history: 2,
|
||||
},
|
||||
{
|
||||
summary: { up: 0, down: 2 },
|
||||
geo: { name: 'Berlin', location: { lat: '52.487448', lon: ' 13.394798' } },
|
||||
timestamp: 'Oct 26, 2020 7:49:20 AM',
|
||||
up_history: 4,
|
||||
down_history: 0,
|
||||
up_history: 0,
|
||||
down_history: 2,
|
||||
},
|
||||
];
|
||||
const component = renderWithIntl(<LocationStatusTags locations={monitorLocations} />);
|
||||
expect(component).toMatchSnapshot();
|
||||
const { findAllByText } = render(<LocationStatusTags locations={monitorLocations} />);
|
||||
expect(await findAllByText('0.00 %')).toHaveLength(2);
|
||||
});
|
||||
});
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load diff
|
|
@ -16,13 +16,12 @@ import {
|
|||
MonitorSummary,
|
||||
} from '../../../../common/runtime_types';
|
||||
import { MonitorListComponent, noItemsMessage } from './monitor_list';
|
||||
import { renderWithRouter, shallowWithRouter } from '../../../lib';
|
||||
import * as redux from 'react-redux';
|
||||
import moment from 'moment';
|
||||
import { IHttpFetchError } from '../../../../../../../src/core/public';
|
||||
import { mockMoment } from '../../../lib/helper/test_helpers';
|
||||
import { render } from '../../../lib/helper/rtl_helpers';
|
||||
import { EuiThemeProvider } from '../../../../../../../src/plugins/kibana_react/common';
|
||||
import { NO_DATA_MESSAGE } from './translations';
|
||||
|
||||
jest.mock('@elastic/eui/lib/services/accessibility/html_id_generator', () => {
|
||||
return {
|
||||
|
|
@ -150,20 +149,8 @@ describe('MonitorList component', () => {
|
|||
global.localStorage = localStorageMock;
|
||||
});
|
||||
|
||||
it('shallow renders the monitor list', () => {
|
||||
const component = shallowWithRouter(
|
||||
<MonitorListComponent
|
||||
monitorList={{ list: getMonitorList(), loading: false }}
|
||||
pageSize={10}
|
||||
setPageSize={jest.fn()}
|
||||
/>
|
||||
);
|
||||
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders a no items message when no data is provided', () => {
|
||||
const component = shallowWithRouter(
|
||||
it('renders a no items message when no data is provided', async () => {
|
||||
const { findByText } = render(
|
||||
<MonitorListComponent
|
||||
monitorList={{
|
||||
list: {
|
||||
|
|
@ -171,34 +158,36 @@ describe('MonitorList component', () => {
|
|||
nextPagePagination: null,
|
||||
prevPagePagination: null,
|
||||
},
|
||||
loading: true,
|
||||
loading: false,
|
||||
}}
|
||||
pageSize={10}
|
||||
setPageSize={jest.fn()}
|
||||
/>
|
||||
);
|
||||
expect(component).toMatchSnapshot();
|
||||
expect(await findByText(NO_DATA_MESSAGE)).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders the monitor list', () => {
|
||||
const component = renderWithRouter(
|
||||
<EuiThemeProvider darkMode={false}>
|
||||
<MonitorListComponent
|
||||
monitorList={{
|
||||
list: getMonitorList(moment().subtract(5, 'minute').toISOString()),
|
||||
loading: false,
|
||||
}}
|
||||
pageSize={10}
|
||||
setPageSize={jest.fn()}
|
||||
/>
|
||||
</EuiThemeProvider>
|
||||
it('renders the monitor list', async () => {
|
||||
const { findByLabelText } = render(
|
||||
<MonitorListComponent
|
||||
monitorList={{
|
||||
list: getMonitorList(moment().subtract(5, 'minute').toISOString()),
|
||||
loading: false,
|
||||
}}
|
||||
pageSize={10}
|
||||
setPageSize={jest.fn()}
|
||||
/>
|
||||
);
|
||||
|
||||
expect(component).toMatchSnapshot();
|
||||
expect(
|
||||
await findByLabelText(
|
||||
'Monitor Status table with columns for Status, Name, URL, IP, Downtime History and Integrations. The table is currently displaying 2 items.'
|
||||
)
|
||||
).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders error list', () => {
|
||||
const component = shallowWithRouter(
|
||||
it('renders error list', async () => {
|
||||
const { findByText } = render(
|
||||
<MonitorListComponent
|
||||
monitorList={{
|
||||
list: getMonitorList(),
|
||||
|
|
@ -210,19 +199,7 @@ describe('MonitorList component', () => {
|
|||
/>
|
||||
);
|
||||
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders loading state', () => {
|
||||
const component = shallowWithRouter(
|
||||
<MonitorListComponent
|
||||
monitorList={{ list: getMonitorList(), loading: true }}
|
||||
pageSize={10}
|
||||
setPageSize={jest.fn()}
|
||||
/>
|
||||
);
|
||||
|
||||
expect(component).toMatchSnapshot();
|
||||
expect(await findByText('foo message')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
describe('MonitorListPagination component', () => {
|
||||
|
|
@ -244,8 +221,8 @@ describe('MonitorList component', () => {
|
|||
};
|
||||
});
|
||||
|
||||
it('renders the pagination', () => {
|
||||
const component = shallowWithRouter(
|
||||
it('renders the pagination', async () => {
|
||||
const { findByText, findByLabelText } = render(
|
||||
<MonitorListComponent
|
||||
monitorList={{
|
||||
list: {
|
||||
|
|
@ -258,26 +235,9 @@ describe('MonitorList component', () => {
|
|||
/>
|
||||
);
|
||||
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders a no items message when no data is provided', () => {
|
||||
const component = shallowWithRouter(
|
||||
<MonitorListComponent
|
||||
monitorList={{
|
||||
list: {
|
||||
summaries: [],
|
||||
nextPagePagination: null,
|
||||
prevPagePagination: null,
|
||||
},
|
||||
loading: false,
|
||||
}}
|
||||
pageSize={10}
|
||||
setPageSize={jest.fn()}
|
||||
/>
|
||||
);
|
||||
|
||||
expect(component).toMatchSnapshot();
|
||||
expect(await findByText('Rows per page: 10')).toBeInTheDocument();
|
||||
expect(await findByLabelText('Prev page of results')).toBeInTheDocument();
|
||||
expect(await findByLabelText('Next page of results')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -29,6 +29,7 @@ import { stringifyUrlParams } from './stringify_url_params';
|
|||
import { ClientPluginsStart } from '../../apps/plugin';
|
||||
import { triggersActionsUiMock } from '../../../../triggers_actions_ui/public/mocks';
|
||||
import { dataPluginMock } from '../../../../../../src/plugins/data/public/mocks';
|
||||
import { UptimeRefreshContextProvider, UptimeStartupPluginsContextProvider } from '../../contexts';
|
||||
|
||||
interface KibanaProps {
|
||||
services?: KibanaServices;
|
||||
|
|
@ -129,9 +130,13 @@ export function MockKibanaProvider<ExtraCore>({
|
|||
};
|
||||
return (
|
||||
<KibanaContextProvider services={{ ...coreOptions }} {...kibanaProps}>
|
||||
<EuiThemeProvider darkMode={false}>
|
||||
<I18nProvider>{children}</I18nProvider>
|
||||
</EuiThemeProvider>
|
||||
<UptimeRefreshContextProvider>
|
||||
<UptimeStartupPluginsContextProvider data={(coreOptions as any).data}>
|
||||
<EuiThemeProvider darkMode={false}>
|
||||
<I18nProvider>{children}</I18nProvider>
|
||||
</EuiThemeProvider>
|
||||
</UptimeStartupPluginsContextProvider>
|
||||
</UptimeRefreshContextProvider>
|
||||
</KibanaContextProvider>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,91 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`CertificatesPage shallow renders expected elements for valid props 1`] = `
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"history": Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
},
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"match": Object {
|
||||
"isExact": true,
|
||||
"params": Object {},
|
||||
"path": "/",
|
||||
"url": "/",
|
||||
},
|
||||
"staticContext": undefined,
|
||||
}
|
||||
}
|
||||
>
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
}
|
||||
}
|
||||
>
|
||||
<CertificatesPage />
|
||||
</ContextProvider>
|
||||
</ContextProvider>
|
||||
`;
|
||||
|
|
@ -1,91 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`MonitorPage shallow renders expected elements for valid props 1`] = `
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"history": Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
},
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"match": Object {
|
||||
"isExact": true,
|
||||
"params": Object {},
|
||||
"path": "/",
|
||||
"url": "/",
|
||||
},
|
||||
"staticContext": undefined,
|
||||
}
|
||||
}
|
||||
>
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
}
|
||||
}
|
||||
>
|
||||
<MonitorPage />
|
||||
</ContextProvider>
|
||||
</ContextProvider>
|
||||
`;
|
||||
|
|
@ -1,91 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`NotFoundPage render component for valid props 1`] = `
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"history": Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
},
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"match": Object {
|
||||
"isExact": true,
|
||||
"params": Object {},
|
||||
"path": "/",
|
||||
"url": "/",
|
||||
},
|
||||
"staticContext": undefined,
|
||||
}
|
||||
}
|
||||
>
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
}
|
||||
}
|
||||
>
|
||||
<NotFoundPage />
|
||||
</ContextProvider>
|
||||
</ContextProvider>
|
||||
`;
|
||||
|
|
@ -1,91 +0,0 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`MonitorPage shallow renders expected elements for valid props 1`] = `
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"history": Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
},
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"match": Object {
|
||||
"isExact": true,
|
||||
"params": Object {},
|
||||
"path": "/",
|
||||
"url": "/",
|
||||
},
|
||||
"staticContext": undefined,
|
||||
}
|
||||
}
|
||||
>
|
||||
<ContextProvider
|
||||
value={
|
||||
Object {
|
||||
"action": "POP",
|
||||
"block": [Function],
|
||||
"canGo": [Function],
|
||||
"createHref": [Function],
|
||||
"entries": Array [
|
||||
Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
],
|
||||
"go": [Function],
|
||||
"goBack": [Function],
|
||||
"goForward": [Function],
|
||||
"index": 0,
|
||||
"length": 1,
|
||||
"listen": [Function],
|
||||
"location": Object {
|
||||
"hash": "",
|
||||
"key": "TestKeyForTesting",
|
||||
"pathname": "/",
|
||||
"search": "",
|
||||
"state": undefined,
|
||||
},
|
||||
"push": [Function],
|
||||
"replace": [Function],
|
||||
}
|
||||
}
|
||||
>
|
||||
<OverviewPageComponent />
|
||||
</ContextProvider>
|
||||
</ContextProvider>
|
||||
`;
|
||||
|
|
@ -6,11 +6,18 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { shallowWithRouter } from '../lib';
|
||||
import { CertificatesPage } from './certificates';
|
||||
import { render } from '../lib/helper/rtl_helpers';
|
||||
|
||||
describe('CertificatesPage', () => {
|
||||
it('shallow renders expected elements for valid props', () => {
|
||||
expect(shallowWithRouter(<CertificatesPage />)).toMatchSnapshot();
|
||||
it('renders expected elements for valid props', async () => {
|
||||
const { findByText } = render(<CertificatesPage />);
|
||||
|
||||
expect(await findByText('This table contains 0 rows; Page 1 of 0.')).toBeInTheDocument();
|
||||
expect(
|
||||
await findByText(
|
||||
'No Certificates found. Note: Certificates are only visible for Heartbeat 7.8+'
|
||||
)
|
||||
).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -7,10 +7,19 @@
|
|||
|
||||
import React from 'react';
|
||||
import { MonitorPage } from './monitor';
|
||||
import { shallowWithRouter } from '../lib';
|
||||
import { render } from '../lib/helper/rtl_helpers';
|
||||
|
||||
describe('MonitorPage', () => {
|
||||
it('shallow renders expected elements for valid props', () => {
|
||||
expect(shallowWithRouter(<MonitorPage />)).toMatchSnapshot();
|
||||
it('renders', async () => {
|
||||
const { findByText } = render(<MonitorPage />);
|
||||
|
||||
expect(await findByText('Up in 0 location')).toBeInTheDocument();
|
||||
expect(await findByText('Overall availability')).toBeInTheDocument();
|
||||
expect(await findByText('0.00 %')).toBeInTheDocument();
|
||||
expect(await findByText('Url')).toBeInTheDocument();
|
||||
expect(await findByText('Monitor ID')).toBeInTheDocument();
|
||||
expect(await findByText('Tags')).toBeInTheDocument();
|
||||
expect(await findByText('Set tags')).toBeInTheDocument();
|
||||
expect(await findByText('Monitoring from')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -6,12 +6,14 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { shallowWithRouter } from '../lib';
|
||||
import { NotFoundPage } from './not_found';
|
||||
import { render } from '../lib/helper/rtl_helpers';
|
||||
|
||||
describe('NotFoundPage', () => {
|
||||
it('render component for valid props', () => {
|
||||
const component = shallowWithRouter(<NotFoundPage />);
|
||||
expect(component).toMatchSnapshot();
|
||||
it('render component', async () => {
|
||||
const { findByText } = render(<NotFoundPage />);
|
||||
|
||||
expect(await findByText('Page not found')).toBeInTheDocument();
|
||||
expect(await findByText('Back to home')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -7,10 +7,16 @@
|
|||
|
||||
import React from 'react';
|
||||
import { OverviewPageComponent } from './overview';
|
||||
import { shallowWithRouter } from '../lib';
|
||||
import { render } from '../lib/helper/rtl_helpers';
|
||||
|
||||
describe('MonitorPage', () => {
|
||||
it('shallow renders expected elements for valid props', () => {
|
||||
expect(shallowWithRouter(<OverviewPageComponent />)).toMatchSnapshot();
|
||||
it('renders expected elements for valid props', async () => {
|
||||
const { findByText, findByPlaceholderText } = render(<OverviewPageComponent />);
|
||||
|
||||
expect(await findByText('No uptime monitors found')).toBeInTheDocument();
|
||||
|
||||
expect(
|
||||
await findByPlaceholderText('Search by monitor ID, name, or url (E.g. http:// )')
|
||||
).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue