From 099e29d2d904fc9b2f9fde2a10167223fe2487d5 Mon Sep 17 00:00:00 2001 From: Angela Chuang Date: Thu, 19 Dec 2024 10:19:12 +0000 Subject: [PATCH] unit tests --- .../common/components/charts/barchart.test.tsx | 8 -------- .../common/components/matrix_histogram/utils.ts | 9 --------- .../chart_panels/chart_collapse/index.tsx | 7 ++++--- .../shared/components/alert_count_insight.test.tsx | 14 +++++++------- 4 files changed, 11 insertions(+), 27 deletions(-) delete mode 100644 x-pack/solutions/security/plugins/security_solution/public/common/components/matrix_histogram/utils.ts diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/charts/barchart.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/common/components/charts/barchart.test.tsx index 7a5eb94d56249..ed94c2ce8933d 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/charts/barchart.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/common/components/charts/barchart.test.tsx @@ -353,8 +353,6 @@ describe.each(chartDataSets)('BarChart with stackByField', () => { }, ]; - const expectedColors = ['#1EA593', '#2B70F7', '#CE0060']; - const stackByField = 'process.name'; beforeAll(() => { @@ -369,12 +367,6 @@ describe.each(chartDataSets)('BarChart with stackByField', () => { expect(wrapper.find('[data-test-subj="draggable-legend"]').exists()).toBe(true); }); - expectedColors.forEach((color, i) => { - test(`it renders the expected legend color ${color} for legend item ${i}`, () => { - expect(wrapper.find(`div [color="${color}"]`).exists()).toBe(true); - }); - }); - data.forEach((datum) => { test(`it renders the expected draggable legend text for datum ${datum.key}`, () => { const dataProviderId = `draggableId.content.draggable-legend-item-uuid_v4()-${escapeDataProviderId( diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/matrix_histogram/utils.ts b/x-pack/solutions/security/plugins/security_solution/public/common/components/matrix_histogram/utils.ts deleted file mode 100644 index 674ec74ae9fc7..0000000000000 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/matrix_histogram/utils.ts +++ /dev/null @@ -1,9 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0; you may not use this file except in compliance with the Elastic License - * 2.0. - */ - -export const DEFAULT_CHART_HEIGHT = 174; -export const DEFAULT_Y_TICK_FORMATTER = (value: string | number): string => value.toLocaleString(); diff --git a/x-pack/solutions/security/plugins/security_solution/public/detections/components/alerts_kpis/chart_panels/chart_collapse/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/detections/components/alerts_kpis/chart_panels/chart_collapse/index.tsx index c779daf2b2dd2..1e6eaff6f6435 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/detections/components/alerts_kpis/chart_panels/chart_collapse/index.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/detections/components/alerts_kpis/chart_panels/chart_collapse/index.tsx @@ -21,7 +21,7 @@ import { FormattedCount } from '../../../../../common/components/formatted_numbe import { getIsChartCollapseData } from './helpers'; import * as i18n from './translations'; -import { SEVERITY_COLOR } from '../../../../../overview/components/detection_response/utils'; +import { getSeverityColor as getAlertsSeverityColor } from '../../../../../overview/components/detection_response/utils'; const DETECTIONS_ALERTS_COLLAPSED_CHART_ID = 'detectioin-alerts-collapsed-chart'; @@ -97,7 +97,8 @@ export const ChartCollapse: React.FC = ({ const topGroup = useMemo(() => data.at(0)?.group ?? i18n.NO_RESULT_MESSAGE, [data]); const severities = useMemo(() => { const severityData = data.at(0)?.severities ?? []; - return Object.keys(SEVERITY_COLOR).map((severity) => { + const severityColors = getAlertsSeverityColor(euiTheme); + return Object.keys(severityColors).map((severity) => { const obj = severityData.find((s) => s.key === severity); if (obj) { return { key: obj.key, label: obj.label, value: obj.value }; @@ -105,7 +106,7 @@ export const ChartCollapse: React.FC = ({ return { key: severity, label: capitalize(severity), value: 0 }; } }); - }, [data]); + }, [data, euiTheme]); const groupBy = useMemo(() => getGroupByLabel(groupBySelection), [groupBySelection]); return ( diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/shared/components/alert_count_insight.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/shared/components/alert_count_insight.test.tsx index 5873c0c53e198..e8e940d43954d 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/shared/components/alert_count_insight.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/shared/components/alert_count_insight.test.tsx @@ -11,7 +11,7 @@ import { TestProviders } from '../../../../common/mock'; import { AlertCountInsight, getFormattedAlertStats } from './alert_count_insight'; import { useAlertsByStatus } from '../../../../overview/components/detection_response/alerts_by_status/use_alerts_by_status'; import type { ParsedAlertsData } from '../../../../overview/components/detection_response/alerts_by_status/types'; -import { SEVERITY_COLOR } from '../../../../overview/components/detection_response/utils'; +import { getSeverityColor } from '../../../../overview/components/detection_response/utils'; import type { EuiThemeComputed } from '@elastic/eui'; jest.mock('../../../../common/lib/kibana'); @@ -24,7 +24,7 @@ jest.mock('@kbn/cloud-security-posture/src/hooks/use_misconfiguration_preview'); jest.mock( '../../../../overview/components/detection_response/alerts_by_status/use_alerts_by_status' ); - +const mockEuiTheme = { colors: { vis: {} } } as EuiThemeComputed; const fieldName = 'host.name'; const name = 'test host'; const testId = 'test'; @@ -111,14 +111,14 @@ describe('AlertCountInsight', () => { }); describe('getFormattedAlertStats', () => { - const mockEuiTheme = {} as EuiThemeComputed; it('should return alert stats', () => { + const severityColors = getSeverityColor(mockEuiTheme); const alertStats = getFormattedAlertStats(mockAlertData, mockEuiTheme); expect(alertStats).toEqual([ - { key: 'High', count: 2, color: SEVERITY_COLOR.high }, - { key: 'Low', count: 2, color: SEVERITY_COLOR.low }, - { key: 'Medium', count: 2, color: SEVERITY_COLOR.medium }, - { key: 'Critical', count: 2, color: SEVERITY_COLOR.critical }, + { key: 'High', count: 2, color: severityColors.high }, + { key: 'Low', count: 2, color: severityColors.low }, + { key: 'Medium', count: 2, color: severityColors.medium }, + { key: 'Critical', count: 2, color: severityColors.critical }, ]); });