Skip to content

Commit

Permalink
addresses comments
Browse files Browse the repository at this point in the history
  • Loading branch information
@dplumlee
dplumlee committed Mar 16, 2020
1 parent 4e931e9 commit bbfd954
Show file tree
Hide file tree
Showing 4 changed files with 77 additions and 98 deletions.
51 changes: 4 additions & 47 deletions x-pack/plugins/endpoint/public/applications/endpoint/view/alerts/alert_details.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,70 +4,27 @@
* you may not use this file except in compliance with the Elastic License.
*/

import React from 'react';
import * as reactTestingLibrary from '@testing-library/react';
import { Provider } from 'react-redux';
import { I18nProvider } from '@kbn/i18n/react';
import { AlertIndex } from './index';
import { appStoreFactory } from '../../store';
import { KibanaContextProvider } from '../../../../../../../../src/plugins/kibana_react/public';
import { fireEvent } from '@testing-library/react';
import { RouteCapture } from '../route_capture';
import { createMemoryHistory, MemoryHistory } from 'history';
import { Router } from 'react-router-dom';
import { MemoryHistory } from 'history';
import { AppAction } from '../../types';
import { mockAlertResultList } from '../../store/alerts/mock_alert_result_list';
import { DepsStartMock, depsStartMock } from '../../mocks';
import { alertPageTestRender } from './test_helpers/render_alert_page';

