Expanded functionality tests for New Workflow and Workflow List compo…

…nents.

Signed-off-by: saimedhi <[email protected]>

public/pages/workflow_detail/workflow_detail.test.tsx

@@ -41,7 +41,13 @@ const renderWithRouter = (
 
   return {
     ...render(
-      <Provider store={mockStore([workflowId, workflowName, workflowType])}>
+      <Provider
+        store={mockStore({
+          id: workflowId,
+          name: workflowName,
+          type: workflowType,
+        })}
+      >
         <Router history={history}>
           <Switch>
             <Route
@@ -59,6 +65,9 @@ const renderWithRouter = (
 };
 
 describe('WorkflowDetail Page with create ingestion option', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
   Object.values(WORKFLOW_TYPE).forEach((type) => {
     test(`renders the WorkflowDetail page with ${type} type`, async () => {
       const {
@@ -113,6 +122,9 @@ describe('WorkflowDetail Page with create ingestion option', () => {
 });
 
 describe('WorkflowDetail Page Functionality (Custom Workflow)', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
   test('tests Export button, Tools panel toggling, and Workspace preview', async () => {
     const { getByText, container, getByTestId } = renderWithRouter(
       workflowId,

public/pages/workflows/import_workflow/import_workflow_modal.test.tsx

@@ -38,6 +38,9 @@ const renderWithRouter = () =>
   );
 
 describe('ImportWorkflowModal', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
   test('renders the page', () => {
     const { getAllByText } = renderWithRouter();
     expect(

public/pages/workflows/new_workflow/new_workflow.test.tsx

@@ -14,6 +14,8 @@ import * as ReactReduxHooks from '../../../store/store';
 import '@testing-library/jest-dom';
 import { loadPresetWorkflowTemplates } from '../../../../test/utils';
 import { INITIAL_ML_STATE } from '../../../../public/store';
+import { WORKFLOW_TYPE } from '../../../../common/constants';
+import { capitalizeEachWord } from '../../../../test/utils';
 
 jest.mock('../../../services', () => {
   const { mockCoreServices } = require('../../../../test');
@@ -55,12 +57,11 @@ describe('NewWorkflow', () => {
   test('renders the preset workflow templates', () => {
     const { getByPlaceholderText, getAllByText } = renderWithRouter();
     expect(getByPlaceholderText('Search')).toBeInTheDocument();
-    expect(getAllByText('Custom')).toHaveLength(1);
-    expect(getAllByText('Hybrid Search')).toHaveLength(1);
-    expect(getAllByText('Multimodal Search')).toHaveLength(1);
-    expect(getAllByText('Semantic Search')).toHaveLength(1);
-    expect(getAllByText('Retrieval-Augmented Generation')).toHaveLength(1);
-    expect(getAllByText('Sentiment Analysis')).toHaveLength(1);
+    Object.values(WORKFLOW_TYPE).forEach((type) => {
+      if (type !== WORKFLOW_TYPE.UNKNOWN) {
+        expect(getAllByText(capitalizeEachWord(type))).toHaveLength(1);
+      }
+    });
   });
 
   test('renders the quick configure for preset workflow templates', async () => {

public/pages/workflows/workflow_list/workflow_list.test.tsx

@@ -13,6 +13,7 @@ import { WorkflowList } from './workflow_list';
 import { mockStore } from '../../../../test/utils';
 import { WORKFLOW_TYPE } from '../../../../common';
 import configureStore from 'redux-mock-store';
+import { WorkflowInput } from '../../../../test/interfaces';
 
 jest.mock('../../../services', () => {
   const { mockCoreServices } = require('../../../../test');
@@ -22,22 +23,13 @@ jest.mock('../../../services', () => {
   };
 });
 
-const workflows = new Array(20).fill(null).map((_, index) => ({
+const workflowSet: WorkflowInput[] = Array.from({ length: 20 }, (_, index) => ({
   id: `workflow_id_${index}`,
   name: `workflow_name_${index}`,
   type: Object.values(WORKFLOW_TYPE)[
     Math.floor(Math.random() * Object.values(WORKFLOW_TYPE).length)
   ],
 }));
-const workflowSet: [
-  string,
-  string,
-  WORKFLOW_TYPE
-][] = workflows.map(({ id, name, type }): [string, string, WORKFLOW_TYPE] => [
-  id,
-  name,
-  type,
-]);
 
 const mockStore1 = configureStore([]);
 const initialState = {
@@ -47,6 +39,7 @@ const initialState = {
     workflows: mockStore(...workflowSet).getState().workflows.workflows, // The `mockStore` used here is from the Test Utils.
   },
 };
+
 const store = mockStore1(initialState);
 
 const renderWithRouter = () =>
@@ -61,6 +54,9 @@ const renderWithRouter = () =>
   );
 
 describe('WorkflowList', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
   test('renders the page', () => {
     const { getAllByText } = renderWithRouter();
     expect(getAllByText('Manage existing workflows').length).toBeGreaterThan(0);

public/pages/workflows/workflows.test.tsx

@@ -43,6 +43,9 @@ const renderWithRouter = () => ({
 });
 
 describe('Workflows', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
   test('renders the page', async () => {
     const { getAllByText, getByTestId, queryByText } = renderWithRouter();
 

test/interfaces.ts

@@ -0,0 +1,12 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { WORKFLOW_TYPE } from '../common/constants';
+
+export type WorkflowInput = {
+  id: string;
+  name: string;
+  type: WORKFLOW_TYPE;
+};

test/utils.ts

@@ -9,6 +9,7 @@ import {
   INITIAL_PRESETS_STATE,
   INITIAL_WORKFLOWS_STATE,
 } from '../public/store';
+import { WorkflowInput } from '../test/interfaces';
 import { WORKFLOW_TYPE } from '../common/constants';
 import { UIState, Workflow } from '../common/interfaces';
 import {
@@ -20,23 +21,16 @@ import {
 import fs from 'fs';
 import path from 'path';
 
-export function mockStore(...workflowSets: [string, string, WORKFLOW_TYPE][]) {
+export function mockStore(...workflowSets: WorkflowInput[]) {
   return {
     getState: () => ({
       opensearch: INITIAL_OPENSEARCH_STATE,
       ml: INITIAL_ML_STATE,
       workflows: {
         ...INITIAL_WORKFLOWS_STATE,
         workflows: workflowSets.reduce(
-          (
-            acc: Record<string, Workflow>,
-            [workflowId, workflowName, workflowType]
-          ) => {
-            acc[workflowId] = generateWorkflow(
-              workflowId,
-              workflowName,
-              workflowType
-            );
+          (acc: Record<string, Workflow>, { id, name, type }) => {
+            acc[id] = generateWorkflow(id, name, type);
             return acc;
           },
           {}
@@ -103,6 +97,10 @@ export const loadPresetWorkflowTemplates = () =>
       JSON.parse(fs.readFileSync(path.join(templatesDir, file), 'utf8'))
     );
 
+export function capitalizeEachWord(input: string): string {
+  return input.replace(/\b\w/g, (match) => match.toUpperCase());
+}
+
 export const resizeObserverMock = jest.fn().mockImplementation(() => ({
   observe: jest.fn(),
   unobserve: jest.fn(),