Skip to content

Commit

Permalink
[React@18] Fix index management unit tests that are failing with Reac…
Browse files Browse the repository at this point in the history
…t@18 (elastic#208387)

## Summary

Part of elastic#206952

Fixes when run with React@18
elastic#208339 (comment):


[[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
  • Loading branch information
Dosant authored Jan 27, 2025
1 parent 67458e6 commit 9e8ab66
Show file tree
Hide file tree
Showing 2 changed files with 1 addition and 14 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -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();

Expand All @@ -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(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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();
};
Expand Down

0 comments on commit 9e8ab66

Please sign in to comment.