[Management][Es Ui Shared][Kbn Management] Migrate Enzyme to RTL by kapral18 · Pull Request #238764 · elastic/kibana

kapral18 · 2025-10-14T07:11:17Z

Summary

This PR migrates the first batch of test files from Enzyme to React Testing Library (RTL) as part of the effort to remove Enzyme dependencies from the Kibana codebase.

Addresses #222608

Migration Details

Enzyme → RTL API Changes:

Replaced shallow() / mount() with RTL's render()
Replaced shallowWithIntl / mountWithIntl with renderWithI18n
Replaced .find() with screen.getByTestId() / screen.getByLabelText()
Replaced .simulate() with userEvent interactions
Removed wrapper.update() calls (unnecessary in RTL)
Removed Enzyme type imports (ShallowWrapper, ReactWrapper)

Modern Testing Patterns:

Added Jest modern fake timers setup (jest.useFakeTimers())
Configured userEvent.setup({ advanceTimers: jest.advanceTimersByTime })
Replaced waitFor() polling with direct assertions using timer control
Implemented "Start → Flush → Await" pattern for async operations with internal timers
Added proper act() wrapping for state-changing operations
All tests now use async/await for user interactions

TypeScript Fixes:

Fixed context provider type issues in landing.test.tsx
Ensured all required AppDependencies props are provided
Removed unused imports and fixed linting issues

Snapshot Updates:

Updated all snapshots to reflect RTL's rendering output format

Testing

✅ All migrated tests pass locally
✅ Zero console warnings (verified with NODE_ENV=development)
✅ TypeScript compilation successful
✅ ESLint passes with no errors
✅ Snapshots updated and validated

Performance Improvements

Tests are now faster and more deterministic:

No polling with waitFor() - direct assertions with timer control
Fake timers eliminate real-time waiting
More reliable in CI environments

Checklist

Removed all Enzyme dependencies from test files
Added modern fake timer setup
Configured userEvent with timer advancement
Replaced waitFor() with timer control
All tests pass with zero warnings
TypeScript compiles without errors
ESLint passes
Snapshots updated
Helper files migrated where needed

Next Steps

This is the first batch. Subsequent batches will continue migrating the remaining test files listed in issue #222608.

elasticmachine · 2025-10-14T07:13:46Z

Pinging @elastic/kibana-management (Team:Kibana Management)

sabarasaba

Awesome job @kapral18! This is one of those PRs that I read and go like: "why didnt we do this before?!!" 🥳

src/platform/plugins/shared/es_ui_shared/public/request/use_request.test.helpers.tsx

...lugins/shared/es_ui_shared/static/forms/hook_form_lib/components/form_data_provider.test.tsx

This commit migrates 17 test files from Enzyme to React Testing Library (RTL), removing dependencies on enzyme and the registerTestBed test utility. Changes include: - Replaced enzyme's shallow/mount with RTL's render - Migrated from registerTestBed to direct RTL rendering for hook and component tests - Updated test utilities to use @testing-library/react and @testing-library/user-event - Fixed async testing patterns with waitFor and proper act() wrapping - Resolved fake timers compatibility issues with userEvent - Added proper event handling with fireEvent and userEvent where appropriate - Updated all snapshots to reflect RTL rendering output Affected test files: - query_input.test.tsx - cron_editor.test.tsx - view_api_request_flyout.test.tsx - use_request.test.ts and helpers - form_data_provider.test.tsx - use_array.test.tsx - use_field.test.tsx (component and hook tests) - use_multi_fields.test.tsx - use_form.test.tsx - use_form_data.test.tsx - use_form_is_modified.test.tsx - landing.test.tsx All tests are now passing with the new RTL implementation.

These exports are no longer used after migrating all tests from Enzyme to RTL. Only keeping getRandomString export which is still used in test files.

elasticmachine · 2025-10-20T19:59:24Z

💛 Build succeeded, but was flaky

Buildkite Build
Commit: 9cd8944

Failed CI Steps

FTR Configs #87

Test Failures

[job] [logs] FTR Configs #87 / Cases - group 1 View case Assignees field logs in with default user and creates case before each removes an assigned user

Metrics [docs]

Count of Enzyme imports

Enzyme is no longer supported, and we should switch to @testing-library/react instead.

id	before	after	diff
`esUiShared`	2	0	-2

Unknown metric groups

References to deprecated APIs

id	before	after	diff
`esUiShared`	1	0	-1

History

💚 Build #352601 succeeded 1f2c593
💛 Build #352366 was flaky c6fe547
💚 Build #351024 succeeded d861da7
💛 Build #350951 was flaky 2ce3a5f
💛 Build #350602 was flaky 30753d4

sabarasaba

latest lgtm, nice job!

