Skip to content

enzyme -> RTL: convert the Instances screen suites - #437

Merged
cigamit merged 2 commits into
ctrliq:mainfrom
blaipr:feature/rtl-batch-instances
Jun 18, 2026
Merged

enzyme -> RTL: convert the Instances screen suites#437
cigamit merged 2 commits into
ctrliq:mainfrom
blaipr:feature/rtl-batch-instances

Conversation

@blaipr

@blaipr blaipr commented Jun 16, 2026

Copy link
Copy Markdown
Contributor
SUMMARY

Converts the Instances screen's test suite from enzyme to React Testing Library, continuing the incremental enzyme → RTL migration (one screen directory per PR).

Files migrated off mountWithContexts/enzyme onto renderWithContexts:

  • InstanceList / InstanceListItem — row data, progress bar, expanded-row details, hop-node hiding, capacity-slider fork recompute
  • InstanceDetail — detail fields, health-check button state + error modal, instance enable/disable toggle, capacity slider
  • InstanceAdd / InstanceEdit — create/update API args + redirect, cancel navigation, submit-error branch (shared InstanceForm mocked)
  • InstanceForm — input updates and submit payload (tooltip-labelled fields queried by id)

Interactions now go through accessible roles and real user events. Behaviour and assertions are preserved.

ISSUE TYPE
  • Bug, Docs Fix or other nominal change
COMPONENT NAME
  • UI
ADDITIONAL INFORMATION

npm test for the Instances directory: 9 suites, 43 tests, all passing. ESLint clean. No production code changed — test-only.

One list-item error-path test was adapted rather than asserting a visible modal: the component renders that AlertModal with no isOpen prop, so PatternFly never mounts it to the DOM (enzyme matched the closed React element; RTL sees no DOM node). The identical error branch is still exercised and the rejected API call asserted, with a code comment explaining the component quirk.

Migrate the Instances screen's test suite off enzyme/mountWithContexts
onto renderWithContexts (React Testing Library): InstanceList items,
InstanceDetail (health-check + capacity slider), InstanceAdd/InstanceEdit
(shared InstanceForm mocked) and InstanceForm. Behaviour and assertions
are preserved; interactions go through accessible roles and real user
events.
@blaipr blaipr changed the title Convert Instances screen tests from enzyme to React Testing Library enzyme -> RTL: convert the Instances screen suites Jun 16, 2026
@cigamit
cigamit requested a review from Copilot June 17, 2026 07:34

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR continues the incremental migration of the Instances screen UI test suites from Enzyme to React Testing Library (RTL), updating tests to use accessible queries and user-driven interactions while preserving existing behavioral coverage.

Changes:

  • Migrated InstanceForm, InstanceAdd, and InstanceEdit tests from enzyme mountWithContexts to RTL renderWithContexts.
  • Updated InstanceListItem and InstanceDetail tests to drive PatternFly slider behavior via keyboard interaction and assert against rendered DOM.
  • Introduced small helper functions/stubs inside tests to keep RTL setups focused (e.g., computeForks, mocked InstanceForm).

Reviewed changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
awx/ui/src/screens/Instances/Shared/InstanceForm.test.js Converts form field and submit/cancel tests to RTL user interactions.
awx/ui/src/screens/Instances/InstanceList/InstanceListItem.test.js Migrates list-row interaction tests to RTL; adds slider keyboard interactions and DOM assertions.
awx/ui/src/screens/Instances/InstanceEdit/InstanceEdit.test.js Switches to RTL; stubs shared form to validate container submit/cancel/error flows.
awx/ui/src/screens/Instances/InstanceDetail/InstanceDetail.test.js Converts detail screen tests to RTL, including slider and health-check error modal assertions.
awx/ui/src/screens/Instances/InstanceAdd/InstanceAdd.test.js Switches to RTL; stubs shared form to validate create + navigation behavior.

Comment on lines 207 to 216
const slider = screen.getByRole('slider');
slider.focus();
// Any slider change triggers the (mocked-immediate) update which rejects.
await user.keyboard('{ArrowRight}');

await waitFor(() =>
expect(InstancesAPI.update).toHaveBeenCalledWith(1, {
capacity_adjustment: 1,
})
);
@blaipr

blaipr commented Jun 17, 2026

Copy link
Copy Markdown
Contributor Author

Thanks for the review. The capacity test now asserts the slider value computed from the 0.1 step rather than a hard-coded 1.

@cigamit
cigamit merged commit 0fb8429 into ctrliq:main Jun 18, 2026
@cigamit cigamit self-assigned this Jun 18, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Development

Successfully merging this pull request may close these issues.

3 participants