[Ingest pipelines] Polish pipeline debugging workflow (#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';