Add CIT for Date Index Processor in Ingest Node Pipelines

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/__jest__/processors/date_index.test.tsx

@@ -0,0 +1,124 @@
+/*
+ * 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.
+ */
+
+import { act } from 'react-dom/test-utils';
+import { setup, SetupResult, getProcessorValue } from './processor.helpers';
+
+const DATE_INDEX_TYPE = 'date_index_name';
+
+describe('Processor: Date Index', () => {
+  let onUpdate: jest.Mock;
+  let testBed: SetupResult;
+
+  beforeAll(() => {
+    jest.useFakeTimers();
+  });
+
+  afterAll(() => {
+    jest.useRealTimers();
+  });
+
+  beforeEach(async () => {
+    onUpdate = jest.fn();
+
+    await act(async () => {
+      testBed = await setup({
+        value: {
+          processors: [],
+        },
+        onFlyoutOpen: jest.fn(),
+        onUpdate,
+      });
+    });
+    testBed.component.update();
+    const {
+      actions: { addProcessor, addProcessorType },
+    } = testBed;
+    // Open the processor flyout
+    addProcessor();
+
+    // Add type (the other fields are not visible until a type is selected)
+    await addProcessorType(DATE_INDEX_TYPE);
+  });
+
+  test('prevents form submission if required fields are not provided', async () => {
+    const {
+      actions: { saveNewProcessor },
+      form,
+    } = testBed;
+
+    // Click submit button with only the type defined
+    await saveNewProcessor();
+
+    // Expect form error as "field" and "date rounding" are required parameters
+    expect(form.getErrorsMessages()).toEqual([
+      'A field value is required.',
+      'A date rounding value is required.',
+    ]);
+  });
+
+  test('saves with required field and date rounding parameter values', async () => {
+    const {
+      actions: { saveNewProcessor },
+      form,
+    } = testBed;
+
+    // Add "field" value (required)
+    form.setInputValue('fieldNameField.input', '@timestamp');
+
+    // Select second value for date rounding
+    form.setSelectValue('dateRoundingField', 's');
+
+    // Save the field
+    await saveNewProcessor();
+
+    const processors = await getProcessorValue(onUpdate, DATE_INDEX_TYPE);
+    expect(processors[0].date_index_name).toEqual({
+      field: '@timestamp',
+      date_rounding: 's',
+    });
+  });
+
+  test('allows optional parameters to be set', async () => {
+    const {
+      actions: { saveNewProcessor },
+      form,
+      find,
+      component,
+    } = testBed;
+
+    form.setInputValue('fieldNameField.input', 'field_1');
+
+    form.setSelectValue('dateRoundingField', 'd');
+
+    form.setInputValue('indexNamePrefixField.input', 'prefix');
+
+    form.setInputValue('indexNameFormatField.input', 'yyyy-MM');
+
+    await act(async () => {
+      find('dateFormatsField.input').simulate('change', [{ label: 'ISO8601' }]);
+    });
+    component.update();
+
+    form.setInputValue('timezoneField.input', 'GMT');
+
+    form.setInputValue('localeField.input', 'SPANISH');
+    // Save the field with new changes
+    await saveNewProcessor();
+
+    const processors = await getProcessorValue(onUpdate, DATE_INDEX_TYPE);
+    expect(processors[0].date_index_name).toEqual({
+      field: 'field_1',
+      date_rounding: 'd',
+      index_name_format: 'yyyy-MM',
+      index_name_prefix: 'prefix',
+      date_formats: ['ISO8601'],
+      locale: 'SPANISH',
+      timezone: 'GMT',
+    });
+  });
+});

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/__jest__/processors/processor.helpers.tsx

@@ -144,8 +144,14 @@ type TestSubject =
   | 'mockCodeEditor'
   | 'tagField.input'
   | 'typeSelectorField'
+  | 'dateRoundingField'
   | 'ignoreMissingSwitch.input'
   | 'ignoreFailureSwitch.input'
+  | 'indexNamePrefixField.input'
+  | 'indexNameFormatField.input'
+  | 'dateFormatsField.input'
+  | 'timezoneField.input'
+  | 'localeField.input'
   | 'ifField.textarea'
   | 'targetField.input'
   | 'keepOriginalField.input'

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/processor_form/processors/date_index_name.tsx

@@ -47,7 +47,7 @@ const fieldsConfig: FieldsConfig = {
           i18n.translate(
             'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateRoundingRequiredError',
             {
-              defaultMessage: 'A field value is required.',
+              defaultMessage: 'A date rounding value is required.',
             }
           )
         ),
@@ -160,6 +160,7 @@ export const DateIndexName: FunctionComponent = () => {
         component={SelectField}
         componentProps={{
           euiFieldProps: {
+            'data-test-subj': 'dateRoundingField',
             options: [
               {
                 value: 'y',
@@ -217,26 +218,39 @@ export const DateIndexName: FunctionComponent = () => {
       />
 
       <UseField
+        data-test-subj="indexNamePrefixField"
         config={fieldsConfig.index_name_prefix}
         component={Field}
         path="fields.index_name_prefix"
       />
 
       <UseField
+        data-test-subj="indexNameFormatField"
         config={fieldsConfig.index_name_format}
         component={Field}
         path="fields.index_name_format"
       />
 
       <UseField
+        data-test-subj="dateFormatsField"
         config={fieldsConfig.date_formats}
         component={ComboBoxField}
         path="fields.date_formats"
       />
 
-      <UseField config={fieldsConfig.timezone} component={Field} path="fields.timezone" />
+      <UseField
+        data-test-subj="timezoneField"
+        config={fieldsConfig.timezone}
+        component={Field}
+        path="fields.timezone"
+      />
 
-      <UseField config={fieldsConfig.locale} component={Field} path="fields.locale" />
+      <UseField
+        data-test-subj="localeField"
+        config={fieldsConfig.locale}
+        component={Field}
+        path="fields.locale"
+      />
     </>
   );
 };