[Ingest pipelines] Polish pipeline debugging workflow (elastic#76058)

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/__jest__/pipeline_processors_editor.helpers.tsx

@@ -126,7 +126,7 @@ const createActions = (testBed: TestBed<TestSubject>) => {
         });
       });
       await act(async () => {
-        find('processorSettingsForm.submitButton').simulate('click');
+        find('addProcessorForm.submitButton').simulate('click');
       });
     },
 
@@ -166,7 +166,7 @@ const createActions = (testBed: TestBed<TestSubject>) => {
         });
       });
       await act(async () => {
-        find('processorSettingsForm.submitButton').simulate('click');
+        find('addProcessorForm.submitButton').simulate('click');
       });
     },
 
@@ -202,8 +202,10 @@ type TestSubject =
   | 'pipelineEditorDoneButton'
   | 'pipelineEditorOnFailureToggle'
   | 'addProcessorsButtonLevel1'
-  | 'processorSettingsForm'
-  | 'processorSettingsForm.submitButton'
+  | 'editProcessorForm'
+  | 'editProcessorForm.submitButton'
+  | 'addProcessorForm.submitButton'
+  | 'addProcessorForm'
   | 'processorOptionsEditor'
   | 'processorSettingsFormFlyout'
   | 'processorTypeSelector'

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/__jest__/pipeline_processors_editor.test.tsx

@@ -180,7 +180,7 @@ describe('Pipeline Editor', () => {
     it('prevents moving a processor while in edit mode', () => {
       const { find, exists } = testBed;
       find('processors>0.manageItemButton').simulate('click');
-      expect(exists('processorSettingsForm')).toBe(true);
+      expect(exists('editProcessorForm')).toBe(true);
       expect(find('processors>0.moveItemButton').props().disabled).toBe(true);
       expect(find('processors>1.moveItemButton').props().disabled).toBe(true);
     });

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/__jest__/test_pipeline.helpers.tsx

@@ -140,8 +140,8 @@ const createActions = (testBed: TestBed<TestSubject>) => {
       component.update();
     },
 
-    clickProcessorOutputTab() {
-      act(() => {
+    async clickProcessorOutputTab() {
+      await act(async () => {
         find('outputTab').simulate('click');
       });
       component.update();
@@ -224,7 +224,8 @@ type TestSubject =
   | 'processorStatusIcon'
   | 'documentsTab'
   | 'manageItemButton'
-  | 'processorSettingsForm'
+  | 'addProcessorForm'
+  | 'editProcessorForm'
   | 'configurationTab'
   | 'outputTab'
   | 'processorOutputTabContent'

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/__jest__/test_pipeline.test.tsx

@@ -44,7 +44,7 @@ describe('Test pipeline', () => {
 
   describe('Test pipeline actions', () => {
     it('should successfully add sample documents and execute the pipeline', async () => {
-      const { find, actions, exists } = testBed;
+      const { actions, exists } = testBed;
 
       httpRequestsMockHelpers.setSimulatePipelineResponse(SIMULATE_RESPONSE);
 
@@ -59,7 +59,6 @@ describe('Test pipeline', () => {
       expect(exists('testPipelineFlyout')).toBe(true);
       expect(exists('documentsTabContent')).toBe(true);
       expect(exists('outputTabContent')).toBe(false);
-      expect(find('outputTab').props().disabled).toEqual(true);
 
       // Add sample documents and click run
       actions.addDocumentsJson(JSON.stringify(DOCUMENTS));
@@ -89,21 +88,25 @@ describe('Test pipeline', () => {
       });
 
       // Verify output tab is active
-      expect(find('outputTab').props().disabled).toEqual(false);
       expect(exists('documentsTabContent')).toBe(false);
       expect(exists('outputTabContent')).toBe(true);
 
       // Click reload button and verify request
       const totalRequests = server.requests.length;
       await actions.clickRefreshOutputButton();
-      expect(server.requests.length).toBe(totalRequests + 1);
+      // There will be two requests made to the simulate API
+      // the second request will have verbose enabled to update the processor results
+      expect(server.requests.length).toBe(totalRequests + 2);
+      expect(server.requests[server.requests.length - 2].url).toBe(
+        '/api/ingest_pipelines/simulate'
+      );
       expect(server.requests[server.requests.length - 1].url).toBe(
         '/api/ingest_pipelines/simulate'
       );
 
       // Click verbose toggle and verify request
       await actions.toggleVerboseSwitch();
-      expect(server.requests.length).toBe(totalRequests + 2);
+      expect(server.requests.length).toBe(totalRequests + 3);
       expect(server.requests[server.requests.length - 1].url).toBe(
         '/api/ingest_pipelines/simulate'
       );
@@ -228,10 +231,10 @@ describe('Test pipeline', () => {
         // Click processor to open manage flyout
         await actions.clickProcessor('processors>0');
         // Verify flyout opened
-        expect(exists('processorSettingsForm')).toBe(true);
+        expect(exists('editProcessorForm')).toBe(true);
 
         // Navigate to "Output" tab
-        actions.clickProcessorOutputTab();
+        await actions.clickProcessorOutputTab();
         // Verify content
         expect(exists('processorOutputTabContent')).toBe(true);
       });

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/index.ts

@@ -4,11 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-export {
-  ManageProcessorForm,
-  ManageProcessorFormOnSubmitArg,
-  OnSubmitHandler,
-} from './manage_processor_form';
+export { ProcessorForm, ProcessorFormOnSubmitArg, OnSubmitHandler } from './processor_form';
 
 export { ProcessorsTree, ProcessorInfo, OnActionHandler } from './processors_tree';
 
@@ -22,6 +18,4 @@ export { OnDoneLoadJsonHandler, LoadFromJsonButton } from './load_from_json';
 
 export { TestPipelineActions } from './test_pipeline';
 
-export { DocumentsDropdown } from './documents_dropdown';
-
 export { PipelineProcessorsItemTooltip, Position } from './pipeline_processors_editor_item_tooltip';