Skip to content

Commit

Permalink
[Security Solutions][Alert Details] Add cypress coverage for kpi char…
Browse files Browse the repository at this point in the history 
…ts (#189758)

## Summary

Added cypress tests for navigation and some cypress clean up.
  • Loading branch information
@christineweng
christineweng authored Aug 8, 2024
1 parent cdb5333 commit 92b8970
Show file tree
Hide file tree
Showing 5 changed files with 152 additions and 46 deletions.
130 changes: 101 additions & 29 deletions x-pack/test/security_solution_cypress/cypress/e2e/investigations/alerts/alerts_charts.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,30 @@
*/

import { getNewRule } from '../../../objects/rule';
import { ALERTS_COUNT } from '../../../screens/alerts';
import {
ALERT_SUMMARY_CHARTS,
SELECT_OVERVIEW_CHARTS,
SELECT_HISTOGRAM,
SELECT_COUNTS_TABLE,
SELECT_TREEMAP,
ALERT_SUMMARY_SEVERITY_DONUT_CHART,
ALERT_SUMMARY_RULES_TABLE,
ALERT_SUMMARY_PROGRESS_BAR_CHARTS,
ALERTS_HISTOGRAM,
ALERT_COUNT_TABLE,
ALERT_TREEMAP,
ALERTS_COUNT,
ALERT_SUMMARY_CHARTS_COLLAPSED,
} from '../../../screens/alerts';
import {
clickAlertsHistogramLegend,
clickAlertsHistogramLegendAddToTimeline,
clickAlertsHistogramLegendFilterFor,
clickAlertsHistogramLegendFilterOut,
selectAlertsHistogram,
selectAlertsCountTable,
selectAlertsTreemap,
toggleKPICharts,
} from '../../../tasks/alerts';
import { createRule } from '../../../tasks/api_calls/rules';
import { deleteAlertsAndRules } from '../../../tasks/api_calls/common';
Expand All @@ -25,45 +42,100 @@ import {
} from '../../../screens/search_bar';
import { TOASTER } from '../../../screens/alerts_detection_rules';

describe('Histogram legend hover actions', { tags: ['@ess', '@serverless'] }, () => {
describe('KPI visualizations in Alerts Page', { tags: ['@ess', '@serverless'] }, () => {
const ruleConfigs = getNewRule();

beforeEach(() => {
deleteAlertsAndRules();
login();
createRule(getNewRule({ rule_id: 'new custom rule' }));
visitWithTimeRange(ALERTS_URL);
selectAlertsHistogram();
});

it('should should add a filter in to KQL bar', () => {
const expectedNumberOfAlerts = 1;
clickAlertsHistogramLegend();
clickAlertsHistogramLegendFilterFor(ruleConfigs.name);
cy.get(GLOBAL_SEARCH_BAR_FILTER_ITEM).should(
'have.text',
`kibana.alert.rule.name: ${ruleConfigs.name}`
);
cy.get(ALERTS_COUNT).should('have.text', `${expectedNumberOfAlerts} alert`);
});
context('KPI viz navigation', () => {
it('should navigate through clicking chart names', () => {
cy.log('should display summary charts by default');

cy.get(ALERT_SUMMARY_CHARTS).should('exist');
cy.get(ALERT_SUMMARY_CHARTS_COLLAPSED).should('not.exist');
cy.get(SELECT_OVERVIEW_CHARTS).should('have.class', 'euiButtonGroupButton-isSelected');

cy.get(ALERT_SUMMARY_SEVERITY_DONUT_CHART).should('exist');
cy.get(ALERT_SUMMARY_RULES_TABLE).should('exist');
cy.get(ALERT_SUMMARY_PROGRESS_BAR_CHARTS).should('exist');

cy.log('should display histogram charts when clicking trend button');

selectAlertsHistogram();
cy.get(SELECT_HISTOGRAM).should('have.class', 'euiButtonGroupButton-isSelected');
cy.get(ALERT_SUMMARY_CHARTS).should('not.exist');
cy.get(ALERTS_HISTOGRAM).should('exist');

cy.log('should display table charts when clicking table button');

selectAlertsCountTable();
cy.get(ALERT_COUNT_TABLE).should('exist');
cy.get(SELECT_COUNTS_TABLE).should('have.class', 'euiButtonGroupButton-isSelected');

cy.log('should display treemap charts when clicking treemap button');

it('should add a filter out to KQL bar', () => {
clickAlertsHistogramLegend();
clickAlertsHistogramLegendFilterOut(ruleConfigs.name);
cy.get(GLOBAL_SEARCH_BAR_FILTER_ITEM).should(
'have.text',
`NOT kibana.alert.rule.name: ${ruleConfigs.name}`
);
cy.get(ALERTS_COUNT).should('not.exist');

cy.get(GLOBAL_SEARCH_BAR_FILTER_ITEM_DELETE).click();
cy.get(GLOBAL_SEARCH_BAR_FILTER_ITEM).should('not.exist');
selectAlertsTreemap();
cy.get(ALERT_TREEMAP).should('exist');
cy.get(SELECT_TREEMAP).should('have.class', 'euiButtonGroupButton-isSelected');
});

it('should display/hide collapsed chart when clicking on the toggle', () => {
cy.log('should display summary charts by default');

cy.get(ALERT_SUMMARY_CHARTS_COLLAPSED).should('not.exist');
cy.get(ALERT_SUMMARY_SEVERITY_DONUT_CHART).should('exist');

cy.log('should display collapsed summary when clicking toggle button');

toggleKPICharts();
cy.get(ALERT_SUMMARY_CHARTS_COLLAPSED).should('exist');
cy.get(ALERT_SUMMARY_SEVERITY_DONUT_CHART).should('not.exist');

cy.log('should display summary when clicking toggle button again');

toggleKPICharts();
cy.get(ALERT_SUMMARY_CHARTS_COLLAPSED).should('not.exist');
cy.get(ALERT_SUMMARY_SEVERITY_DONUT_CHART).should('exist');
});
});

it('should add To Timeline', () => {
clickAlertsHistogramLegend();
clickAlertsHistogramLegendAddToTimeline(ruleConfigs.name);
context('Histogram legend hover actions', () => {
it('should should add a filter in to KQL bar', () => {
selectAlertsHistogram();
const expectedNumberOfAlerts = 1;
clickAlertsHistogramLegend();
clickAlertsHistogramLegendFilterFor(ruleConfigs.name);
cy.get(GLOBAL_SEARCH_BAR_FILTER_ITEM).should(
'have.text',
`kibana.alert.rule.name: ${ruleConfigs.name}`
);
cy.get(ALERTS_COUNT).should('have.text', `${expectedNumberOfAlerts} alert`);
});

it('should add a filter out to KQL bar', () => {
selectAlertsHistogram();
clickAlertsHistogramLegend();
clickAlertsHistogramLegendFilterOut(ruleConfigs.name);
cy.get(GLOBAL_SEARCH_BAR_FILTER_ITEM).should(
'have.text',
`NOT kibana.alert.rule.name: ${ruleConfigs.name}`
);
cy.get(ALERTS_COUNT).should('not.exist');

cy.get(GLOBAL_SEARCH_BAR_FILTER_ITEM_DELETE).click();
cy.get(GLOBAL_SEARCH_BAR_FILTER_ITEM).should('not.exist');
});

it('should add To Timeline', () => {
selectAlertsHistogram();
clickAlertsHistogramLegend();
clickAlertsHistogramLegendAddToTimeline(ruleConfigs.name);

cy.get(TOASTER).should('have.text', `Added ${ruleConfigs.name} to timeline`);
cy.get(TOASTER).should('have.text', `Added ${ruleConfigs.name} to timeline`);
});
});
});
12 changes: 6 additions & 6 deletions ...t/security_solution_cypress/cypress/e2e/investigations/alerts/changing_alert_status.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ import {
goToOpenedAlerts,
openAlerts,
openFirstAlert,
selectCountTable,
selectAlertsCountTable,
waitForPageFilters,
sumAlertCountFromAlertCountTable,
parseAlertsCountToInt,
Expand Down Expand Up @@ -61,7 +61,7 @@ describe.skip('Changing alert status', { tags: ['@ess', '@skipInServerless'] },
closeAlerts();
waitForAlerts();
waitForPageFilters();
selectCountTable();
selectAlertsCountTable();
});

it.skip('Open one alert when more than one closed alerts are selected', () => {
Expand Down Expand Up @@ -103,7 +103,7 @@ describe.skip('Changing alert status', { tags: ['@ess', '@skipInServerless'] },
goToOpenedAlerts();
waitForAlerts();

selectCountTable();
selectAlertsCountTable();

cy.get(ALERTS_COUNT).should(
'have.text',
Expand All @@ -126,7 +126,7 @@ describe.skip('Changing alert status', { tags: ['@ess', '@skipInServerless'] },
createRule(getNewRule());
visit(ALERTS_URL);
waitForAlertsToPopulate();
selectCountTable();
selectAlertsCountTable();
});
it('Mark one alert as acknowledged when more than one open alerts are selected', () => {
cy.get(ALERTS_COUNT)
Expand Down Expand Up @@ -167,7 +167,7 @@ describe.skip('Changing alert status', { tags: ['@ess', '@skipInServerless'] },
createRule(getNewRule({ rule_id: '1', max_signals: 100 }));
visit(ALERTS_URL);
waitForAlertsToPopulate();
selectCountTable();
selectAlertsCountTable();
});
it.skip('Closes and opens alerts', () => {
const numberOfAlertsToBeClosed = 3;
Expand Down Expand Up @@ -319,7 +319,7 @@ describe.skip('Changing alert status', { tags: ['@ess', '@skipInServerless'] },
createRule(getNewRule());
visit(ALERTS_URL);
waitForAlertsToPopulate();
selectCountTable();
selectAlertsCountTable();
});

it('Mark one alert as acknowledged when more than one open alerts are selected', () => {
Expand Down
2 changes: 0 additions & 2 deletions .../security_solution_cypress/cypress/e2e/investigations/alerts/detection_page_filters.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,6 @@ import {
markAcknowledgedFirstAlert,
openPageFilterPopover,
resetFilters,
selectCountTable,
selectPageFilterValue,
togglePageFilterPopover,
visitAlertsPageWithCustomFilters,
Expand Down Expand Up @@ -236,7 +235,6 @@ describe.skip(`Detections : Page Filters`, { tags: ['@ess', '@serverless'] }, ()
},
() => {
// mark status of one alert to be acknowledged
selectCountTable();
cy.get(ALERTS_COUNT)
.invoke('text')
.then((noOfAlerts) => {
Expand Down
38 changes: 32 additions & 6 deletions x-pack/test/security_solution_cypress/cypress/screens/alerts.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,8 +72,6 @@ export const MESSAGE = '[data-test-subj="formatted-field-message"]';

export const SELECTED_ALERTS = '[data-test-subj="selectedShowBulkActionsButton"]';

export const SELECT_AGGREGATION_CHART = '[data-test-subj="chart-select-table"]';

export const SEND_ALERT_TO_TIMELINE_BTN = '[data-test-subj="send-alert-to-timeline-button"]';

export const OPEN_ANALYZER_BTN = '[data-test-subj="view-in-analyzer"]';
Expand Down Expand Up @@ -131,6 +129,33 @@ export const ACTIONS_EXPAND_BUTTON = '[data-test-subj="euiDataGridCellExpandButt
export const SHOW_TOP_N_HEADER =
'[data-test-subj="topN-container"] [data-test-subj="header-section-title"]';

export const SESSION_VIEWER_BUTTON = '[data-test-subj="session-view-button"]';

export const OVERLAY_CONTAINER = '[data-test-subj="overlayContainer"]';

/**
* Alerts KPIs
*/

export const ALERT_CHARTS_TOGGLE_BUTTON = getDataTestSubjectSelector('query-toggle-header');

export const SELECT_OVERVIEW_CHARTS = getDataTestSubjectSelector('chart-select-charts');

export const ALERT_SUMMARY_CHARTS = getDataTestSubjectSelector('alerts-charts-panel');

export const ALERT_SUMMARY_SEVERITY_DONUT_CHART =
getDataTestSubjectSelector('severity-level-donut');

export const ALERT_SUMMARY_RULES_TABLE = getDataTestSubjectSelector('alerts-by-rule-panel');

export const ALERT_SUMMARY_PROGRESS_BAR_CHARTS = getDataTestSubjectSelector(
'alerts-progress-bar-panel'
);

export const ALERT_SUMMARY_CHARTS_COLLAPSED = getDataTestSubjectSelector('chart-collapse');

export const ALERTS_HISTOGRAM = getDataTestSubjectSelector('alerts-histogram-panel');

export const ALERTS_HISTOGRAM_LEGEND =
'[data-test-subj="alerts-histogram-panel"] .echLegendItem__action';

Expand All @@ -146,12 +171,13 @@ export const LEGEND_ACTIONS = {
COPY: (ruleName: string) => `[data-test-subj="legend-${ruleName}-embeddable_copyToClipboard"]`,
};

export const SESSION_VIEWER_BUTTON = '[data-test-subj="session-view-button"]';
export const ALERT_COUNT_TABLE = getDataTestSubjectSelector('alertsCountPanel');

export const OVERLAY_CONTAINER = '[data-test-subj="overlayContainer"]';
export const SELECT_COUNTS_TABLE = '[data-test-subj="chart-select-table"]';

export const ALERT_SUMMARY_SEVERITY_DONUT_CHART =
getDataTestSubjectSelector('severity-level-donut');
export const SELECT_TREEMAP = getDataTestSubjectSelector('chart-select-treemap');

export const ALERT_TREEMAP = getDataTestSubjectSelector('treemapPanel');

export const ALERT_TAGGING_CONTEXT_MENU_ITEM = '[data-test-subj="alert-tags-context-menu-item"]';

Expand Down
16 changes: 13 additions & 3 deletions x-pack/test/security_solution_cypress/cypress/tasks/alerts.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,9 @@ import {
MARK_ALERT_ACKNOWLEDGED_BTN,
OPEN_ALERT_BTN,
SEND_ALERT_TO_TIMELINE_BTN,
SELECT_AGGREGATION_CHART,
ALERT_CHARTS_TOGGLE_BUTTON,
SELECT_COUNTS_TABLE,
SELECT_TREEMAP,
TAKE_ACTION_POPOVER_BTN,
TIMELINE_CONTEXT_MENU_BTN,
CLOSE_FLYOUT,
Expand Down Expand Up @@ -264,14 +266,22 @@ export const openAlerts = () => {
cy.get(OPEN_ALERT_BTN).click();
};

export const selectCountTable = () => {
cy.get(SELECT_AGGREGATION_CHART).click({ force: true });
export const toggleKPICharts = () => {
cy.get(ALERT_CHARTS_TOGGLE_BUTTON).click();
};

export const selectAlertsCountTable = () => {
cy.get(SELECT_COUNTS_TABLE).click();
};

export const selectAlertsHistogram = () => {
cy.get(SELECT_HISTOGRAM).click();
};

export const selectAlertsTreemap = () => {
cy.get(SELECT_TREEMAP).click();
};

export const goToAcknowledgedAlerts = () => {
/*
* below line commented because alertPageFiltersEnabled feature flag
Expand Down

0 comments on commit 92b8970

Please sign in to comment.