describe('when the alert details flyout is open', () => {
let render: () => reactTestingLibrary.RenderResult;
let history: MemoryHistory<never>;
let store: ReturnType<typeof appStoreFactory>;
let depsStart: DepsStartMock;

beforeEach(async () => {
/**
* Create a 'history' instance that is only in-memory and causes no side effects to the testing environment.
*/
history = createMemoryHistory<never>();
/**
* Create a store, with the middleware disabled. We don't want side effects being created by our code in this test.
*/
store = appStoreFactory();

depsStart = depsStartMock();
depsStart.data.ui.SearchBar.mockImplementation(() => <div />);

/**
* Render the test component, use this after setting up anything in `beforeEach`.
*/
render = () => {
/**
* Provide the store via `Provider`, and i18n APIs via `I18nProvider`.
* Use react-router via `Router`, passing our in-memory `history` instance.
* Use `RouteCapture` to emit url-change actions when the URL is changed.
* Finally, render the `AlertIndex` component which we are testing.
*/
return reactTestingLibrary.render(
<Provider store={store}>
<KibanaContextProvider services={{ data: depsStart.data }}>
<I18nProvider>
<Router history={history}>
<RouteCapture>
<AlertIndex />
</RouteCapture>
</Router>
</I18nProvider>
</KibanaContextProvider>
</Provider>
);
};
// Creates the render elements for the tests to use
({ render, history, store } = alertPageTestRender);
});
describe('when the alerts details flyout is open', () => {
beforeEach(() => {
reactTestingLibrary.act(() => {
history.push({
...history.location,
search: '?selected_alert=1',
});
});
Expand Down
8 changes: 5 additions & 3 deletions ...dpoint/public/applications/endpoint/view/alerts/details/overview/take_action_dropdown.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,19 +29,22 @@ export const TakeActionDropdown = memo(() => {
setIsDropdownOpen(!isDropdownOpen);
}, [isDropdownOpen]);

const closePopover = useCallback(() => {
setIsDropdownOpen(false);
}, []);

return (
<EuiPopover
button={<TakeActionButton onClick={onClick} />}
isOpen={isDropdownOpen}
anchorPosition="downRight"
closePopover={() => setIsDropdownOpen(false)}
closePopover={closePopover}
data-test-subj="alertListTakeActionDropdownContent"
>
<EuiFormRow>
<EuiButtonEmpty
data-test-subj="alertDetailTakeActionCloseAlertButton"
color="text"
onClick={() => {}}
iconType="folderCheck"
>
<FormattedMessage
Expand All @@ -55,7 +58,6 @@ export const TakeActionDropdown = memo(() => {
<EuiButtonEmpty
data-test-subj="alertDetailTakeActionWhitelistButton"
color="text"
onClick={() => {}}
iconType="listAdd"
>
<FormattedMessage
Expand Down
57 changes: 9 additions & 48 deletions x-pack/plugins/endpoint/public/applications/endpoint/view/alerts/index.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,21 +4,15 @@
* you may not use this file except in compliance with the Elastic License.
*/

import React from 'react';
import * as reactTestingLibrary from '@testing-library/react';
import { Provider } from 'react-redux';
import { I18nProvider } from '@kbn/i18n/react';
import { AlertIndex } from './index';
import { IIndexPattern } from 'src/plugins/data/public';
import { appStoreFactory } from '../../store';
import { KibanaContextProvider } from '../../../../../../../../src/plugins/kibana_react/public';
import { fireEvent, act } from '@testing-library/react';
import { RouteCapture } from '../route_capture';
import { createMemoryHistory, MemoryHistory } from 'history';
import { Router } from 'react-router-dom';
import { MemoryHistory } from 'history';
import { AppAction } from '../../types';
import { mockAlertResultList } from '../../store/alerts/mock_alert_result_list';
import { DepsStartMock, depsStartMock } from '../../mocks';
import { DepsStartMock } from '../../mocks';
import { alertPageTestRender } from './test_helpers/render_alert_page';

describe('when on the alerting page', () => {
let render: () => reactTestingLibrary.RenderResult;
Expand All @@ -27,42 +21,8 @@ describe('when on the alerting page', () => {
let depsStart: DepsStartMock;

beforeEach(async () => {
/**
* Create a 'history' instance that is only in-memory and causes no side effects to the testing environment.
*/
history = createMemoryHistory<never>();
/**
* Create a store, with the middleware disabled. We don't want side effects being created by our code in this test.
*/
store = appStoreFactory();

depsStart = depsStartMock();
depsStart.data.ui.SearchBar.mockImplementation(() => <div />);

/**
* Render the test component, use this after setting up anything in `beforeEach`.
*/
render = () => {
/**
* Provide the store via `Provider`, and i18n APIs via `I18nProvider`.
* Use react-router via `Router`, passing our in-memory `history` instance.
* Use `RouteCapture` to emit url-change actions when the URL is changed.
* Finally, render the `AlertIndex` component which we are testing.
*/
return reactTestingLibrary.render(
<Provider store={store}>
<KibanaContextProvider services={{ data: depsStart.data }}>
<I18nProvider>
<Router history={history}>
<RouteCapture>
<AlertIndex />
</RouteCapture>
</Router>
</I18nProvider>
</KibanaContextProvider>
</Provider>
);
};
// Creates the render elements for the tests to use
({ render, history, store, depsStart } = alertPageTestRender);
});
it('should show a data grid', async () => {
await render().findByTestId('alertListGrid');
Expand All @@ -80,7 +40,7 @@ describe('when on the alerting page', () => {
reactTestingLibrary.act(() => {
const action: AppAction = {
type: 'serverReturnedAlertsData',
payload: mockAlertResultList(),
payload: mockAlertResultList({ total: 11 }),
};
store.dispatch(action);
});
Expand All @@ -93,16 +53,17 @@ describe('when on the alerting page', () => {
* There should be a 'row' which is the header, and
* row which is the alert item.
*/
expect(rows).toHaveLength(2);
expect(rows).toHaveLength(11);
});
describe('when the user has clicked the alert type in the grid', () => {
let renderResult: reactTestingLibrary.RenderResult;
beforeEach(async () => {
renderResult = render();
const alertLinks = await renderResult.findAllByTestId('alertTypeCellLink');
/**
* This is the cell with the alert type, it has a link.
*/
fireEvent.click(await renderResult.findByTestId('alertTypeCellLink'));
fireEvent.click(alertLinks[0]);
});
it('should show the flyout', async () => {
await renderResult.findByTestId('alertDetailFlyout');
Expand Down
59 changes: 59 additions & 0 deletions ...gins/endpoint/public/applications/endpoint/view/alerts/test_helpers/render_alert_page.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
/*
* 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 * as reactTestingLibrary from '@testing-library/react';
import { Provider } from 'react-redux';
import { I18nProvider } from '@kbn/i18n/react';
import { createMemoryHistory } from 'history';
import { Router } from 'react-router-dom';
import { AlertIndex } from '../index';
import { appStoreFactory } from '../../../store';
import { KibanaContextProvider } from '../../../../../../../../../src/plugins/kibana_react/public';
import { RouteCapture } from '../../route_capture';
import { depsStartMock } from '../../../mocks';

/**
* Create a 'history' instance that is only in-memory and causes no side effects to the testing environment.
*/
const history = createMemoryHistory<never>();
/**
* Create a store, with the middleware disabled. We don't want side effects being created by our code in this test.
*/
const store = appStoreFactory();

const depsStart = depsStartMock();
depsStart.data.ui.SearchBar.mockImplementation(() => <div />);

export const alertPageTestRender = {
store,
history,
depsStart,

/**
* Render the test component, use this after setting up anything in `beforeEach`.
*/
render: () => {
/**
* Provide the store via `Provider`, and i18n APIs via `I18nProvider`.
* Use react-router via `Router`, passing our in-memory `history` instance.
* Use `RouteCapture` to emit url-change actions when the URL is changed.
* Finally, render the `AlertIndex` component which we are testing.
*/
return reactTestingLibrary.render(
<Provider store={store}>
<KibanaContextProvider services={{ data: depsStart.data }}>
<I18nProvider>
<Router history={history}>
<RouteCapture>
<AlertIndex />
</RouteCapture>
</Router>
</I18nProvider>
</KibanaContextProvider>
</Provider>
);
},
};

0 comments on commit bbfd954

Please sign in to comment.