From 41733cbcc8fe00aab3103500f655772a86694438 Mon Sep 17 00:00:00 2001 From: Yara Tercero Date: Sat, 13 Feb 2021 13:41:35 -0800 Subject: [PATCH 1/4] wip - proper loading ui --- .../security_solution/common/constants.ts | 2 +- ...orting.spec.ts => all_rules_table.spec.ts} | 61 ++++++++++++++----- ...table.spec.ts => exceptions_table.spec.ts} | 0 .../cypress/screens/alerts_detection_rules.ts | 8 +++ .../cypress/tasks/alerts_detection_rules.ts | 24 ++++++++ .../detection_engine/rules/all/reducer.ts | 10 ++- .../rules/all/rules_tables.tsx | 55 +++++++++++++---- 7 files changed, 131 insertions(+), 29 deletions(-) rename x-pack/plugins/security_solution/cypress/integration/detection_rules/{sorting.spec.ts => all_rules_table.spec.ts} (72%) rename x-pack/plugins/security_solution/cypress/integration/exceptions/{alerts_detection_exceptions_table.spec.ts => exceptions_table.spec.ts} (100%) diff --git a/x-pack/plugins/security_solution/common/constants.ts b/x-pack/plugins/security_solution/common/constants.ts index 34fcfa5f0befd..a2f56c8be0cea 100644 --- a/x-pack/plugins/security_solution/common/constants.ts +++ b/x-pack/plugins/security_solution/common/constants.ts @@ -42,7 +42,7 @@ export const NO_ALERT_INDEX = 'no-alert-index-049FC71A-4C2C-446F-9901-37XMC5024C export const ENDPOINT_METADATA_INDEX = 'metrics-endpoint.metadata-*'; export const DEFAULT_RULE_REFRESH_INTERVAL_ON = true; export const DEFAULT_RULE_REFRESH_INTERVAL_VALUE = 60000; // ms -export const DEFAULT_RULE_REFRESH_IDLE_VALUE = 2700000; // ms +export const DEFAULT_RULE_REFRESH_IDLE_VALUE = 300000; // ms export const DEFAULT_RULE_NOTIFICATION_QUERY_SIZE = 100; export enum SecurityPageName { diff --git a/x-pack/plugins/security_solution/cypress/integration/detection_rules/sorting.spec.ts b/x-pack/plugins/security_solution/cypress/integration/detection_rules/all_rules_table.spec.ts similarity index 72% rename from x-pack/plugins/security_solution/cypress/integration/detection_rules/sorting.spec.ts rename to x-pack/plugins/security_solution/cypress/integration/detection_rules/all_rules_table.spec.ts index 26d87f9ce9e17..35c21118a4fdc 100644 --- a/x-pack/plugins/security_solution/cypress/integration/detection_rules/sorting.spec.ts +++ b/x-pack/plugins/security_solution/cypress/integration/detection_rules/all_rules_table.spec.ts @@ -12,6 +12,10 @@ import { SECOND_RULE, RULE_AUTO_REFRESH_IDLE_MODAL, FOURTH_RULE, + RULES_TABLE, + FIRST_PAGE_SELECTOR, + SECOND_PAGE_SELECTOR, + FROSTED_LOADING_RULES_TABLE, } from '../../screens/alerts_detection_rules'; import { @@ -21,12 +25,13 @@ import { } from '../../tasks/alerts'; import { activateRule, + changeToFiveRowsPerPage, checkAllRulesIdleModal, checkAutoRefresh, dismissAllRulesIdleModal, + goToSecondPage, resetAllRulesIdleModalTimeout, sortByActivatedRules, - waitForLoadElasticPrebuiltDetectionRulesTableToBeLoaded, waitForRuleToBeActivated, } from '../../tasks/alerts_detection_rules'; import { loginAndWaitForPageWithoutDateRange } from '../../tasks/login'; @@ -47,15 +52,14 @@ describe('Alerts detection rules', () => { createCustomRule(existingRule, '2'); createCustomRule(newOverrideRule, '3'); createCustomRule(newThresholdRule, '4'); + goToManageAlertsDetectionRules(); }); after(() => { cy.clock().invoke('restore'); }); - it('Sorts by activated rules', () => { - goToManageAlertsDetectionRules(); - + xit('Sorts by activated rules', () => { cy.get(RULE_NAME) .eq(SECOND_RULE) .invoke('text') @@ -88,28 +92,55 @@ describe('Alerts detection rules', () => { }); }); - // FIXME: UI hangs on loading - it.skip('Auto refreshes rules', () => { - cy.clock(Date.now()); + it('Pagination updates page number and results', () => { + createCustomRule(newRule, '5'); + createCustomRule({ ...newRule, name: 'Not same as first rule' }, '6'); - loginAndWaitForPageWithoutDateRange(DETECTIONS_URL); - waitForAlertsPanelToBeLoaded(); - waitForAlertsIndexToBeCreated(); - goToManageAlertsDetectionRules(); - waitForLoadElasticPrebuiltDetectionRulesTableToBeLoaded(); + changeToFiveRowsPerPage(); + + cy.get(RULES_TABLE) + .find(FIRST_PAGE_SELECTOR) + .should('have.class', 'euiPaginationButton-isActive'); + + cy.get(RULES_TABLE) + .find(RULE_NAME) + .first() + .invoke('text') + .then((ruleNameFirstPage) => { + goToSecondPage(); + cy.wait(1500); + cy.get(RULES_TABLE) + .find(RULE_NAME) + .first() + .invoke('text') + .should((ruleNameSecondPage) => { + expect(ruleNameFirstPage).not.to.eq(ruleNameSecondPage); + }); + }); + + cy.get(RULES_TABLE) + .find(FIRST_PAGE_SELECTOR) + .should('not.have.class', 'euiPaginationButton-isActive'); + cy.get(RULES_TABLE) + .find(SECOND_PAGE_SELECTOR) + .should('have.class', 'euiPaginationButton-isActive'); + }); + + it('Auto refreshes rules', () => { + cy.clock(Date.now()); // mock 1 minute passing to make sure refresh // is conducted - checkAutoRefresh(DEFAULT_RULE_REFRESH_INTERVAL_VALUE, 'be.visible'); + checkAutoRefresh(60005, 'be.visible'); // mock 45 minutes passing to check that idle modal shows // and refreshing is paused checkAllRulesIdleModal('be.visible'); - checkAutoRefresh(DEFAULT_RULE_REFRESH_INTERVAL_VALUE, 'not.be.visible'); + checkAutoRefresh(60005, 'not.exist'); // clicking on modal to continue, should resume refreshing dismissAllRulesIdleModal(); - checkAutoRefresh(DEFAULT_RULE_REFRESH_INTERVAL_VALUE, 'be.visible'); + checkAutoRefresh(60005, 'be.visible'); // if mouse movement detected, idle modal should not // show after 45 min diff --git a/x-pack/plugins/security_solution/cypress/integration/exceptions/alerts_detection_exceptions_table.spec.ts b/x-pack/plugins/security_solution/cypress/integration/exceptions/exceptions_table.spec.ts similarity index 100% rename from x-pack/plugins/security_solution/cypress/integration/exceptions/alerts_detection_exceptions_table.spec.ts rename to x-pack/plugins/security_solution/cypress/integration/exceptions/exceptions_table.spec.ts diff --git a/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts b/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts index 1a22d14e396ed..2a52be54e9501 100644 --- a/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts +++ b/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts @@ -34,6 +34,8 @@ export const LOAD_PREBUILT_RULES_BTN = '[data-test-subj="load-prebuilt-rules"]'; export const LOADING_INITIAL_PREBUILT_RULES_TABLE = '[data-test-subj="initialLoadingPanelAllRulesTable"]'; +export const FROSTED_LOADING_RULES_TABLE = '[data-test-subj="loadingPanelAllRulesTable"]'; + export const ASYNC_LOADING_PROGRESS = '[data-test-subj="loadingRulesInfoProgress"]'; export const NEXT_BTN = '[data-test-subj="pagination-button-next"]'; @@ -68,6 +70,12 @@ export const SORT_RULES_BTN = '[data-test-subj="tableHeaderSortButton"]'; export const THREE_HUNDRED_ROWS = '[data-test-subj="tablePagination-300-rows"]'; +export const FIVE_ROWS = '[data-test-subj="tablePagination-5-rows"]'; + export const RULE_AUTO_REFRESH_IDLE_MODAL = '[data-test-subj="allRulesIdleModal"]'; export const RULE_AUTO_REFRESH_IDLE_MODAL_CONTINUE = '[data-test-subj="allRulesIdleModal"] button'; + +export const FIRST_PAGE_SELECTOR = '[data-test-subj="pagination-button-0"]'; + +export const SECOND_PAGE_SELECTOR = '[data-test-subj="pagination-button-1"]'; diff --git a/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts b/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts index 799124190b18d..35928c871372d 100644 --- a/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts +++ b/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts @@ -29,6 +29,10 @@ import { ASYNC_LOADING_PROGRESS, RULE_AUTO_REFRESH_IDLE_MODAL, RULE_AUTO_REFRESH_IDLE_MODAL_CONTINUE, + FIVE_ROWS, + SECOND_PAGE_SELECTOR, + FIRST_PAGE_SELECTOR, + FROSTED_LOADING_RULES_TABLE, } from '../screens/alerts_detection_rules'; import { ALL_ACTIONS, DELETE_RULE } from '../screens/rule_details'; @@ -36,6 +40,25 @@ export const activateRule = (rulePosition: number) => { cy.get(RULE_SWITCH).eq(rulePosition).click({ force: true }); }; +export const changeToFiveRowsPerPage = () => { + cy.get(PAGINATION_POPOVER_BTN).click({ force: true }); + cy.get(FIVE_ROWS).click(); + cy.get(FROSTED_LOADING_RULES_TABLE).should('exist'); + cy.get(FROSTED_LOADING_RULES_TABLE).should('not.exist'); +}; + +export const goToSecondPage = () => { + cy.get(SECOND_PAGE_SELECTOR).last().click({ force: true }); + cy.get(FROSTED_LOADING_RULES_TABLE).should('exist'); + cy.get(FROSTED_LOADING_RULES_TABLE).should('not.exist'); +}; + +export const goToFirstPage = () => { + cy.get(FIRST_PAGE_SELECTOR).last().click({ force: true }); + cy.get(FROSTED_LOADING_RULES_TABLE).should('exist'); + cy.get(FROSTED_LOADING_RULES_TABLE).should('not.exist'); +}; + export const changeToThreeHundredRowsPerPage = () => { cy.get(PAGINATION_POPOVER_BTN).click({ force: true }); cy.get(THREE_HUNDRED_ROWS).click(); @@ -125,6 +148,7 @@ export const waitForRuleToBeActivated = () => { export const waitForRulesToBeLoaded = () => { cy.get(ASYNC_LOADING_PROGRESS).should('exist'); + cy.get(FROSTED_LOADING_RULES_TABLE).should('not.exist'); cy.get(ASYNC_LOADING_PROGRESS).should('not.exist'); }; diff --git a/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/reducer.ts b/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/reducer.ts index 60798f10a4c58..ec47451a79bc3 100644 --- a/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/reducer.ts +++ b/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/reducer.ts @@ -25,6 +25,7 @@ export interface State { lastUpdated: number; showIdleModal: boolean; isRefreshOn: boolean; + refreshing: boolean; } export type Action = @@ -41,7 +42,8 @@ export type Action = | { type: 'failure' } | { type: 'setLastRefreshDate' } | { type: 'setShowIdleModal'; show: boolean } - | { type: 'setAutoRefreshOn'; on: boolean }; + | { type: 'setAutoRefreshOn'; on: boolean } + | { type: 'setIsRefreshing'; isRefreshing: boolean }; export const allRulesReducer = ( tableRef: React.MutableRefObject | undefined> @@ -150,6 +152,12 @@ export const allRulesReducer = ( isRefreshOn: action.on, }; } + case 'setIsRefreshing': { + return { + ...state, + refreshing: action.isRefreshing, + }; + } default: return state; } diff --git a/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/rules_tables.tsx b/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/rules_tables.tsx index 89785efbb5047..223b14925eb3d 100644 --- a/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/rules_tables.tsx +++ b/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/rules_tables.tsx @@ -77,6 +77,7 @@ const initialState: State = { lastUpdated: 0, showIdleModal: false, isRefreshOn: true, + refreshing: false, }; interface RulesTableProps { @@ -145,6 +146,7 @@ export const RulesTables = React.memo( lastUpdated, showIdleModal, isRefreshOn, + refreshing, }, dispatch, ] = useReducer(allRulesReducer(tableRef), { @@ -180,6 +182,13 @@ export const RulesTables = React.memo( }); }, []); + const setIsRefreshing = useCallback((isRefreshing: boolean) => { + dispatch({ + type: 'setIsRefreshing', + isRefreshing, + }); + }, []); + const setAutoRefreshOn = useCallback((on: boolean) => { dispatch({ type: 'setAutoRefreshOn', @@ -261,8 +270,9 @@ export const RulesTables = React.memo( }, pagination: { page: page.index + 1, perPage: page.size }, }); + setLastRefreshDate(); }, - [dispatch] + [setLastRefreshDate] ); const rulesColumns = useMemo(() => { @@ -350,13 +360,32 @@ export const RulesTables = React.memo( return false; }, [loadingRuleIds, loadingRulesAction]); + const handleRefreshTable = useCallback( + async (showFrostedLoading: boolean): Promise => { + if (!isLoadingAnActionOnRule) { + setIsRefreshing(showFrostedLoading); + await reFetchRules(); + await refetchPrePackagedRulesStatus(); + setLastRefreshDate(); + setIsRefreshing(false); + } + }, + [ + isLoadingAnActionOnRule, + setIsRefreshing, + reFetchRules, + refetchPrePackagedRulesStatus, + setLastRefreshDate, + ] + ); + + const handleManualRefreshData = useCallback(async (): Promise => { + await handleRefreshTable(false); + }, [handleRefreshTable]); + const handleRefreshData = useCallback(async (): Promise => { - if (!isLoadingAnActionOnRule) { - await reFetchRules(); - await refetchPrePackagedRulesStatus(); - setLastRefreshDate(); - } - }, [reFetchRules, isLoadingAnActionOnRule, setLastRefreshDate, refetchPrePackagedRulesStatus]); + await handleRefreshTable(true); + }, [handleRefreshTable]); const handleResetIdleTimer = useCallback((): void => { if (isRefreshOn) { @@ -447,7 +476,7 @@ export const RulesTables = React.memo( data-test-subj="allRulesPanel" > <> - {(isLoadingRules || isLoadingRulesStatuses) && ( + {refreshing && !initLoading && ( ( )} - {isLoadingAnActionOnRule && !initLoading && ( - - )} + {(loading || isLoadingRules || isLoadingAnActionOnRule) && + !initLoading && + !refreshing && ( + + )} {shouldShowPrepackagedRulesPrompt && ( ( paginationTotal={pagination.total ?? 0} numberSelectedItems={selectedRuleIds.length} onGetBatchItemsPopoverContent={getBatchItemsPopoverContent} - onRefresh={handleRefreshData} + onRefresh={handleManualRefreshData} isAutoRefreshOn={isRefreshOn} onRefreshSwitch={handleAutoRefreshSwitch} showBulkActions From 04fda55492272fdba66b7be82895b29ed5fbb83a Mon Sep 17 00:00:00 2001 From: Yara Tercero Date: Sat, 13 Feb 2021 15:29:06 -0800 Subject: [PATCH 2/4] trying to get cypress tests to work --- ...ll_rules_table.spec.ts => sorting.spec.ts} | 61 +++++-------------- .../cypress/tasks/alerts_detection_rules.ts | 19 ++---- 2 files changed, 21 insertions(+), 59 deletions(-) rename x-pack/plugins/security_solution/cypress/integration/detection_rules/{all_rules_table.spec.ts => sorting.spec.ts} (72%) diff --git a/x-pack/plugins/security_solution/cypress/integration/detection_rules/all_rules_table.spec.ts b/x-pack/plugins/security_solution/cypress/integration/detection_rules/sorting.spec.ts similarity index 72% rename from x-pack/plugins/security_solution/cypress/integration/detection_rules/all_rules_table.spec.ts rename to x-pack/plugins/security_solution/cypress/integration/detection_rules/sorting.spec.ts index 35c21118a4fdc..26d87f9ce9e17 100644 --- a/x-pack/plugins/security_solution/cypress/integration/detection_rules/all_rules_table.spec.ts +++ b/x-pack/plugins/security_solution/cypress/integration/detection_rules/sorting.spec.ts @@ -12,10 +12,6 @@ import { SECOND_RULE, RULE_AUTO_REFRESH_IDLE_MODAL, FOURTH_RULE, - RULES_TABLE, - FIRST_PAGE_SELECTOR, - SECOND_PAGE_SELECTOR, - FROSTED_LOADING_RULES_TABLE, } from '../../screens/alerts_detection_rules'; import { @@ -25,13 +21,12 @@ import { } from '../../tasks/alerts'; import { activateRule, - changeToFiveRowsPerPage, checkAllRulesIdleModal, checkAutoRefresh, dismissAllRulesIdleModal, - goToSecondPage, resetAllRulesIdleModalTimeout, sortByActivatedRules, + waitForLoadElasticPrebuiltDetectionRulesTableToBeLoaded, waitForRuleToBeActivated, } from '../../tasks/alerts_detection_rules'; import { loginAndWaitForPageWithoutDateRange } from '../../tasks/login'; @@ -52,14 +47,15 @@ describe('Alerts detection rules', () => { createCustomRule(existingRule, '2'); createCustomRule(newOverrideRule, '3'); createCustomRule(newThresholdRule, '4'); - goToManageAlertsDetectionRules(); }); after(() => { cy.clock().invoke('restore'); }); - xit('Sorts by activated rules', () => { + it('Sorts by activated rules', () => { + goToManageAlertsDetectionRules(); + cy.get(RULE_NAME) .eq(SECOND_RULE) .invoke('text') @@ -92,55 +88,28 @@ describe('Alerts detection rules', () => { }); }); - it('Pagination updates page number and results', () => { - createCustomRule(newRule, '5'); - createCustomRule({ ...newRule, name: 'Not same as first rule' }, '6'); - - changeToFiveRowsPerPage(); - - cy.get(RULES_TABLE) - .find(FIRST_PAGE_SELECTOR) - .should('have.class', 'euiPaginationButton-isActive'); - - cy.get(RULES_TABLE) - .find(RULE_NAME) - .first() - .invoke('text') - .then((ruleNameFirstPage) => { - goToSecondPage(); - cy.wait(1500); - cy.get(RULES_TABLE) - .find(RULE_NAME) - .first() - .invoke('text') - .should((ruleNameSecondPage) => { - expect(ruleNameFirstPage).not.to.eq(ruleNameSecondPage); - }); - }); - - cy.get(RULES_TABLE) - .find(FIRST_PAGE_SELECTOR) - .should('not.have.class', 'euiPaginationButton-isActive'); - cy.get(RULES_TABLE) - .find(SECOND_PAGE_SELECTOR) - .should('have.class', 'euiPaginationButton-isActive'); - }); - - it('Auto refreshes rules', () => { + // FIXME: UI hangs on loading + it.skip('Auto refreshes rules', () => { cy.clock(Date.now()); + loginAndWaitForPageWithoutDateRange(DETECTIONS_URL); + waitForAlertsPanelToBeLoaded(); + waitForAlertsIndexToBeCreated(); + goToManageAlertsDetectionRules(); + waitForLoadElasticPrebuiltDetectionRulesTableToBeLoaded(); + // mock 1 minute passing to make sure refresh // is conducted - checkAutoRefresh(60005, 'be.visible'); + checkAutoRefresh(DEFAULT_RULE_REFRESH_INTERVAL_VALUE, 'be.visible'); // mock 45 minutes passing to check that idle modal shows // and refreshing is paused checkAllRulesIdleModal('be.visible'); - checkAutoRefresh(60005, 'not.exist'); + checkAutoRefresh(DEFAULT_RULE_REFRESH_INTERVAL_VALUE, 'not.be.visible'); // clicking on modal to continue, should resume refreshing dismissAllRulesIdleModal(); - checkAutoRefresh(60005, 'be.visible'); + checkAutoRefresh(DEFAULT_RULE_REFRESH_INTERVAL_VALUE, 'be.visible'); // if mouse movement detected, idle modal should not // show after 45 min diff --git a/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts b/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts index 35928c871372d..4d57926cf3440 100644 --- a/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts +++ b/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts @@ -31,7 +31,6 @@ import { RULE_AUTO_REFRESH_IDLE_MODAL_CONTINUE, FIVE_ROWS, SECOND_PAGE_SELECTOR, - FIRST_PAGE_SELECTOR, FROSTED_LOADING_RULES_TABLE, } from '../screens/alerts_detection_rules'; import { ALL_ACTIONS, DELETE_RULE } from '../screens/rule_details'; @@ -43,20 +42,10 @@ export const activateRule = (rulePosition: number) => { export const changeToFiveRowsPerPage = () => { cy.get(PAGINATION_POPOVER_BTN).click({ force: true }); cy.get(FIVE_ROWS).click(); - cy.get(FROSTED_LOADING_RULES_TABLE).should('exist'); - cy.get(FROSTED_LOADING_RULES_TABLE).should('not.exist'); }; export const goToSecondPage = () => { - cy.get(SECOND_PAGE_SELECTOR).last().click({ force: true }); - cy.get(FROSTED_LOADING_RULES_TABLE).should('exist'); - cy.get(FROSTED_LOADING_RULES_TABLE).should('not.exist'); -}; - -export const goToFirstPage = () => { - cy.get(FIRST_PAGE_SELECTOR).last().click({ force: true }); - cy.get(FROSTED_LOADING_RULES_TABLE).should('exist'); - cy.get(FROSTED_LOADING_RULES_TABLE).should('not.exist'); + cy.get(SECOND_PAGE_SELECTOR).click({ force: true }); }; export const changeToThreeHundredRowsPerPage = () => { @@ -147,8 +136,12 @@ export const waitForRuleToBeActivated = () => { }; export const waitForRulesToBeLoaded = () => { - cy.get(ASYNC_LOADING_PROGRESS).should('exist'); + cy.get(FROSTED_LOADING_RULES_TABLE).should('exist'); cy.get(FROSTED_LOADING_RULES_TABLE).should('not.exist'); +}; + +export const waitForRulesToBeAutoRefreshed = () => { + cy.get(ASYNC_LOADING_PROGRESS).should('exist'); cy.get(ASYNC_LOADING_PROGRESS).should('not.exist'); }; From 4a337206d5d62c8d94332999931b801d9a5a884a Mon Sep 17 00:00:00 2001 From: Yara Tercero Date: Sat, 13 Feb 2021 15:42:06 -0800 Subject: [PATCH 3/4] removing flakey test --- .../security_solution/common/constants.ts | 2 +- .../cypress/screens/alerts_detection_rules.ts | 8 -------- .../cypress/tasks/alerts_detection_rules.ts | 17 ----------------- 3 files changed, 1 insertion(+), 26 deletions(-) diff --git a/x-pack/plugins/security_solution/common/constants.ts b/x-pack/plugins/security_solution/common/constants.ts index a2f56c8be0cea..34fcfa5f0befd 100644 --- a/x-pack/plugins/security_solution/common/constants.ts +++ b/x-pack/plugins/security_solution/common/constants.ts @@ -42,7 +42,7 @@ export const NO_ALERT_INDEX = 'no-alert-index-049FC71A-4C2C-446F-9901-37XMC5024C export const ENDPOINT_METADATA_INDEX = 'metrics-endpoint.metadata-*'; export const DEFAULT_RULE_REFRESH_INTERVAL_ON = true; export const DEFAULT_RULE_REFRESH_INTERVAL_VALUE = 60000; // ms -export const DEFAULT_RULE_REFRESH_IDLE_VALUE = 300000; // ms +export const DEFAULT_RULE_REFRESH_IDLE_VALUE = 2700000; // ms export const DEFAULT_RULE_NOTIFICATION_QUERY_SIZE = 100; export enum SecurityPageName { diff --git a/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts b/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts index 2a52be54e9501..1a22d14e396ed 100644 --- a/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts +++ b/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts @@ -34,8 +34,6 @@ export const LOAD_PREBUILT_RULES_BTN = '[data-test-subj="load-prebuilt-rules"]'; export const LOADING_INITIAL_PREBUILT_RULES_TABLE = '[data-test-subj="initialLoadingPanelAllRulesTable"]'; -export const FROSTED_LOADING_RULES_TABLE = '[data-test-subj="loadingPanelAllRulesTable"]'; - export const ASYNC_LOADING_PROGRESS = '[data-test-subj="loadingRulesInfoProgress"]'; export const NEXT_BTN = '[data-test-subj="pagination-button-next"]'; @@ -70,12 +68,6 @@ export const SORT_RULES_BTN = '[data-test-subj="tableHeaderSortButton"]'; export const THREE_HUNDRED_ROWS = '[data-test-subj="tablePagination-300-rows"]'; -export const FIVE_ROWS = '[data-test-subj="tablePagination-5-rows"]'; - export const RULE_AUTO_REFRESH_IDLE_MODAL = '[data-test-subj="allRulesIdleModal"]'; export const RULE_AUTO_REFRESH_IDLE_MODAL_CONTINUE = '[data-test-subj="allRulesIdleModal"] button'; - -export const FIRST_PAGE_SELECTOR = '[data-test-subj="pagination-button-0"]'; - -export const SECOND_PAGE_SELECTOR = '[data-test-subj="pagination-button-1"]'; diff --git a/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts b/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts index 4d57926cf3440..799124190b18d 100644 --- a/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts +++ b/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts @@ -29,9 +29,6 @@ import { ASYNC_LOADING_PROGRESS, RULE_AUTO_REFRESH_IDLE_MODAL, RULE_AUTO_REFRESH_IDLE_MODAL_CONTINUE, - FIVE_ROWS, - SECOND_PAGE_SELECTOR, - FROSTED_LOADING_RULES_TABLE, } from '../screens/alerts_detection_rules'; import { ALL_ACTIONS, DELETE_RULE } from '../screens/rule_details'; @@ -39,15 +36,6 @@ export const activateRule = (rulePosition: number) => { cy.get(RULE_SWITCH).eq(rulePosition).click({ force: true }); }; -export const changeToFiveRowsPerPage = () => { - cy.get(PAGINATION_POPOVER_BTN).click({ force: true }); - cy.get(FIVE_ROWS).click(); -}; - -export const goToSecondPage = () => { - cy.get(SECOND_PAGE_SELECTOR).click({ force: true }); -}; - export const changeToThreeHundredRowsPerPage = () => { cy.get(PAGINATION_POPOVER_BTN).click({ force: true }); cy.get(THREE_HUNDRED_ROWS).click(); @@ -136,11 +124,6 @@ export const waitForRuleToBeActivated = () => { }; export const waitForRulesToBeLoaded = () => { - cy.get(FROSTED_LOADING_RULES_TABLE).should('exist'); - cy.get(FROSTED_LOADING_RULES_TABLE).should('not.exist'); -}; - -export const waitForRulesToBeAutoRefreshed = () => { cy.get(ASYNC_LOADING_PROGRESS).should('exist'); cy.get(ASYNC_LOADING_PROGRESS).should('not.exist'); }; From 160fd20694dfd0eaa3b86d6b9e69d18cea775777 Mon Sep 17 00:00:00 2001 From: Yara Tercero Date: Sat, 13 Feb 2021 16:00:25 -0800 Subject: [PATCH 4/4] cleanup --- .../detection_rules/sorting.spec.ts | 40 +++++++++++++++++++ .../cypress/screens/alerts_detection_rules.ts | 6 +++ .../cypress/tasks/alerts_detection_rules.ts | 11 +++++ .../rules/all/reducer.test.ts | 1 + 4 files changed, 58 insertions(+) diff --git a/x-pack/plugins/security_solution/cypress/integration/detection_rules/sorting.spec.ts b/x-pack/plugins/security_solution/cypress/integration/detection_rules/sorting.spec.ts index 26d87f9ce9e17..9cdac29fca690 100644 --- a/x-pack/plugins/security_solution/cypress/integration/detection_rules/sorting.spec.ts +++ b/x-pack/plugins/security_solution/cypress/integration/detection_rules/sorting.spec.ts @@ -12,6 +12,9 @@ import { SECOND_RULE, RULE_AUTO_REFRESH_IDLE_MODAL, FOURTH_RULE, + RULES_TABLE, + FIRST_PAGE_SELECTOR, + SECOND_PAGE_SELECTOR, } from '../../screens/alerts_detection_rules'; import { @@ -21,9 +24,11 @@ import { } from '../../tasks/alerts'; import { activateRule, + changeToFiveRowsPerPage, checkAllRulesIdleModal, checkAutoRefresh, dismissAllRulesIdleModal, + goToSecondPage, resetAllRulesIdleModalTimeout, sortByActivatedRules, waitForLoadElasticPrebuiltDetectionRulesTableToBeLoaded, @@ -88,6 +93,41 @@ describe('Alerts detection rules', () => { }); }); + it('Pagination updates page number and results', () => { + createCustomRule({ ...newRule, name: 'Test a rule' }, '5'); + createCustomRule({ ...newRule, name: 'Not same as first rule' }, '6'); + + goToManageAlertsDetectionRules(); + changeToFiveRowsPerPage(); + + cy.get(RULES_TABLE) + .find(FIRST_PAGE_SELECTOR) + .should('have.class', 'euiPaginationButton-isActive'); + + cy.get(RULES_TABLE) + .find(RULE_NAME) + .first() + .invoke('text') + .then((ruleNameFirstPage) => { + goToSecondPage(); + cy.wait(1500); + cy.get(RULES_TABLE) + .find(RULE_NAME) + .first() + .invoke('text') + .should((ruleNameSecondPage) => { + expect(ruleNameFirstPage).not.to.eq(ruleNameSecondPage); + }); + }); + + cy.get(RULES_TABLE) + .find(FIRST_PAGE_SELECTOR) + .should('not.have.class', 'euiPaginationButton-isActive'); + cy.get(RULES_TABLE) + .find(SECOND_PAGE_SELECTOR) + .should('have.class', 'euiPaginationButton-isActive'); + }); + // FIXME: UI hangs on loading it.skip('Auto refreshes rules', () => { cy.clock(Date.now()); diff --git a/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts b/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts index 1a22d14e396ed..67e4889df64a5 100644 --- a/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts +++ b/x-pack/plugins/security_solution/cypress/screens/alerts_detection_rules.ts @@ -68,6 +68,12 @@ export const SORT_RULES_BTN = '[data-test-subj="tableHeaderSortButton"]'; export const THREE_HUNDRED_ROWS = '[data-test-subj="tablePagination-300-rows"]'; +export const FIVE_ROWS = '[data-test-subj="tablePagination-5-rows"]'; + export const RULE_AUTO_REFRESH_IDLE_MODAL = '[data-test-subj="allRulesIdleModal"]'; export const RULE_AUTO_REFRESH_IDLE_MODAL_CONTINUE = '[data-test-subj="allRulesIdleModal"] button'; + +export const FIRST_PAGE_SELECTOR = '[data-test-subj="pagination-button-0"]'; + +export const SECOND_PAGE_SELECTOR = '[data-test-subj="pagination-button-1"]'; diff --git a/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts b/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts index 799124190b18d..2fb732c981b65 100644 --- a/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts +++ b/x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts @@ -29,6 +29,8 @@ import { ASYNC_LOADING_PROGRESS, RULE_AUTO_REFRESH_IDLE_MODAL, RULE_AUTO_REFRESH_IDLE_MODAL_CONTINUE, + FIVE_ROWS, + SECOND_PAGE_SELECTOR, } from '../screens/alerts_detection_rules'; import { ALL_ACTIONS, DELETE_RULE } from '../screens/rule_details'; @@ -152,3 +154,12 @@ export const resetAllRulesIdleModalTimeout = () => { cy.window().trigger('mousemove', { force: true }); cy.tick(700000); }; + +export const changeToFiveRowsPerPage = () => { + cy.get(PAGINATION_POPOVER_BTN).click({ force: true }); + cy.get(FIVE_ROWS).click(); +}; + +export const goToSecondPage = () => { + cy.get(SECOND_PAGE_SELECTOR).last().click({ force: true }); +}; diff --git a/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/reducer.test.ts b/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/reducer.test.ts index 20e4e5f747349..36df13175d381 100644 --- a/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/reducer.test.ts +++ b/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/reducer.test.ts @@ -32,6 +32,7 @@ const initialState: State = { lastUpdated: 0, showIdleModal: false, isRefreshOn: false, + refreshing: false, }; describe('allRulesReducer', () => {