Add assertions to our rule creation test

Asserts that our rule form repopulates with the provided values when
going back to a previous step. This is to cover a regression that was
not caught by CI (but which has now been fixed).

Author: rylnd

x-pack/plugins/security_solution/cypress/integration/alerts_detection_rules_custom.spec.ts

@@ -58,6 +58,8 @@ import {
   createAndActivateRule,
   fillAboutRuleAndContinue,
   fillDefineCustomRuleWithImportedQueryAndContinue,
+  expectDefineFormToRepopulateAndContinue,
+  expectAboutFormToRepopulateAndContinue,
 } from '../tasks/create_new_rule';
 import { esArchiverLoad, esArchiverUnload } from '../tasks/es_archiver';
 import { loginAndWaitForPageWithoutDateRange } from '../tasks/login';
@@ -82,6 +84,8 @@ describe('Detection rules, custom', () => {
     goToCreateNewRule();
     fillDefineCustomRuleWithImportedQueryAndContinue(newRule);
     fillAboutRuleAndContinue(newRule);
+    expectDefineFormToRepopulateAndContinue(newRule);
+    expectAboutFormToRepopulateAndContinue(newRule);
     createAndActivateRule();
 
     cy.get(CUSTOM_RULES_BTN).invoke('text').should('eql', 'Custom rules (1)');

x-pack/plugins/security_solution/cypress/screens/create_new_rule.ts

@@ -6,6 +6,8 @@
 
 export const ABOUT_CONTINUE_BTN = '[data-test-subj="about-continue"]';
 
+export const ABOUT_EDIT_BUTTON = '[data-test-subj="edit-about-rule"]';
+
 export const ADD_FALSE_POSITIVE_BTN =
   '[data-test-subj="detectionEngineStepAboutRuleFalsePositives"] .euiButtonEmpty__text';
 
@@ -26,6 +28,8 @@ export const CUSTOM_QUERY_INPUT = '[data-test-subj="queryInput"]';
 
 export const DEFINE_CONTINUE_BUTTON = '[data-test-subj="define-continue"]';
 
+export const DEFINE_EDIT_BUTTON = '[data-test-subj="edit-define-rule"]';
+
 export const IMPORT_QUERY_FROM_SAVED_TIMELINE_LINK =
   '[data-test-subj="importQueryFromSavedTimeline"]';
 

x-pack/plugins/security_solution/cypress/tasks/create_new_rule.ts

@@ -48,6 +48,8 @@ import {
   THRESHOLD_FIELD_SELECTION,
   THRESHOLD_INPUT_AREA,
   THRESHOLD_TYPE,
+  DEFINE_EDIT_BUTTON,
+  ABOUT_EDIT_BUTTON,
 } from '../screens/create_new_rule';
 import { TIMELINE } from '../screens/timeline';
 
@@ -175,6 +177,20 @@ export const fillDefineCustomRuleWithImportedQueryAndContinue = (
   cy.get(CUSTOM_QUERY_INPUT).should('not.exist');
 };
 
+export const expectDefineFormToRepopulateAndContinue = (rule: CustomRule) => {
+  cy.get(DEFINE_EDIT_BUTTON).click();
+  cy.get(CUSTOM_QUERY_INPUT).invoke('text').should('eq', rule.customQuery);
+  cy.get(DEFINE_CONTINUE_BUTTON).should('exist').click({ force: true });
+  cy.get(DEFINE_CONTINUE_BUTTON).should('not.exist');
+};
+
+export const expectAboutFormToRepopulateAndContinue = (rule: CustomRule) => {
+  cy.get(ABOUT_EDIT_BUTTON).click();
+  cy.get(RULE_NAME_INPUT).invoke('val').should('eq', rule.name);
+  cy.get(ABOUT_CONTINUE_BTN).should('exist').click({ force: true });
+  cy.get(ABOUT_CONTINUE_BTN).should('not.exist');
+};
+
 export const fillDefineThresholdRuleAndContinue = (rule: ThresholdRule) => {
   const thresholdField = 0;
   const threshold = 1;

x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/create/index.tsx

@@ -310,6 +310,7 @@ const CreateRulePageComponent: React.FC = () => {
             extraAction={
               stepsData.current[RuleStep.defineRule].isValid && (
                 <EuiButtonEmpty
+                  data-test-subj="edit-define-rule"
                   iconType="pencil"
                   size="xs"
                   onClick={manageIsEditable.bind(null, RuleStep.defineRule)}
@@ -343,6 +344,7 @@ const CreateRulePageComponent: React.FC = () => {
             extraAction={
               stepsData.current[RuleStep.aboutRule].isValid && (
                 <EuiButtonEmpty
+                  data-test-subj="edit-about-rule"
                   iconType="pencil"
                   size="xs"
                   onClick={manageIsEditable.bind(null, RuleStep.aboutRule)}