From 9e8ab663b76aa99b9482fb2bbe17f8cf0e1d4238 Mon Sep 17 00:00:00 2001
From: Anton Dosov <anton.dosov@elastic.co>
Date: Mon, 27 Jan 2025 18:21:44 +0100
Subject: [PATCH] [React@18] Fix index management unit tests that are failing
 with React@18 (#208387)

## Summary

Part of https://github.com/elastic/kibana/issues/206952

Fixes when run with React@18
https://github.com/elastic/kibana/pull/208339#issuecomment-2615621371:


[[job]](https://buildkite.com/elastic/kibana-pull-request/builds/270417#0194a78a-2649-4cd6-bac8-5f186c246055)
[[logs]](https://buildkite.com/organizations/elastic/pipelines/kibana-pull-request/builds/270417/jobs/0194a78a-2649-4cd6-bac8-5f186c246055/artifacts/0194a7ae-4701-478b-93ef-9013f7210234)
Jest Integration Tests / request flyout renders _meta field

[[job]](https://buildkite.com/elastic/kibana-pull-request/builds/270417#0194a78a-2649-4cd6-bac8-5f186c246055)
[[logs]](https://buildkite.com/organizations/elastic/pipelines/kibana-pull-request/builds/270417/jobs/0194a78a-2649-4cd6-bac8-5f186c246055/artifacts/0194a7ae-4702-4357-a67e-d59c6bb5f12b)
Jest Integration Tests / request flyout renders a json with default
policy name when only policy name is missing

[[job]](https://buildkite.com/elastic/kibana-pull-request/builds/270417#0194a78a-2649-4cd6-bac8-5f186c246055)
[[logs]](https://buildkite.com/organizations/elastic/pipelines/kibana-pull-request/builds/270417/jobs/0194a78a-2649-4cd6-bac8-5f186c246055/artifacts/0194a7ae-4701-4d18-8c34-1f4965486aa1)
Jest Integration Tests / request flyout renders an error callout if
policy form is invalid

[[job]](https://buildkite.com/elastic/kibana-pull-request/builds/270417#0194a78a-2649-4cd6-bac8-5f186c246055)
[[logs]](https://buildkite.com/organizations/elastic/pipelines/kibana-pull-request/builds/270417/jobs/0194a78a-2649-4cd6-bac8-5f186c246055/artifacts/0194a7ae-4701-4533-9e12-e7056e8277aa)
Jest Integration Tests / request flyout renders the correct json and
name for a new policy



To run with React@18 use:

```
REACT_18=true yarn test:jest_integration x-pack/platform/plugins/private/index_lifecycle_management/integration_tests/edit_policy/features/request_flyout.test.ts
```

I tested that the component works in the browser, so the issue is in the
test. I think that because of some internal React@18 changes the order
in which the validation timeout inside our form lib is called conflcts
with fake timers (the timeout just stucks). So instead of trying to add
additional `jest.advanceTimersByTime(0);` in some places I decided to
simplify and just use the real timeouts that works well for both
react@17 an react@18
---
 .../edit_policy/features/request_flyout.test.ts    | 14 +-------------
 .../helpers/actions/request_flyout_actions.ts      |  1 -
 2 files changed, 1 insertion(+), 14 deletions(-)

diff --git a/x-pack/platform/plugins/private/index_lifecycle_management/integration_tests/edit_policy/features/request_flyout.test.ts b/x-pack/platform/plugins/private/index_lifecycle_management/integration_tests/edit_policy/features/request_flyout.test.ts
index 25bbdafda2506..a94f9137cfc65 100644
--- a/x-pack/platform/plugins/private/index_lifecycle_management/integration_tests/edit_policy/features/request_flyout.test.ts
+++ b/x-pack/platform/plugins/private/index_lifecycle_management/integration_tests/edit_policy/features/request_flyout.test.ts
@@ -14,14 +14,6 @@ describe('<EditPolicy /> request flyout', () => {
   let testBed: RequestFlyoutTestBed;
   const { httpSetup, httpRequestsMockHelpers } = setupEnvironment();
 
-  beforeAll(() => {
-    jest.useFakeTimers({ legacyFakeTimers: true });
-  });
-
-  afterAll(() => {
-    jest.useRealTimers();
-  });
-
   beforeEach(async () => {
     httpRequestsMockHelpers.setDefaultResponses();
 
@@ -34,12 +26,8 @@ describe('<EditPolicy /> request flyout', () => {
   });
 
   test('renders a json in flyout for a default policy', async () => {
-    const { actions, component } = testBed;
+    const { actions } = testBed;
     await actions.openRequestFlyout();
-    await act(async () => {
-      jest.advanceTimersByTime(0); // allow the flyout to open and form validation to run
-    });
-    component.update();
 
     const json = actions.getRequestJson();
     const expected = `PUT _ilm/policy/my_policy\n${JSON.stringify(
diff --git a/x-pack/platform/plugins/private/index_lifecycle_management/integration_tests/helpers/actions/request_flyout_actions.ts b/x-pack/platform/plugins/private/index_lifecycle_management/integration_tests/helpers/actions/request_flyout_actions.ts
index f8004f0076788..ca79d52741595 100644
--- a/x-pack/platform/plugins/private/index_lifecycle_management/integration_tests/helpers/actions/request_flyout_actions.ts
+++ b/x-pack/platform/plugins/private/index_lifecycle_management/integration_tests/helpers/actions/request_flyout_actions.ts
@@ -15,7 +15,6 @@ export const createRequestFlyoutActions = (testBed: TestBed) => {
   const openRequestFlyout = async () => {
     await act(async () => {
       find('requestButton').simulate('click');
-      jest.advanceTimersByTime(0); // Wait for the flyout to open and form validation to run
     });
     component.update();
   };