Skip to content

Commit

Permalink
[Alerting UI] Converted Rules and Connectors management pages to new …
Browse files Browse the repository at this point in the history
…layout. (#101697)

* [Alerting UI] Converted Rules and Connectors management pages to new layout.

* fixed tests

* fixed tests

* fixed tests

* fixed tests
  • Loading branch information
YulNaumenko authored and semd committed Jun 10, 2021
1 parent bda3d14 commit d2b626d
Show file tree
Hide file tree
Showing 4 changed files with 319 additions and 286 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,7 @@ export const TriggersActionsUIHome: React.FunctionComponent<RouteComponentProps<

return (
<EuiPageBody>
<EuiPageContent>
<EuiPageContent color="transparent">
<EuiTitle size="m">
<EuiFlexGroup>
<EuiFlexItem>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,14 @@ import { mountWithIntl, nextTick } from '@kbn/test/jest';
import { act } from '@testing-library/react';
import { AlertDetails } from './alert_details';
import { Alert, ActionType, AlertTypeModel, AlertType } from '../../../../types';
import { EuiTitle, EuiBadge, EuiFlexItem, EuiSwitch, EuiButtonEmpty, EuiText } from '@elastic/eui';
import { ViewInApp } from './view_in_app';
import {
EuiBadge,
EuiFlexItem,
EuiSwitch,
EuiButtonEmpty,
EuiText,
EuiPageHeaderProps,
} from '@elastic/eui';
import {
ActionGroup,
AlertExecutionStatusErrorReasons,
Expand Down Expand Up @@ -75,13 +81,7 @@ describe('alert_details', () => {
expect(
shallow(
<AlertDetails alert={alert} alertType={alertType} actionTypes={[]} {...mockAlertApis} />
).containsMatchingElement(
<EuiTitle size="m">
<h1>
<span>{alert.name}</span>
</h1>
</EuiTitle>
)
).find('EuiPageHeader')
).toBeTruthy();
});

Expand All @@ -103,7 +103,7 @@ describe('alert_details', () => {
expect(
shallow(
<AlertDetails alert={alert} alertType={alertType} actionTypes={[]} {...mockAlertApis} />
).containsMatchingElement(<EuiBadge>{alertType.name}</EuiBadge>)
).find(<EuiBadge>{alertType.name}</EuiBadge>)
).toBeTruthy();
});

Expand Down Expand Up @@ -290,7 +290,7 @@ describe('alert_details', () => {
expect(
shallow(
<AlertDetails alert={alert} alertType={alertType} actionTypes={[]} {...mockAlertApis} />
).containsMatchingElement(<ViewInApp alert={alert} />)
).find('ViewInApp')
).toBeTruthy();
});

Expand All @@ -309,16 +309,29 @@ describe('alert_details', () => {
minimumLicenseRequired: 'basic',
enabledInLicense: true,
};

expect(
shallow(
<AlertDetails alert={alert} alertType={alertType} actionTypes={[]} {...mockAlertApis} />
)
.find(EuiButtonEmpty)
.find('[data-test-subj="openEditAlertFlyoutButton"]')
.first()
.exists()
).toBeTruthy();
const pageHeaderProps = shallow(
<AlertDetails alert={alert} alertType={alertType} actionTypes={[]} {...mockAlertApis} />
)
.find('EuiPageHeader')
.props() as EuiPageHeaderProps;
const rightSideItems = pageHeaderProps.rightSideItems;
expect(!!rightSideItems && rightSideItems[2]!).toMatchInlineSnapshot(`
<React.Fragment>
<EuiButtonEmpty
data-test-subj="openEditAlertFlyoutButton"
disabled={false}
iconType="pencil"
name="edit"
onClick={[Function]}
>
<FormattedMessage
defaultMessage="Edit"
id="xpack.triggersActionsUI.sections.alertDetails.editAlertButtonLabel"
values={Object {}}
/>
</EuiButtonEmpty>
</React.Fragment>
`);
});
});
});
Expand Down Expand Up @@ -768,20 +781,34 @@ describe('edit button', () => {
enabledInLicense: true,
};

expect(
shallow(
<AlertDetails
alert={alert}
alertType={alertType}
actionTypes={actionTypes}
{...mockAlertApis}
const pageHeaderProps = shallow(
<AlertDetails
alert={alert}
alertType={alertType}
actionTypes={actionTypes}
{...mockAlertApis}
/>
)
.find('EuiPageHeader')
.props() as EuiPageHeaderProps;
const rightSideItems = pageHeaderProps.rightSideItems;
expect(!!rightSideItems && rightSideItems[2]!).toMatchInlineSnapshot(`
<React.Fragment>
<EuiButtonEmpty
data-test-subj="openEditAlertFlyoutButton"
disabled={false}
iconType="pencil"
name="edit"
onClick={[Function]}
>
<FormattedMessage
defaultMessage="Edit"
id="xpack.triggersActionsUI.sections.alertDetails.editAlertButtonLabel"
values={Object {}}
/>
)
.find(EuiButtonEmpty)
.find('[name="edit"]')
.first()
.exists()
).toBeTruthy();
</EuiButtonEmpty>
</React.Fragment>
`);
});

it('should not render an edit button when alert editable but actions arent', () => {
Expand Down Expand Up @@ -851,20 +878,34 @@ describe('edit button', () => {
enabledInLicense: true,
};

expect(
shallow(
<AlertDetails
alert={alert}
alertType={alertType}
actionTypes={actionTypes}
{...mockAlertApis}
const pageHeaderProps = shallow(
<AlertDetails
alert={alert}
alertType={alertType}
actionTypes={actionTypes}
{...mockAlertApis}
/>
)
.find('EuiPageHeader')
.props() as EuiPageHeaderProps;
const rightSideItems = pageHeaderProps.rightSideItems;
expect(!!rightSideItems && rightSideItems[2]!).toMatchInlineSnapshot(`
<React.Fragment>
<EuiButtonEmpty
data-test-subj="openEditAlertFlyoutButton"
disabled={false}
iconType="pencil"
name="edit"
onClick={[Function]}
>
<FormattedMessage
defaultMessage="Edit"
id="xpack.triggersActionsUI.sections.alertDetails.editAlertButtonLabel"
values={Object {}}
/>
)
.find(EuiButtonEmpty)
.find('[name="edit"]')
.first()
.exists()
).toBeTruthy();
</EuiButtonEmpty>
</React.Fragment>
`);
});
});

Expand All @@ -885,18 +926,17 @@ describe('refresh button', () => {
};

const requestRefresh = jest.fn();
const refreshButton = shallow(
const wrapper = mountWithIntl(
<AlertDetails
alert={alert}
alertType={alertType}
actionTypes={[]}
{...mockAlertApis}
requestRefresh={requestRefresh}
/>
)
.find('[data-test-subj="refreshAlertsButton"]')
.first();
);

const refreshButton = wrapper.find('[data-test-subj="refreshAlertsButton"]').first();
expect(refreshButton.exists()).toBeTruthy();

refreshButton.simulate('click');
Expand Down
Loading

0 comments on commit d2b626d

Please sign in to comment.