enzyme -> RTL: convert the PromptDetail component suites - #459
Conversation
Migrate components/PromptDetail (PromptDetail and the per-resource detail variants: JobTemplate, WorkflowJobTemplate, InventorySource, Project) off enzyme/mountWithContexts onto renderWithContexts (React Testing Library). Prompt-override detail rows and credential/label chips are asserted via assertDetail/getByText; behaviour and assertions are preserved.
There was a problem hiding this comment.
Pull request overview
This PR continues the enzyme → React Testing Library migration by converting the components/PromptDetail test suites to use renderWithContexts/RTL queries, focusing on the main PromptDetail suite and its per-resource detail variants.
Changes:
- Replaced enzyme
mountWithContextswrappers with RTLrenderWithContexts+screenqueries. - Standardized many label/value assertions using the shared
assertDetailhelper. - Updated “empty Detail” expectations to assert the label is absent (since
DetailreturnsnullwhenisEmpty).
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 17 comments.
Show a summary per file
| File | Description |
|---|---|
| awx/ui/src/components/PromptDetail/PromptDetail.test.js | Migrates the main PromptDetail suite to RTL and updates prompt override section assertions. |
| awx/ui/src/components/PromptDetail/PromptJobTemplateDetail.test.js | Migrates Job Template prompt detail tests to RTL; adds link/content assertions for chips and sparkline links. |
| awx/ui/src/components/PromptDetail/PromptWFJobTemplateDetail.test.js | Migrates Workflow Job Template detail tests to RTL; updates activity/labels empty-row assertions. |
| awx/ui/src/components/PromptDetail/PromptInventorySourceDetail.test.js | Migrates Inventory Source detail tests to RTL; updates chips/options assertions and “Deleted” expectations. |
| awx/ui/src/components/PromptDetail/PromptProjectDetail.test.js | Migrates Project detail tests to RTL; replaces enzyme selectors with assertDetail/text assertions. |
Comments suppressed due to low confidence (1)
awx/ui/src/components/PromptDetail/PromptJobTemplateDetail.test.js:149
- This test overwrites
summary_fieldswith only{ labels: { results: [] } }, which drops othersummary_fieldskeys and can change unrelated rendering. Spread the originalsummary_fieldsand override onlylabels.
resource={{
...mockJT,
summary_fields: {
labels: {
results: [],
},
},
| test('should render "Deleted" details', () => { | ||
| delete mockJT.summary_fields.inventory; | ||
| delete mockJT.summary_fields.organization; | ||
| delete mockJT.summary_fields.project; | ||
|
|
| @@ -139,12 +120,11 @@ describe('PromptJobTemplateDetail', () => { | |||
| }} | |||
| @@ -154,14 +134,11 @@ describe('PromptJobTemplateDetail', () => { | |||
| }} | |||
| // Variables uses react-ace (empty under jsdom); assert the surrounding label | ||
| expect(screen.getByText('Variables')).toBeInTheDocument(); |
| @@ -74,12 +60,12 @@ describe('PromptWFJobTemplateDetail', () => { | |||
| }} | |||
| // No launchConfig prompt data + no overrides -> no "Prompted Values" section | ||
| expect(screen.queryByRole('heading', { level: 2 })).toBeNull(); |
| expect( | ||
| screen.getByRole('heading', { level: 2 }) | ||
| ).toHaveTextContent('Prompted Values'); |
| // Variables uses react-ace (empty under jsdom); assert the surrounding label | ||
| expect(screen.getByText('Variables')).toBeInTheDocument(); |
| // Variables uses react-ace (empty under jsdom); assert the surrounding label | ||
| expect(screen.getByText('Variables')).toBeInTheDocument(); |
| test('should render "Deleted" details', () => { | ||
| delete mockProject.summary_fields.organization; | ||
| wrapper = mountWithContexts( | ||
| <PromptProjectDetail resource={mockProject} />, | ||
| { | ||
| context: { config }, | ||
| } | ||
| ); | ||
| assertDetail(wrapper, 'Organization', 'Deleted'); | ||
| renderWithContexts(<PromptProjectDetail resource={mockProject} />, { | ||
| context: { config }, | ||
| }); | ||
| assertDetail('Organization', 'Deleted'); |
Mock the CodeEditor leaf to assert the rendered extra_vars/source_vars YAML; clone shared mocks before deleting fields; spread summary_fields when overriding a single key; query the Prompted Values heading by accessible name; restore the Inventory File row assertion.
|
Thanks for the review. Pushed a commit: mock the CodeEditor leaf to assert the rendered extra_vars and source_vars YAML, clone the shared mocks before deleting fields, spread summary_fields when overriding a single key, query the Prompted Values heading by its accessible name, and restore the Inventory File row assertion. |
SUMMARY
Converts the PromptDetail component test suite (
components/PromptDetail) from enzyme to React Testing Library, continuing the enzyme → RTL migration (components, one directory per PR).Files migrated off
mountWithContexts/enzyme ontorenderWithContexts:PromptDetailand the per-resource detail variants —PromptJobTemplateDetail,PromptWFJobTemplateDetail,PromptInventorySourceDetail,PromptProjectDetail.Prompt-override detail rows and credential/label chips are asserted via
assertDetail/getByText; emptyDetailrows (which rendernull) are asserted as absent. Behaviour and assertions are preserved.ISSUE TYPE
COMPONENT NAME
ADDITIONAL INFORMATION
npm testforcomponents/PromptDetail: 5 suites, 20 tests, all passing. ESLint clean (--no-ignore). No production code changed — test-only. (Redundant mount-only "renders successfully" tests were folded into the detail-render tests since RTL renders fresh per test — no coverage dropped.)