[7.x] [ML] Functional tests for Additional settings in the Job wizards (#52269)

x-pack/legacy/plugins/ml/public/application/jobs/components/custom_url_editor/editor.tsx

@@ -228,6 +228,7 @@ export const CustomUrlEditor: FC<CustomUrlEditorProps> = ({
             onChange={onLabelChange}
             isInvalid={isInvalidLabel}
             compressed
+            data-test-subj="mlJobCustomUrlLabelInput"
           />
         </EuiFormRow>
         <EuiFormRow

x-pack/legacy/plugins/ml/public/application/jobs/components/custom_url_editor/list.tsx

@@ -144,7 +144,7 @@ export const CustomUrlList: FC<CustomUrlListProps> = ({ job, customUrls, setCust
       : [];
 
     return (
-      <EuiFlexGroup key={`url_${index}`}>
+      <EuiFlexGroup key={`url_${index}`} data-test-subj={`mlJobEditCustomUrlItem_${index}`}>
         <EuiFlexItem grow={false}>
           <EuiFormRow
             label={
@@ -160,6 +160,7 @@ export const CustomUrlList: FC<CustomUrlListProps> = ({ job, customUrls, setCust
               value={label}
               isInvalid={isInvalidLabel}
               onChange={e => onLabelChange(e, index)}
+              data-test-subj={`mlJobEditCustomUrlLabelInput_${index}`}
             />
           </EuiFormRow>
         </EuiFlexItem>
@@ -266,5 +267,5 @@ export const CustomUrlList: FC<CustomUrlListProps> = ({ job, customUrls, setCust
     );
   });
 
-  return <>{customUrlRows}</>;
+  return <div data-test-subj="mlJobEditCustomUrlsList">{customUrlRows}</div>;
 };

x-pack/legacy/plugins/ml/public/application/jobs/jobs_list/components/edit_job_flyout/tabs/custom_urls.tsx

@@ -223,7 +223,11 @@ export class CustomUrls extends Component<CustomUrlsProps, CustomUrlsState> {
         : true;
 
     const addButton = (
-      <EuiButton onClick={this.addNewCustomUrl} isDisabled={!isValidEditorSettings}>
+      <EuiButton
+        onClick={this.addNewCustomUrl}
+        isDisabled={!isValidEditorSettings}
+        data-test-subj="mlJobAddCustomUrl"
+      >
         <FormattedMessage
           id="xpack.ml.jobsList.editJobFlyout.customUrls.addButtonLabel"
           defaultMessage="Add"
@@ -270,7 +274,12 @@ export class CustomUrls extends Component<CustomUrlsProps, CustomUrlsState> {
       </EuiPanel>
     ) : (
       <EuiOverlayMask>
-        <EuiModal onClose={this.closeEditor} initialFocus="[name=label]" style={{ width: 500 }}>
+        <EuiModal
+          onClose={this.closeEditor}
+          initialFocus="[name=label]"
+          style={{ width: 500 }}
+          data-test-subj="mlJobNewCustomUrlFormModal"
+        >
           <EuiModalHeader>
             <EuiModalHeaderTitle>
               <FormattedMessage
@@ -299,7 +308,11 @@ export class CustomUrls extends Component<CustomUrlsProps, CustomUrlsState> {
       <>
         <EuiSpacer size="m" />
         {(!editorOpen || editMode === 'modal') && (
-          <EuiButton size="s" onClick={this.editNewCustomUrl}>
+          <EuiButton
+            size="s"
+            onClick={this.editNewCustomUrl}
+            data-test-subj="mlJobOpenCustomUrlFormButton"
+          >
             <FormattedMessage
               id="xpack.ml.jobsList.editJobFlyout.customUrls.addCustomUrlButtonLabel"
               defaultMessage="Add custom URL"

x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/job_details_step/components/additional_section/additional_section.tsx

@@ -25,21 +25,24 @@ export const AdditionalSection: FC<Props> = ({ additionalExpanded, setAdditional
         buttonContent={ButtonContent}
         onToggle={setAdditionalExpanded}
         initialIsOpen={additionalExpanded}
+        data-test-subj="mlJobWizardToggleAdditionalSettingsSection"
       >
-        <EuiSpacer />
+        <section data-test-subj="mlJobWizardAdditionalSettingsSection">
+          <EuiSpacer />
 
-        <EuiFlexGroup gutterSize="xl" style={{ marginLeft: '0px', marginRight: '0px' }}>
-          <EuiFlexItem>
-            <CustomUrlsSelection />
-          </EuiFlexItem>
-        </EuiFlexGroup>
+          <EuiFlexGroup gutterSize="xl" style={{ marginLeft: '0px', marginRight: '0px' }}>
+            <EuiFlexItem>
+              <CustomUrlsSelection />
+            </EuiFlexItem>
+          </EuiFlexGroup>
 
-        <EuiFlexGroup gutterSize="xl" style={{ marginLeft: '0px', marginRight: '0px' }}>
-          <EuiFlexItem>
-            <CalendarsSelection />
-          </EuiFlexItem>
-          <EuiFlexItem />
-        </EuiFlexGroup>
+          <EuiFlexGroup gutterSize="xl" style={{ marginLeft: '0px', marginRight: '0px' }}>
+            <EuiFlexItem>
+              <CalendarsSelection />
+            </EuiFlexItem>
+            <EuiFlexItem />
+          </EuiFlexGroup>
+        </section>
       </EuiAccordion>
     </Fragment>
   );

x-pack/legacy/plugins/ml/public/application/jobs/new_job/pages/components/job_details_step/components/additional_section/components/calendars/calendars_selection.tsx

@@ -67,7 +67,7 @@ export const CalendarsSelection: FC = () => {
     <Description>
       <EuiFlexGroup gutterSize="xs" alignItems="center">
         <EuiFlexItem>
-          <EuiComboBox {...comboBoxProps} />
+          <EuiComboBox {...comboBoxProps} data-test-subj="mlJobWizardComboBoxCalendars" />
         </EuiFlexItem>
         <EuiFlexItem grow={false}>
           <EuiToolTip

x-pack/test/functional/apps/machine_learning/anomaly_detection/advanced_job.ts

@@ -278,6 +278,7 @@ export default function({ getService }: FtrProviderContext) {
     this.tags(['smoke', 'mlqa']);
     before(async () => {
       await esArchiver.load('ml/ecommerce');
+      await ml.api.createCalendar('wizard-test-calendar');
     });
 
     after(async () => {
@@ -464,6 +465,18 @@ export default function({ getService }: FtrProviderContext) {
           await ml.jobWizardCommon.assertJobGroupSelection(testData.jobGroups);
         });
 
+        it('job creation opens the additional settings section', async () => {
+          await ml.jobWizardCommon.ensureAdditionalSettingsSectionOpen();
+        });
+
+        it('job creation adds a new custom url', async () => {
+          await ml.jobWizardCommon.addCustomUrl({ label: 'check-kibana-dashboard' });
+        });
+
+        it('job creation assigns calendars', async () => {
+          await ml.jobWizardCommon.addCalendar('wizard-test-calendar');
+        });
+
         it('job creation displays the model plot switch', async () => {
           await ml.jobWizardCommon.assertModelPlotSwitchExists({ withAdvancedSection: false });
         });
@@ -709,6 +722,18 @@ export default function({ getService }: FtrProviderContext) {
           await ml.jobWizardCommon.assertJobGroupSelection(testData.jobGroupsClone);
         });
 
+        it('job cloning opens the additional settings section', async () => {
+          await ml.jobWizardCommon.ensureAdditionalSettingsSectionOpen();
+        });
+
+        it('job cloning persists custom urls', async () => {
+          await ml.customUrls.assertCustomUrlItem(0, 'check-kibana-dashboard');
+        });
+
+        it('job cloning persists assigned calendars', async () => {
+          await ml.jobWizardCommon.assertCalendarsSelection(['wizard-test-calendar']);
+        });
+
         it('job cloning pre-fills the model plot switch', async () => {
           await ml.jobWizardCommon.assertModelPlotSwitchExists({ withAdvancedSection: false });
           await ml.jobWizardCommon.assertModelPlotSwitchCheckedState(false, {

x-pack/test/functional/apps/machine_learning/anomaly_detection/multi_metric_job.ts

@@ -75,6 +75,7 @@ export default function({ getService }: FtrProviderContext) {
     this.tags(['smoke', 'mlqa']);
     before(async () => {
       await esArchiver.load('ml/farequote');
+      await ml.api.createCalendar('wizard-test-calendar');
     });
 
     after(async () => {
@@ -170,6 +171,18 @@ export default function({ getService }: FtrProviderContext) {
       await ml.jobWizardCommon.assertJobGroupSelection(jobGroups);
     });
 
+    it('job creation opens the additional settings section', async () => {
+      await ml.jobWizardCommon.ensureAdditionalSettingsSectionOpen();
+    });
+
+    it('job creation adds a new custom url', async () => {
+      await ml.jobWizardCommon.addCustomUrl({ label: 'check-kibana-dashboard' });
+    });
+
+    it('job creation assigns calendars', async () => {
+      await ml.jobWizardCommon.addCalendar('wizard-test-calendar');
+    });
+
     it('job creation opens the advanced section', async () => {
       await ml.jobWizardCommon.ensureAdvancedSectionOpen();
     });
@@ -306,6 +319,18 @@ export default function({ getService }: FtrProviderContext) {
       await ml.jobWizardCommon.assertJobGroupSelection(jobGroupsClone);
     });
 
+    it('job cloning opens the additional settings section', async () => {
+      await ml.jobWizardCommon.ensureAdditionalSettingsSectionOpen();
+    });
+
+    it('job cloning persists custom urls', async () => {
+      await ml.customUrls.assertCustomUrlItem(0, 'check-kibana-dashboard');
+    });
+
+    it('job cloning persists assigned calendars', async () => {
+      await ml.jobWizardCommon.assertCalendarsSelection(['wizard-test-calendar']);
+    });
+
     it('job cloning opens the advanced section', async () => {
       await ml.jobWizardCommon.ensureAdvancedSectionOpen();
     });

x-pack/test/functional/apps/machine_learning/anomaly_detection/population_job.ts

@@ -89,6 +89,7 @@ export default function({ getService }: FtrProviderContext) {
     this.tags(['smoke', 'mlqa']);
     before(async () => {
       await esArchiver.load('ml/ecommerce');
+      await ml.api.createCalendar('wizard-test-calendar');
     });
 
     after(async () => {
@@ -197,6 +198,18 @@ export default function({ getService }: FtrProviderContext) {
       await ml.jobWizardCommon.assertJobGroupSelection(jobGroups);
     });
 
+    it('job creation opens the additional settings section', async () => {
+      await ml.jobWizardCommon.ensureAdditionalSettingsSectionOpen();
+    });
+
+    it('job creation adds a new custom url', async () => {
+      await ml.jobWizardCommon.addCustomUrl({ label: 'check-kibana-dashboard' });
+    });
+
+    it('job creation assigns calendars', async () => {
+      await ml.jobWizardCommon.addCalendar('wizard-test-calendar');
+    });
+
     it('job creation opens the advanced section', async () => {
       await ml.jobWizardCommon.ensureAdvancedSectionOpen();
     });
@@ -344,6 +357,18 @@ export default function({ getService }: FtrProviderContext) {
       await ml.jobWizardCommon.assertJobGroupSelection(jobGroupsClone);
     });
 
+    it('job cloning opens the additional settings section', async () => {
+      await ml.jobWizardCommon.ensureAdditionalSettingsSectionOpen();
+    });
+
+    it('job cloning persists custom urls', async () => {
+      await ml.customUrls.assertCustomUrlItem(0, 'check-kibana-dashboard');
+    });
+
+    it('job cloning persists assigned calendars', async () => {
+      await ml.jobWizardCommon.assertCalendarsSelection(['wizard-test-calendar']);
+    });
+
     it('job cloning opens the advanced section', async () => {
       await ml.jobWizardCommon.ensureAdvancedSectionOpen();
     });