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

…grades kibana-cloud-security-posture (#201159) (#201324) # Backport This will backport the following commits from `main` to `8.x`: - [[React18] Migrate test suites to account for testing library upgrades kibana-cloud-security-posture (#201159)](#201159)  ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport)  Co-authored-by: Eyo O. Eyo <[email protected]>
elastic · Nov 22, 2024 · bf6d847 · bf6d847
1 parent ac4caed
commit bf6d847
Show file tree

Hide file tree

Showing 7 changed files with 51 additions and 50 deletions.
diff --git a/x-pack/packages/kbn-cloud-security-posture/public/src/hooks/use_navigate_findings.test.ts b/x-pack/packages/kbn-cloud-security-posture/public/src/hooks/use_navigate_findings.test.ts
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { renderHook, act } from '@testing-library/react-hooks/dom';
+import { renderHook, act } from '@testing-library/react';
 import { useNavigateVulnerabilities, useNavigateFindings } from './use_navigate_findings';
 import { useHistory } from 'react-router-dom';
 

diff --git a/...k/plugins/cloud_security_posture/public/common/hooks/use_benchmark_dynamic_values.test.ts b/...k/plugins/cloud_security_posture/public/common/hooks/use_benchmark_dynamic_values.test.ts
@@ -6,7 +6,7 @@
  */
 
 import { useBenchmarkDynamicValues } from './use_benchmark_dynamic_values';
-import { renderHook } from '@testing-library/react-hooks/dom';
+import { renderHook } from '@testing-library/react';
 import type { BenchmarksCisId } from '@kbn/cloud-security-posture-common';
 import { useCspIntegrationLink } from '../navigation/use_csp_integration_link';
 

diff --git a/x-pack/plugins/cloud_security_posture/public/common/hooks/use_url_query.test.ts b/x-pack/plugins/cloud_security_posture/public/common/hooks/use_url_query.test.ts
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { renderHook, act } from '@testing-library/react-hooks/dom';
+import { renderHook, act } from '@testing-library/react';
 import { useUrlQuery } from './use_url_query';
 import { useLocation, useHistory } from 'react-router-dom';
 import { encodeQuery } from '@kbn/cloud-security-posture';

diff --git a/...public/components/fleet_extensions/setup_technology_selector/use_setup_technology.test.ts b/...public/components/fleet_extensions/setup_technology_selector/use_setup_technology.test.ts
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { renderHook, act } from '@testing-library/react-hooks';
+import { renderHook, act } from '@testing-library/react';
 
 import { SetupTechnology } from '@kbn/fleet-plugin/public';
 import { AgentPolicy, NewPackagePolicyInput } from '@kbn/fleet-plugin/common';

diff --git a/x-pack/plugins/cloud_security_posture/public/pages/rules/use_change_csp_rule_state.test.tsx b/x-pack/plugins/cloud_security_posture/public/pages/rules/use_change_csp_rule_state.test.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 import React from 'react';
-import { act, renderHook } from '@testing-library/react-hooks';
+import { act, waitFor, renderHook } from '@testing-library/react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { useKibana } from '@kbn/kibana-react-plugin/public';
 import type { RuleStateAttributes } from '@kbn/cloud-security-posture-common/schema/rules/v4';
@@ -87,7 +87,7 @@ describe('use_change_csp_rule_state', () => {
     const appMockRender = testWrapper();
     const httpPostSpy = jest.spyOn(useKibana().services.http!, 'post');
 
-    const { result, waitForNextUpdate } = await renderHook(() => useChangeCspRuleState(), {
+    const { result } = await renderHook(() => useChangeCspRuleState(), {
       wrapper: appMockRender.wrapper,
     });
 
@@ -107,22 +107,22 @@ describe('use_change_csp_rule_state', () => {
       result.current.mutate(mockRuleStateUpdateRequest);
     });
 
-    await waitForNextUpdate();
-
-    expect(httpPostSpy).toHaveBeenCalledWith(CSP_BENCHMARK_RULES_BULK_ACTION_ROUTE_PATH, {
-      version: '1',
-      body: JSON.stringify({
-        action: 'mute',
-        rules: [
-          {
-            benchmark_id: 'benchmark_id',
-            benchmark_version: 'benchmark_version',
-            rule_number: '1',
-            rule_id: 'rule_1',
-          },
-        ],
-      }),
-    });
+    await waitFor(() =>
+      expect(httpPostSpy).toHaveBeenCalledWith(CSP_BENCHMARK_RULES_BULK_ACTION_ROUTE_PATH, {
+        version: '1',
+        body: JSON.stringify({
+          action: 'mute',
+          rules: [
+            {
+              benchmark_id: 'benchmark_id',
+              benchmark_version: 'benchmark_version',
+              rule_number: '1',
+              rule_id: 'rule_1',
+            },
+          ],
+        }),
+      })
+    );
   });
 
   it('should cancel queries and update query data onMutate', async () => {
@@ -131,7 +131,7 @@ describe('use_change_csp_rule_state', () => {
     const queryClientGetSpy = jest.spyOn(appMockRender.queryClient, 'getQueryData');
     const mockSetQueryDataSpy = jest.spyOn(appMockRender.queryClient, 'setQueryData');
 
-    const { result, waitForNextUpdate } = await renderHook(() => useChangeCspRuleState(), {
+    const { result } = await renderHook(() => useChangeCspRuleState(), {
       wrapper: appMockRender.wrapper,
     });
 
@@ -151,24 +151,24 @@ describe('use_change_csp_rule_state', () => {
       result.current.mutate(mockRuleStateUpdateRequest);
     });
 
-    await waitForNextUpdate();
-
-    const expectedMutatedRules = {
-      ...initialRules,
-      rule_1: { ...initialRules.rule_1, muted: true },
-    };
+    await waitFor(() => {
+      const expectedMutatedRules = {
+        ...initialRules,
+        rule_1: { ...initialRules.rule_1, muted: true },
+      };
 
-    expect(queryClientSpy).toHaveBeenCalled();
-    expect(queryClientGetSpy).toHaveBeenCalled();
-    expect(mockSetQueryDataSpy).toHaveBeenCalled();
-    expect(mockSetQueryDataSpy).toHaveReturnedWith(expectedMutatedRules);
+      expect(queryClientSpy).toHaveBeenCalled();
+      expect(queryClientGetSpy).toHaveBeenCalled();
+      expect(mockSetQueryDataSpy).toHaveBeenCalled();
+      expect(mockSetQueryDataSpy).toHaveReturnedWith(expectedMutatedRules);
+    });
   });
 
   it('should invalidate queries onSettled', async () => {
     const appMockRender = testWrapper();
     const mockInvalidateQueriesSpy = jest.spyOn(appMockRender.queryClient, 'invalidateQueries');
 
-    const { result, waitForNextUpdate } = await renderHook(() => useChangeCspRuleState(), {
+    const { result } = await renderHook(() => useChangeCspRuleState(), {
       wrapper: appMockRender.wrapper,
     });
 
@@ -188,19 +188,19 @@ describe('use_change_csp_rule_state', () => {
       result.current.mutate(mockRuleStateUpdateRequest);
     });
 
-    await waitForNextUpdate();
-
-    expect(mockInvalidateQueriesSpy).toHaveBeenCalledWith(BENCHMARK_INTEGRATION_QUERY_KEY_V2);
-    expect(mockInvalidateQueriesSpy).toHaveBeenCalledWith(CSPM_STATS_QUERY_KEY);
-    expect(mockInvalidateQueriesSpy).toHaveBeenCalledWith(KSPM_STATS_QUERY_KEY);
-    expect(mockInvalidateQueriesSpy).toHaveBeenCalledWith(CSP_RULES_STATES_QUERY_KEY);
+    await waitFor(() => {
+      expect(mockInvalidateQueriesSpy).toHaveBeenCalledWith(BENCHMARK_INTEGRATION_QUERY_KEY_V2);
+      expect(mockInvalidateQueriesSpy).toHaveBeenCalledWith(CSPM_STATS_QUERY_KEY);
+      expect(mockInvalidateQueriesSpy).toHaveBeenCalledWith(KSPM_STATS_QUERY_KEY);
+      expect(mockInvalidateQueriesSpy).toHaveBeenCalledWith(CSP_RULES_STATES_QUERY_KEY);
+    });
   });
 
   it('should restore previous query data onError', async () => {
     const appMockRender = testWrapper();
     const mockSetQueryDataSpy = jest.spyOn(appMockRender.queryClient, 'setQueryData');
 
-    const { result, waitForNextUpdate } = await renderHook(() => useChangeCspRuleState(), {
+    const { result } = await renderHook(() => useChangeCspRuleState(), {
       wrapper: appMockRender.wrapper,
     });
 
@@ -221,13 +221,13 @@ describe('use_change_csp_rule_state', () => {
       result.current.mutate(mockRuleStateUpdateRequest);
     });
 
-    await waitForNextUpdate();
-
-    expect(mockSetQueryDataSpy).toHaveBeenCalled();
-    expect(mockSetQueryDataSpy).toHaveReturnedWith(initialRules);
+    await waitFor(() => {
+      expect(mockSetQueryDataSpy).toHaveBeenCalled();
+      expect(mockSetQueryDataSpy).toHaveReturnedWith(initialRules);
+    });
   });
 
-  it('creates the new set of cache rules in a muted state when calling createRulesWithUpdatedState', async () => {
+  it('creates the new set of cache rules in a muted state when calling createRulesWithUpdatedState', () => {
     const request: RuleStateUpdateRequest = {
       newState: 'mute',
       ruleIds: [
@@ -267,7 +267,7 @@ describe('use_change_csp_rule_state', () => {
     expect(newRulesState).toEqual({ ...initialRules, ...updateRules });
   });
 
-  it('creates the new cache with rules in a unmute state', async () => {
+  it('creates the new cache with rules in a unmute state', () => {
     const initialMutedRules: Record<string, RuleStateAttributes> = {
       rule_1: {
         benchmark_id: 'benchmark_id',

diff --git a/x-pack/plugins/session_view/public/components/tty_player/hooks.test.tsx b/x-pack/plugins/session_view/public/components/tty_player/hooks.test.tsx
@@ -4,7 +4,8 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
-import { renderHook, act } from '@testing-library/react-hooks';
+
+import { renderHook, act } from '@testing-library/react';
 import { sessionViewIOEventsMock } from '../../../common/mocks/responses/session_view_io_events.mock';
 import { useIOLines, useXtermPlayer, XtermPlayerDeps } from './hooks';
 import type { ProcessEventsPage } from '../../../common';
@@ -31,7 +32,7 @@ describe('TTYPlayer/hooks', () => {
 
       // test memoization
       let last = result.current.lines;
-      rerender();
+      rerender({ pages: initial });
       expect(result.current.lines === last).toBeTruthy();
       last = result.current.lines;
       rerender({ pages: [...initial] });

diff --git a/x-pack/plugins/session_view/public/components/tty_search_bar/index.test.tsx b/x-pack/plugins/session_view/public/components/tty_search_bar/index.test.tsx
@@ -5,7 +5,7 @@
  * 2.0.
  */
 import React from 'react';
-import { renderHook } from '@testing-library/react-hooks';
+import { renderHook } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { AppContextTestRender, createAppRootMockRenderer } from '../../test';
 import { sessionViewIOEventsMock } from '../../../common/mocks/responses/session_view_io_events.mock';