Skip to content

Commit

Permalink
add unit tests
Browse files Browse the repository at this point in the history
  • Loading branch information
@christineweng
christineweng committed Feb 3, 2023
1 parent d270890 commit 7dc454f
Show file tree
Hide file tree
Showing 38 changed files with 1,028 additions and 201 deletions.
2 changes: 1 addition & 1 deletion x-pack/plugins/security_solution/common/experimental_features.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@ export const allowedExperimentalValues = Object.freeze({
/**
* Enables top charts on Alerts Page
*/
alertsPageChartsEnabled: false,
alertsPageChartsEnabled: true,

/**
* Keep DEPRECATED experimental flags that are documented to prevent failed upgrades.
Expand Down
8 changes: 7 additions & 1 deletion ...curity_solution/public/detections/components/alerts_kpis/alerts_by_type_panel/helpers.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
import { has } from 'lodash';
import type { AlertType, AlertsByTypeAgg, AlertsTypeData } from './types';
import type { AlertSearchResponse } from '../../../containers/detection_engine/alerts/types';
import type { SummaryChartsData } from '../alerts_summary_charts_panel/types';
import type { SummaryChartsData, SummaryChartsAgg } from '../alerts_summary_charts_panel/types';

export const ALERT_TYPE_COLOR = {
Detection: '#D36086',
Expand Down Expand Up @@ -62,3 +62,9 @@ const getAggregateAlerts = (
export const isAlertsTypeData = (data: SummaryChartsData[]): data is AlertsTypeData[] => {
return data?.every((x) => has(x, 'type'));
};

export const isAlertsByTypeAgg = (
data: AlertSearchResponse<{}, SummaryChartsAgg>
): data is AlertSearchResponse<{}, AlertsByTypeAgg> => {
return has(data, 'aggregations.alertsByRule');
};
53 changes: 42 additions & 11 deletions ...urity_solution/public/detections/components/alerts_kpis/alerts_count_panel/index.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@
import React from 'react';
import { waitFor, act } from '@testing-library/react';
import { mount } from 'enzyme';

import { AlertsCountPanel } from '.';

import type { Status } from '../../../../../common/detection_engine/schemas/common';
Expand Down Expand Up @@ -61,25 +60,31 @@ jest.mock('../common/hooks', () => ({
useInspectButton: jest.fn(),
useStackByFields: jest.fn(),
}));
const mockUseIsExperimentalFeatureEnabled = useIsExperimentalFeatureEnabled as jest.Mock;
jest.mock('../../../../common/hooks/use_experimental_features');

const defaultProps = {
inspectTitle: TABLE,
signalIndexName: 'signalIndexName',
stackByField0: DEFAULT_STACK_BY_FIELD,
stackByField1: DEFAULT_STACK_BY_FIELD1,
setStackByField0: jest.fn(),
setStackByField1: jest.fn(),
isExpanded: true,
setIsExpanded: jest.fn(),
showBuildingBlockAlerts: false,
showOnlyThreatIndicatorAlerts: false,
signalIndexName: 'signalIndexName',
stackByField0: DEFAULT_STACK_BY_FIELD,
stackByField1: DEFAULT_STACK_BY_FIELD1,
status: 'open' as Status,
};
const mockUseQueryToggle = useQueryToggle as jest.Mock;
const mockSetToggle = jest.fn();
const mockUseQueryToggle = useQueryToggle as jest.Mock;

describe('AlertsCountPanel', () => {
beforeEach(() => {
jest.clearAllMocks();
mockUseQueryToggle.mockReturnValue({ toggleStatus: true, setToggleStatus: mockSetToggle });
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(false); // for chartEmbeddablesEnabled flag
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(false); // for alertsPageChartsEnabled flag
});

it('renders correctly', async () => {
Expand Down Expand Up @@ -177,6 +182,7 @@ describe('AlertsCountPanel', () => {
});
});
});

describe('toggleQuery', () => {
it('toggles', async () => {
await act(async () => {
Expand All @@ -189,7 +195,7 @@ describe('AlertsCountPanel', () => {
expect(mockSetToggle).toBeCalledWith(false);
});
});
it('toggleStatus=true, render', async () => {
it('alertsPageChartsEnabled is false and toggleStatus=true, render', async () => {
await act(async () => {
const wrapper = mount(
<TestProviders>
Expand All @@ -199,7 +205,7 @@ describe('AlertsCountPanel', () => {
expect(wrapper.find('[data-test-subj="alertsCountTable"]').exists()).toEqual(true);
});
});
it('toggleStatus=false, hide', async () => {
it('alertsPageChartsEnabled is false and toggleStatus=false, hide', async () => {
mockUseQueryToggle.mockReturnValue({ toggleStatus: false, setToggleStatus: mockSetToggle });
await act(async () => {
const wrapper = mount(
Expand All @@ -210,16 +216,41 @@ describe('AlertsCountPanel', () => {
expect(wrapper.find('[data-test-subj="alertsCountTable"]').exists()).toEqual(false);
});
});

it('alertsPageChartsEnabled is true and isExpanded=true, render', async () => {
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(false); // for chartEmbeddablesEnabled flag
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(true); // for alertsPageChartsEnabled flag
await act(async () => {
mockUseIsExperimentalFeatureEnabled('charts', true);
const wrapper = mount(
<TestProviders>
<AlertsCountPanel {...defaultProps} />
</TestProviders>
);
expect(wrapper.find('[data-test-subj="alertsCountTable"]').exists()).toEqual(true);
});
});
it('alertsPageChartsEnabled is true and isExpanded=false, hide', async () => {
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(false); // for chartEmbeddablesEnabled flag
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(true); // for alertsPageChartsEnabled flag
await act(async () => {
const wrapper = mount(
<TestProviders>
<AlertsCountPanel {...defaultProps} isExpanded={false} />
</TestProviders>
);
expect(wrapper.find('[data-test-subj="alertsCountTable"]').exists()).toEqual(false);
});
});
});
});

describe('when isChartEmbeddablesEnabled = true', () => {
beforeEach(() => {
jest.clearAllMocks();

mockUseQueryToggle.mockReturnValue({ toggleStatus: true, setToggleStatus: mockSetToggle });

(useIsExperimentalFeatureEnabled as jest.Mock).mockReturnValue(true);
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(true); // for chartEmbeddablesEnabled flag
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(false); // for alertsPageChartsEnabled flag
});

it('renders LensEmbeddable', async () => {
Expand All @@ -229,7 +260,7 @@ describe('when isChartEmbeddablesEnabled = true', () => {
<AlertsCountPanel {...defaultProps} />
</TestProviders>
);
expect(wrapper.find('[data-test-subj="lens-embeddable"]').exists()).toBeTruthy();
expect(wrapper.find('[data-test-subj="embeddable-count-table"]').exists()).toBeTruthy();
});
});

Expand Down
4 changes: 2 additions & 2 deletions ...s/security_solution/public/detections/components/alerts_kpis/alerts_count_panel/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,7 @@ export const AlertsCountPanel = memo<AlertsCountPanelProps>(
setIsExpanded,
}) => {
const { to, from, deleteQuery, setQuery } = useGlobalTime(false);
const isChartEmbeddablesEnabled = useIsExperimentalFeatureEnabled('chartEmbeddablesEnabled');
const isAlertsPageChartsEnabled = useIsExperimentalFeatureEnabled('alertsPageChartsEnabled');
// create a unique, but stable (across re-renders) query id
const uniqueQueryId = useMemo(() => `${DETECTIONS_ALERTS_COUNT_ID}-${uuidv4()}`, []);
Expand Down Expand Up @@ -130,7 +131,6 @@ export const AlertsCountPanel = memo<AlertsCountPanelProps>(
[setQuerySkip, setToggleStatus, setIsExpanded, isAlertsPageChartsEnabled]
);

const isChartEmbeddablesEnabled = useIsExperimentalFeatureEnabled('chartEmbeddablesEnabled');
const timerange = useMemo(() => ({ from, to }), [from, to]);

const extraVisualizationOptions = useMemo(
Expand Down Expand Up @@ -234,7 +234,7 @@ export const AlertsCountPanel = memo<AlertsCountPanelProps>(
(!isAlertsPageChartsEnabled && toggleStatus) ? (
<ChartContent
alertsData={alertsData}
data-test-subj="embeddable-matrix-histogram"
data-test-subj="embeddable-count-table"
extraActions={extraActions}
extraOptions={extraVisualizationOptions}
getLensAttributes={getLensAttributes}
Expand Down
131 changes: 95 additions & 36 deletions ...y_solution/public/detections/components/alerts_kpis/alerts_histogram_panel/index.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -109,24 +109,23 @@ jest.mock('../common/hooks', () => {
};
});

describe('AlertsHistogramPanel', () => {
const defaultProps = {
setQuery: jest.fn(),
showBuildingBlockAlerts: false,
showOnlyThreatIndicatorAlerts: false,
signalIndexName: 'signalIndexName',
updateDateRange: jest.fn(),
};
const mockUseIsExperimentalFeatureEnabled = useIsExperimentalFeatureEnabled as jest.Mock;
jest.mock('../../../../common/hooks/use_experimental_features');

const mockSetToggle = jest.fn();
const mockUseQueryToggle = useQueryToggle as jest.Mock;
beforeEach(() => {
mockUseQueryToggle.mockReturnValue({ toggleStatus: true, setToggleStatus: mockSetToggle });
});
const defaultProps = {
setQuery: jest.fn(),
showBuildingBlockAlerts: false,
showOnlyThreatIndicatorAlerts: false,
signalIndexName: 'signalIndexName',
updateDateRange: jest.fn(),
};
const mockSetToggle = jest.fn();
const mockUseQueryToggle = useQueryToggle as jest.Mock;

afterEach(() => {
describe('AlertsHistogramPanel', () => {
beforeEach(() => {
jest.clearAllMocks();
jest.restoreAllMocks();
mockUseQueryToggle.mockReturnValue({ toggleStatus: true, setToggleStatus: mockSetToggle });
});

it('renders correctly', () => {
Expand Down Expand Up @@ -690,37 +689,95 @@ describe('AlertsHistogramPanel', () => {
expect(mockSetToggle).toBeCalledWith(false);
});
});
it('toggleStatus=true, render', async () => {
await act(async () => {
const wrapper = mount(
<TestProviders>
<AlertsHistogramPanel {...defaultProps} />
</TestProviders>
);

expect(wrapper.find(MatrixLoader).exists()).toEqual(true);
describe('when alertsPageChartsEnabled = false', () => {
beforeEach(() => {
jest.clearAllMocks();
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(false); // for chartEmbeddablesEnabled flag
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(false); // for alertsPageChartsEnabled flag
});

it('toggleStatus=true, render', async () => {
await act(async () => {
const wrapper = mount(
<TestProviders>
<AlertsHistogramPanel {...defaultProps} />
</TestProviders>
);

expect(wrapper.find(MatrixLoader).exists()).toEqual(true);
});
});
it('toggleStatus=false, hide', async () => {
mockUseQueryToggle.mockReturnValue({ toggleStatus: false, setToggleStatus: mockSetToggle });
await act(async () => {
const wrapper = mount(
<TestProviders>
<AlertsHistogramPanel {...defaultProps} />
</TestProviders>
);
expect(wrapper.find(MatrixLoader).exists()).toEqual(false);
});
});
});
it('toggleStatus=false, hide', async () => {
mockUseQueryToggle.mockReturnValue({ toggleStatus: false, setToggleStatus: mockSetToggle });
await act(async () => {
const wrapper = mount(
<TestProviders>
<AlertsHistogramPanel {...defaultProps} />
</TestProviders>
);
expect(wrapper.find(MatrixLoader).exists()).toEqual(false);

describe('when alertsPageChartsEnabled = true', () => {
beforeEach(() => {
jest.clearAllMocks();
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(false); // for chartEmbeddablesEnabled flag
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(true); // for alertsPageChartsEnabled flag
});

it('isExpanded=true, render', async () => {
await act(async () => {
const wrapper = mount(
<TestProviders>
<AlertsHistogramPanel {...defaultProps} isExpanded={true} />
</TestProviders>
);
expect(wrapper.find(MatrixLoader).exists()).toEqual(true);
});
});
it('isExpanded=false, hide', async () => {
await act(async () => {
const wrapper = mount(
<TestProviders>
<AlertsHistogramPanel {...defaultProps} isExpanded={false} />
</TestProviders>
);
expect(wrapper.find(MatrixLoader).exists()).toEqual(false);
});
});
it('isExpanded is not passed in and toggleStatus =true, render', async () => {
await act(async () => {
const wrapper = mount(
<TestProviders>
<AlertsHistogramPanel {...defaultProps} />
</TestProviders>
);
expect(wrapper.find(MatrixLoader).exists()).toEqual(true);
});
});
it('isExpanded is not passed in and toggleStatus =false, hide', async () => {
mockUseQueryToggle.mockReturnValue({ toggleStatus: false, setToggleStatus: mockSetToggle });
await act(async () => {
const wrapper = mount(
<TestProviders>
<AlertsHistogramPanel {...defaultProps} />
</TestProviders>
);
expect(wrapper.find(MatrixLoader).exists()).toEqual(false);
});
});
});
});

describe('when isChartEmbeddablesEnabled = true', () => {
beforeEach(() => {
jest.clearAllMocks();

mockUseQueryToggle.mockReturnValue({ toggleStatus: true, setToggleStatus: mockSetToggle });

(useIsExperimentalFeatureEnabled as jest.Mock).mockReturnValue(true);
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(true); // for chartEmbeddablesEnabled flag
mockUseIsExperimentalFeatureEnabled.mockReturnValueOnce(false); // for alertsPageChartsEnabled flag
});

it('renders LensEmbeddable', async () => {
Expand All @@ -730,7 +787,9 @@ describe('AlertsHistogramPanel', () => {
<AlertsHistogramPanel {...defaultProps} />
</TestProviders>
);
expect(wrapper.find('[data-test-subj="lens-embeddable"]').exists()).toBeTruthy();
expect(
wrapper.find('[data-test-subj="embeddable-matrix-histogram"]').exists()
).toBeTruthy();
});
});

Expand Down

0 comments on commit 7dc454f

Please sign in to comment.