[8.x] [React18] Migrate test suites to account for testing library up…

…grades security-generative-ai (#201160) (#203960) # Backport This will backport the following commits from `main` to `8.x`: - [[React18] Migrate test suites to account for testing library upgrades security-generative-ai (#201160)](#201160)  ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport)  Co-authored-by: Eyo O. Eyo <[email protected]> Co-authored-by: Elastic Machine <[email protected]>
elastic · Dec 13, 2024 · 4b0adec · 4b0adec
1 parent 36c1cd6
commit 4b0adec
Show file tree

Hide file tree

Showing 35 changed files with 390 additions and 409 deletions.
diff --git a/...assistant/impl/assistant/api/anonymization_fields/use_fetch_anonymization_fields.test.tsx b/...assistant/impl/assistant/api/anonymization_fields/use_fetch_anonymization_fields.test.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { act, renderHook } from '@testing-library/react-hooks';
+import { waitFor, renderHook } from '@testing-library/react';
 
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import type { ReactNode } from 'react';
@@ -41,9 +41,7 @@ describe('useFetchAnonymizationFields', () => {
       wrapper: createWrapper(),
     });
 
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => useFetchAnonymizationFields());
-      await waitForNextUpdate();
+    await waitFor(() => {
       expect(http.fetch).toHaveBeenCalledWith(
         '/api/security_ai_assistant/anonymization_fields/_find',
         {

diff --git a/.../packages/kbn-elastic-assistant/impl/assistant/api/capabilities/use_capabilities.test.tsx b/.../packages/kbn-elastic-assistant/impl/assistant/api/capabilities/use_capabilities.test.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { renderHook } from '@testing-library/react-hooks';
+import { renderHook } from '@testing-library/react';
 
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import type { ReactNode } from 'react';

diff --git a/...ck/packages/kbn-elastic-assistant/impl/assistant/api/conversations/conversations.test.tsx b/...ck/packages/kbn-elastic-assistant/impl/assistant/api/conversations/conversations.test.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { act, renderHook } from '@testing-library/react-hooks';
+import { act, waitFor, renderHook } from '@testing-library/react';
 
 import {
   DeleteConversationParams,
@@ -32,18 +32,18 @@ describe('conversations api', () => {
     await act(async () => {
       const deleteProps = { http, toasts, id: 'test' } as unknown as DeleteConversationParams;
 
-      const { waitForNextUpdate } = renderHook(() => deleteConversation(deleteProps));
-      await waitForNextUpdate();
-
-      expect(deleteProps.http.fetch).toHaveBeenCalledWith(
-        '/api/security_ai_assistant/current_user/conversations/test',
-        {
-          method: 'DELETE',
-          signal: undefined,
-          version: '2023-10-31',
-        }
-      );
-      expect(toasts.addError).not.toHaveBeenCalled();
+      renderHook(() => deleteConversation(deleteProps));
+      await waitFor(() => {
+        expect(deleteProps.http.fetch).toHaveBeenCalledWith(
+          '/api/security_ai_assistant/current_user/conversations/test',
+          {
+            method: 'DELETE',
+            signal: undefined,
+            version: '2023-10-31',
+          }
+        );
+        expect(toasts.addError).not.toHaveBeenCalled();
+      });
     });
   });
 
@@ -58,18 +58,18 @@ describe('conversations api', () => {
   it('should call api to get conversation', async () => {
     await act(async () => {
       const getProps = { http, toasts, id: 'test' } as unknown as GetConversationByIdParams;
-      const { waitForNextUpdate } = renderHook(() => getConversationById(getProps));
-      await waitForNextUpdate();
-
-      expect(getProps.http.fetch).toHaveBeenCalledWith(
-        '/api/security_ai_assistant/current_user/conversations/test',
-        {
-          method: 'GET',
-          signal: undefined,
-          version: '2023-10-31',
-        }
-      );
-      expect(toasts.addError).not.toHaveBeenCalled();
+      renderHook(() => getConversationById(getProps));
+      await waitFor(() => {
+        expect(getProps.http.fetch).toHaveBeenCalledWith(
+          '/api/security_ai_assistant/current_user/conversations/test',
+          {
+            method: 'GET',
+            signal: undefined,
+            version: '2023-10-31',
+          }
+        );
+        expect(toasts.addError).not.toHaveBeenCalled();
+      });
     });
   });
 

diff --git a/...-assistant/impl/assistant/api/conversations/use_fetch_current_user_conversations.test.tsx b/...-assistant/impl/assistant/api/conversations/use_fetch_current_user_conversations.test.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { act, renderHook } from '@testing-library/react-hooks';
+import { waitFor, renderHook } from '@testing-library/react';
 
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import type { ReactNode } from 'react';
@@ -41,11 +41,7 @@ describe('useFetchCurrentUserConversations', () => {
       wrapper: createWrapper(),
     });
 
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() =>
-        useFetchCurrentUserConversations(defaultProps)
-      );
-      await waitForNextUpdate();
+    await waitFor(() => {
       expect(defaultProps.http.fetch).toHaveBeenCalledWith(
         '/api/security_ai_assistant/current_user/conversations/_find',
         {

diff --git a/...ackages/kbn-elastic-assistant/impl/assistant/api/evaluate/use_perform_evaluation.test.tsx b/...ackages/kbn-elastic-assistant/impl/assistant/api/evaluate/use_perform_evaluation.test.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { act, renderHook } from '@testing-library/react-hooks';
+import { waitFor, renderHook } from '@testing-library/react';
 import { usePerformEvaluation, UsePerformEvaluationParams } from './use_perform_evaluation';
 import { postEvaluation as _postEvaluation } from './evaluate';
 import { useMutation as _useMutation } from '@tanstack/react-query';
@@ -50,10 +50,8 @@ describe('usePerformEvaluation', () => {
     jest.clearAllMocks();
   });
   it('should call api with undefined evalParams', async () => {
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => usePerformEvaluation(defaultProps));
-      await waitForNextUpdate();
-
+    renderHook(() => usePerformEvaluation(defaultProps));
+    await waitFor(() => {
       expect(defaultProps.http.post).toHaveBeenCalledWith('/internal/elastic_assistant/evaluate', {
         body: undefined,
         headers: {
@@ -80,37 +78,29 @@ describe('usePerformEvaluation', () => {
         opts.onError(e);
       }
     });
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => usePerformEvaluation(defaultProps));
-      await waitForNextUpdate();
 
+    renderHook(() => usePerformEvaluation(defaultProps));
+    await waitFor(() =>
       expect(defaultProps.http.post).toHaveBeenCalledWith('/internal/elastic_assistant/evaluate', {
         body: '{"graphs":["d","c"],"datasetName":"kewl","connectorIds":["h","g"],"runName":"test run"}',
         headers: {
           'Content-Type': 'application/json',
         },
         signal: undefined,
         version: API_VERSIONS.internal.v1,
-      });
-    });
+      })
+    );
   });
 
   it('should return evaluation response', async () => {
-    await act(async () => {
-      const { result, waitForNextUpdate } = renderHook(() => usePerformEvaluation(defaultProps));
-      await waitForNextUpdate();
-
-      await expect(result.current).resolves.toStrictEqual(statusResponse);
-    });
+    const { result } = renderHook(() => usePerformEvaluation(defaultProps));
+    await waitFor(() => expect(result.current).resolves.toStrictEqual(statusResponse));
   });
 
   it('should display error toast when api throws error', async () => {
     postEvaluationMock.mockRejectedValue(new Error('this is an error'));
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => usePerformEvaluation(defaultProps));
-      await waitForNextUpdate();
 
-      expect(toasts.addError).toHaveBeenCalled();
-    });
+    renderHook(() => usePerformEvaluation(defaultProps));
+    await waitFor(() => expect(toasts.addError).toHaveBeenCalled());
   });
 });
diff --git a/...n-elastic-assistant/impl/assistant/api/knowledge_base/use_knowledge_base_indices.test.tsx b/...n-elastic-assistant/impl/assistant/api/knowledge_base/use_knowledge_base_indices.test.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { act, renderHook } from '@testing-library/react-hooks';
+import { waitFor, renderHook } from '@testing-library/react';
 import {
   useKnowledgeBaseIndices,
   UseKnowledgeBaseIndicesParams,
@@ -48,10 +48,8 @@ describe('useKnowledgeBaseIndices', () => {
   });
 
   it('should call api to get knowledge base indices', async () => {
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => useKnowledgeBaseIndices(defaultProps));
-      await waitForNextUpdate();
-
+    renderHook(() => useKnowledgeBaseIndices(defaultProps));
+    await waitFor(() => {
       expect(defaultProps.http.fetch).toHaveBeenCalledWith(
         '/internal/elastic_assistant/knowledge_base/_indices',
         {
@@ -65,20 +63,17 @@ describe('useKnowledgeBaseIndices', () => {
   });
 
   it('should return indices response', async () => {
-    await act(async () => {
-      const { result, waitForNextUpdate } = renderHook(() => useKnowledgeBaseIndices(defaultProps));
-      await waitForNextUpdate();
-
-      await expect(result.current).resolves.toStrictEqual(indicesResponse);
+    const { result } = renderHook(() => useKnowledgeBaseIndices(defaultProps));
+    await waitFor(() => {
+      expect(result.current).resolves.toStrictEqual(indicesResponse);
     });
   });
 
   it('should display error toast when api throws error', async () => {
     getKnowledgeBaseIndicesMock.mockRejectedValue(new Error('this is an error'));
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => useKnowledgeBaseIndices(defaultProps));
-      await waitForNextUpdate();
 
+    renderHook(() => useKnowledgeBaseIndices(defaultProps));
+    await waitFor(() => {
       expect(toasts.addError).toHaveBeenCalled();
     });
   });

diff --git a/...bn-elastic-assistant/impl/assistant/api/knowledge_base/use_knowledge_base_status.test.tsx b/...bn-elastic-assistant/impl/assistant/api/knowledge_base/use_knowledge_base_status.test.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { act, renderHook } from '@testing-library/react-hooks';
+import { waitFor, renderHook } from '@testing-library/react';
 import { useKnowledgeBaseStatus, UseKnowledgeBaseStatusParams } from './use_knowledge_base_status';
 import { getKnowledgeBaseStatus as _getKnowledgeBaseStatus } from './api';
 
@@ -49,10 +49,8 @@ describe('useKnowledgeBaseStatus', () => {
     jest.clearAllMocks();
   });
   it('should call api to get knowledge base status without resource arg', async () => {
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => useKnowledgeBaseStatus(defaultProps));
-      await waitForNextUpdate();
-
+    renderHook(() => useKnowledgeBaseStatus(defaultProps));
+    await waitFor(() => {
       expect(defaultProps.http.fetch).toHaveBeenCalledWith(
         '/internal/elastic_assistant/knowledge_base/',
         {
@@ -65,39 +63,27 @@ describe('useKnowledgeBaseStatus', () => {
     });
   });
   it('should call api to get knowledge base status with resource arg', async () => {
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() =>
-        useKnowledgeBaseStatus({ ...defaultProps, resource: 'something' })
-      );
-      await waitForNextUpdate();
-
+    renderHook(() => useKnowledgeBaseStatus({ ...defaultProps, resource: 'something' }));
+    await waitFor(() =>
       expect(defaultProps.http.fetch).toHaveBeenCalledWith(
         '/internal/elastic_assistant/knowledge_base/something',
         {
           method: 'GET',
           signal: undefined,
           version: '1',
         }
-      );
-    });
+      )
+    );
   });
 
   it('should return status response', async () => {
-    await act(async () => {
-      const { result, waitForNextUpdate } = renderHook(() => useKnowledgeBaseStatus(defaultProps));
-      await waitForNextUpdate();
-
-      await expect(result.current).resolves.toStrictEqual(statusResponse);
-    });
+    const { result } = renderHook(() => useKnowledgeBaseStatus(defaultProps));
+    await waitFor(() => expect(result.current).resolves.toStrictEqual(statusResponse));
   });
 
   it('should display error toast when api throws error', async () => {
     getKnowledgeBaseStatusMock.mockRejectedValue(new Error('this is an error'));
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => useKnowledgeBaseStatus(defaultProps));
-      await waitForNextUpdate();
-
-      expect(toasts.addError).toHaveBeenCalled();
-    });
+    renderHook(() => useKnowledgeBaseStatus(defaultProps));
+    await waitFor(() => expect(toasts.addError).toHaveBeenCalled());
   });
 });
diff --git a/...kbn-elastic-assistant/impl/assistant/api/knowledge_base/use_setup_knowledge_base.test.tsx b/...kbn-elastic-assistant/impl/assistant/api/knowledge_base/use_setup_knowledge_base.test.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { act, renderHook } from '@testing-library/react-hooks';
+import { waitFor, renderHook } from '@testing-library/react';
 import { useSetupKnowledgeBase, UseSetupKnowledgeBaseParams } from './use_setup_knowledge_base';
 import { postKnowledgeBase as _postKnowledgeBase } from './api';
 import { useMutation as _useMutation } from '@tanstack/react-query';
@@ -50,10 +50,8 @@ describe('useSetupKnowledgeBase', () => {
     jest.clearAllMocks();
   });
   it('should call api to post knowledge base setup', async () => {
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => useSetupKnowledgeBase(defaultProps));
-      await waitForNextUpdate();
-
+    renderHook(() => useSetupKnowledgeBase(defaultProps));
+    await waitFor(() => {
       expect(defaultProps.http.fetch).toHaveBeenCalledWith(
         '/internal/elastic_assistant/knowledge_base/',
         {
@@ -73,36 +71,27 @@ describe('useSetupKnowledgeBase', () => {
         opts.onError(e);
       }
     });
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => useSetupKnowledgeBase(defaultProps));
-      await waitForNextUpdate();
 
+    renderHook(() => useSetupKnowledgeBase(defaultProps));
+    await waitFor(() =>
       expect(defaultProps.http.fetch).toHaveBeenCalledWith(
         '/internal/elastic_assistant/knowledge_base/something',
         {
           method: 'POST',
           version: '1',
         }
-      );
-    });
+      )
+    );
   });
 
   it('should return setup response', async () => {
-    await act(async () => {
-      const { result, waitForNextUpdate } = renderHook(() => useSetupKnowledgeBase(defaultProps));
-      await waitForNextUpdate();
-
-      await expect(result.current).resolves.toStrictEqual(statusResponse);
-    });
+    const { result } = renderHook(() => useSetupKnowledgeBase(defaultProps));
+    await waitFor(() => expect(result.current).resolves.toStrictEqual(statusResponse));
   });
 
   it('should display error toast when api throws error', async () => {
     postKnowledgeBaseMock.mockRejectedValue(new Error('this is an error'));
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => useSetupKnowledgeBase(defaultProps));
-      await waitForNextUpdate();
-
-      expect(toasts.addError).toHaveBeenCalled();
-    });
+    renderHook(() => useSetupKnowledgeBase(defaultProps));
+    await waitFor(() => expect(toasts.addError).toHaveBeenCalled());
   });
 });
diff --git a/x-pack/packages/kbn-elastic-assistant/impl/assistant/api/prompts/use_fetch_prompts.test.tsx b/x-pack/packages/kbn-elastic-assistant/impl/assistant/api/prompts/use_fetch_prompts.test.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { act, renderHook } from '@testing-library/react-hooks';
+import { waitFor, renderHook } from '@testing-library/react';
 
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import type { ReactNode } from 'react';
@@ -41,9 +41,7 @@ describe('useFetchPrompts', () => {
       wrapper: createWrapper(),
     });
 
-    await act(async () => {
-      const { waitForNextUpdate } = renderHook(() => useFetchPrompts());
-      await waitForNextUpdate();
+    await waitFor(() => {
       expect(http.fetch).toHaveBeenCalledWith('/api/security_ai_assistant/prompts/_find', {
         method: 'GET',
         query: {