…stic#238764) ## Summary This PR migrates the first batch of test files from Enzyme to React Testing Library (RTL) as part of the effort to remove Enzyme dependencies from the Kibana codebase. Addresses elastic#22260 ### Migration Details **Enzyme → RTL API Changes:** - Replaced `shallow()` / `mount()` with RTL's `render()` - Replaced `shallowWithIntl` / `mountWithIntl` with `renderWithI18n` - Replaced `.find()` with `screen.getByTestId()` / `screen.getByLabelText()` - Replaced `.simulate()` with `userEvent` interactions - Removed `wrapper.update()` calls (unnecessary in RTL) - Removed Enzyme type imports (`ShallowWrapper`, `ReactWrapper`) **Modern Testing Patterns:** - Added Jest modern fake timers setup (`jest.useFakeTimers()`) - Configured `userEvent.setup({ advanceTimers: jest.advanceTimersByTime })` - Replaced `waitFor()` polling with direct assertions using timer control - Implemented "Start → Flush → Await" pattern for async operations with internal timers - Added proper `act()` wrapping for state-changing operations - All tests now use async/await for user interactions **TypeScript Fixes:** - Fixed context provider type issues in `landing.test.tsx` - Ensured all required `AppDependencies` props are provided - Removed unused imports and fixed linting issues **Snapshot Updates:** - Updated all snapshots to reflect RTL's rendering output format ## Testing - ✅ All migrated tests pass locally - ✅ Zero console warnings (verified with `NODE_ENV=development`) - ✅ TypeScript compilation successful - ✅ ESLint passes with no errors - ✅ Snapshots updated and validated ## Performance Improvements Tests are now faster and more deterministic: - No polling with `waitFor()` - direct assertions with timer control - Fake timers eliminate real-time waiting - More reliable in CI environments ## Checklist - [x] Removed all Enzyme dependencies from test files - [x] Added modern fake timer setup - [x] Configured userEvent with timer advancement - [x] Replaced waitFor() with timer control - [x] All tests pass with zero warnings - [x] TypeScript compiles without errors - [x] ESLint passes - [x] Snapshots updated - [x] Helper files migrated where needed ## Next Steps This is the first batch. Subsequent batches will continue migrating the remaining test files listed in issue elastic#222608. --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>

kapral18 requested a review from a team as a code owner October 14, 2025 07:11

kapral18 added backport:skip This PR does not require backporting release_note:skip Skip the PR/issue when compiling release notes labels Oct 14, 2025

kapral18 changed the title ~~Migrate test files from Enzyme to React Testing Library (Batch 1)~~ [Management][Es Ui Shared][Kbn Management] Migrate Enzyme to RTL Oct 14, 2025

kapral18 mentioned this pull request Oct 14, 2025

[Kibana Management] [Meta] Replace enzyme with React Testing Library #222608

Closed

kapral18 force-pushed the copilot/migrate-tests-from-enzyme-to-rtl branch 3 times, most recently from d861da7 to c6fe547 Compare October 18, 2025 15:23

sabarasaba reviewed Oct 20, 2025

View reviewed changes

src/platform/plugins/shared/es_ui_shared/public/request/use_request.test.helpers.tsx Outdated Show resolved Hide resolved

...lugins/shared/es_ui_shared/static/forms/hook_form_lib/components/form_data_provider.test.tsx Show resolved Hide resolved

kapral18 and others added 6 commits October 20, 2025 13:06

[CI] Auto-commit changed files from 'node scripts/yarn_deduplicate'

7124f00

Remove unused TestBed and registerTestBed exports

3e8256f

These exports are no longer used after migrating all tests from Enzyme to RTL. Only keeping getRandomString export which is still used in test files.

chore: remove as any from landing.test.tsx

60a319e

chore: fix timers use in useRequest tests

f7e8444

chore: fix up remaining tests

1f2c593

kapral18 force-pushed the copilot/migrate-tests-from-enzyme-to-rtl branch from c6fe547 to 1f2c593 Compare October 20, 2025 11:08

chore: use real timers in polling tests for useRequest hook

9cd8944

sabarasaba approved these changes Oct 21, 2025

View reviewed changes

kapral18 merged commit c77f0db into elastic:main Oct 21, 2025
12 checks passed

kibanamachine added the v9.3.0 label Oct 21, 2025

This was referenced Oct 31, 2025

[KBN-MANAGEMENT] Replace enzyme with React Testing Library #241524

Closed

[ES_UI_SHARED] Replace enzyme with React Testing Library #241525

Closed

[MANAGEMENT] Replace enzyme with React Testing Library #241526

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Management][Es Ui Shared][Kbn Management] Migrate Enzyme to RTL#238764

[Management][Es Ui Shared][Kbn Management] Migrate Enzyme to RTL#238764
kapral18 merged 7 commits intoelastic:mainfrom
kapral18:copilot/migrate-tests-from-enzyme-to-rtl

kapral18 commented Oct 14, 2025 •

edited

Loading

Uh oh!

elasticmachine commented Oct 14, 2025

Uh oh!

sabarasaba left a comment

Uh oh!

Uh oh!

Uh oh!

elasticmachine commented Oct 20, 2025

References to deprecated APIs

Uh oh!

sabarasaba left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

kapral18 commented Oct 14, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Migration Details

Testing

Performance Improvements

Checklist

Next Steps

Uh oh!

elasticmachine commented Oct 14, 2025

Uh oh!

sabarasaba left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

elasticmachine commented Oct 20, 2025

💛 Build succeeded, but was flaky

Failed CI Steps

Test Failures

Metrics [docs]

Count of Enzyme imports

References to deprecated APIs

History

Uh oh!

sabarasaba left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

kapral18 commented Oct 14, 2025 •

edited

Loading