NETOBSERV-2689: Patternflyv6 updates#1426
NETOBSERV-2689: Patternflyv6 updates#1426openshift-merge-bot[bot] merged 12 commits intonetobserv:mainfrom
Conversation
|
@Amoghrd: This pull request references NETOBSERV-2653 which is a valid jira issue. Warning: The referenced jira issue has an invalid target version for the target branch this PR targets: expected the story to target the "4.22.0" version, but no target version was set. DetailsIn response to this:
Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository. |
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
📝 WalkthroughWalkthroughRefactors Cypress tests and view/components to replace positional selectors with text/test-id selectors, add and use data-test attributes, harden DOM traversals, adjust several test assertions, add a new cliLogin command, and introduce a fixture and SVG logo verifier for topology resource logos. Changes
Estimated code review effort🎯 4 (Complex) | ⏱️ ~50 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 inconclusive)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
3910400 to
b5702ad
Compare
|
@Amoghrd: This pull request references NETOBSERV-2653 which is a valid jira issue. Warning: The referenced jira issue has an invalid target version for the target branch this PR targets: expected the story to target the "4.22.0" version, but no target version was set. DetailsIn response to this:
Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository. |
|
Have fixed the failing tests(network_health, netflow_table and netflow_export) from ginkgo job. Will rerun them on monday to check if they are passing. |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #1426 +/- ##
=======================================
Coverage 52.47% 52.47%
=======================================
Files 233 233
Lines 12438 12438
Branches 1559 1559
=======================================
Hits 6527 6527
Misses 5297 5297
Partials 614 614
Flags with carried forward coverage won't be shown. Click here to find out more. 🚀 New features to boost your workflow:
|
b5702ad to
fcad18b
Compare
|
@Amoghrd: This pull request references NETOBSERV-2653 which is a valid jira issue. Warning: The referenced jira issue has an invalid target version for the target branch this PR targets: expected the story to target the "4.22.0" version, but no target version was set. DetailsIn response to this:
Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository. |
fcad18b to
30fb22f
Compare
There was a problem hiding this comment.
Actionable comments posted: 6
🧹 Nitpick comments (3)
web/cypress/views/yaml-editor.ts (1)
99-104: Narrow the click scope to avoid flaky cross-item matches.Using
.parents('li')+.find('button')can target a different item’s button in nested lists. Prefer nearest ancestor scoping.As per coding guidelines, "`web/cypress/**/*.ts`: Verify E2E test stability, proper waits, and selector resilience".Proposed change
export const clickFieldDetailsButton = (fieldName: string) => { cy.contains('h5', `${fieldName}`) - .parents('li') - .find('button') - .contains('View details') - .click(); + .closest('li') + .within(() => { + cy.contains('button', 'View details').click(); + }); };🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@web/cypress/views/yaml-editor.ts` around lines 99 - 104, The selector in clickFieldDetailsButton is too broad — using .parents('li').find('button') can match buttons from other nested items; change to scope to the nearest list item and then click the button within that scope. Update clickFieldDetailsButton to use cy.contains('h5', fieldName).closest('li') (or .closest('li').within(() => cy.contains('button', 'View details').click())) so the lookup is limited to the nearest ancestor li and the button lookup uses the 'button' context.web/cypress/views/operator-hub-page.ts (1)
47-47: Scope the status selector to operator tiles.Line 47 uses a page-wide
[role="status"], which can match unrelated status elements and introduce flaky assertions. Scope it to tile containers.Proposed change
getAllTileLabels: () => { - return cy.get('[role="status"]') + return cy.get('.co-catalog-tile').find('[role="status"]') },As per coding guidelines,
web/cypress/**/*.tsmust "Verify E2E test stability, proper waits, and selector resilience".🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@web/cypress/views/operator-hub-page.ts` at line 47, The selector currently returns a page-wide '[role="status"]' which can match unrelated elements; update the call that returns this selector so it scopes the status to operator tile containers (for example replace with a descendant selector like '[data-testid="operator-tile"] [role="status"]' or use cy.get('[data-testid="operator-tile"]').find('[role="status"]') / '.operator-tile [role="status"]' depending on the DOM) to ensure the status element is fetched only from operator tiles and avoid flaky assertions.web/cypress/views/netobserv.ts (1)
226-227: Scope the finalSubmitclick to the wizard footer.Line 227 uses a page-wide
contains('button', 'Submit'), which can click the wrong button if another submit action is present. Scope it to the form footer to reduce flakiness.Proposed tweak
- cy.contains('button', 'Submit').should('exist').click() + cy.get('footer').contains('button[type="submit"]', 'Submit').should('be.visible').click()As per coding guidelines, "web/cypress/**/*.ts: Verify E2E test stability, proper waits, and selector resilience".
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@web/cypress/views/netobserv.ts` around lines 226 - 227, The page-wide cy.contains('button', 'Submit') call in the "Consumption tab - final submit" step is too broad; scope the lookup to the wizard/footer region to avoid clicking the wrong submit button by first selecting the wizard footer container (for example the footer element or a data-testid like wizard-footer) and then calling contains on that container for the 'Submit' button, keeping the existing should('exist') and click flow to preserve assertions.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@web/cypress/integration-tests/netflow_export.cy.ts`:
- Around line 47-53: Replace the flaky fixed sleep and ambiguous ls parsing:
remove the cy.wait(3000) and instead wait for the download file to appear by
polling the downloads directory and selecting the newest file; replace the raw
cy.exec("ls cypress/downloads") + cy.wrap(response.stdout) usage with a
deterministic listing (e.g., cy.exec('ls -t cypress/downloads | head -n1') or a
Node task that returns the newest file) and trim newlines before using the
filename, then move/rename and cy.readFile('cypress/downloads/export_table.csv')
only after confirming the file exists; update the code around cy.exec, cy.wrap,
and cy.readFile to use this deterministic approach so tests are stable and
handle multiple files.
In `@web/cypress/integration-tests/netflow_table.cy.ts`:
- Around line 151-153: The test currently re-queries the entire column inside
the each callback (cy.get('[data-test-td-column-id=SrcPort]').each((td) => {
cy.get('[data-test-td-column-id=SrcPort]').should(...)})), which validates the
whole column instead of the current cell; update the each callbacks to use
cy.wrap(td).should('not.contain.text', 'loki (3100)') so each cell is asserted
individually, and apply the same change to the other similar block mentioned
(the second occurrence around lines 159-161).
In `@web/cypress/integration-tests/quickFilters.cy.ts`:
- Around line 52-53: The test is querying any checkbox inside
`#quick-filters-dropdown` which is too broad and brittle; update both occurrences
(the checks at the lines referencing `#quick-filters-dropdown`) to scope the
checkbox to the "Test NS" filter label instead of selecting all
checkboxes—locate the label text "Test NS" (e.g., with cy.contains or within)
and then find the associated input[type="checkbox"] from that label/container
before asserting/clicking, and ensure any necessary waits or assertions for the
dropdown/label visibility are added to stabilize the E2E step.
In `@web/cypress/integration-tests/table_queryopts.cy.ts`:
- Around line 126-129: The assertion currently re-queries all Dscp cells inside
the .each loop, losing scope; instead, inside the each callback use the td
element directly (wrap the td with cy.wrap(td)) to assert its attributes and
text so each row is validated individually: reference the existing
cy.get('[data-test-td-column-id=Dscp]') .each((td) => ...) loop and replace the
global cy.get(...) text check with cy.wrap(td).should('contain.text',
'Standard') and assert the attribute on cy.wrap(td) (e.g.,
should('have.attr','data-test-td-value').and('contain','0')) so each td is
tested in scope.
In `@web/cypress/views/netflow-page.ts`:
- Around line 145-146: The selector confirmDel uses Playwright-only syntax
'#delete-modal button:has-text("Delete")' which will break in Cypress; replace
it with a proper test-hook based selector (e.g. use an existing data-test-id on
the modal and the confirm button) and update confirmDel to point to that test
hook (reference symbol: confirmDel) instead of using :has-text(), or
alternatively ensure tests use cy.contains(...) in the test code rather than
this Playwright selector; also keep the existing del constant
([data-test-id=delete-resource-button]) unchanged.
In `@web/cypress/views/network-health.ts`:
- Around line 14-25: The tests fail because clickOnAlert and verifyAlert use
non-existent data-test attributes; update both functions (clickOnAlert and
verifyAlert in web/cypress/views/network-health.ts) to use the id-based hooks
emitted by the component (replace `[data-test="health-card-${name}"]` with the
component's id selector, e.g. `#health-card-${name}` or the exact id attribute
used in web/src/components/health/health-card.tsx), keep the existing { timeout,
force } options and the sidePanel checks unchanged, and ensure the same selector
change is applied to both the initial click and the closing click so the test
targets the real DOM nodes.
---
Nitpick comments:
In `@web/cypress/views/netobserv.ts`:
- Around line 226-227: The page-wide cy.contains('button', 'Submit') call in the
"Consumption tab - final submit" step is too broad; scope the lookup to the
wizard/footer region to avoid clicking the wrong submit button by first
selecting the wizard footer container (for example the footer element or a
data-testid like wizard-footer) and then calling contains on that container for
the 'Submit' button, keeping the existing should('exist') and click flow to
preserve assertions.
In `@web/cypress/views/operator-hub-page.ts`:
- Line 47: The selector currently returns a page-wide '[role="status"]' which
can match unrelated elements; update the call that returns this selector so it
scopes the status to operator tile containers (for example replace with a
descendant selector like '[data-testid="operator-tile"] [role="status"]' or use
cy.get('[data-testid="operator-tile"]').find('[role="status"]') /
'.operator-tile [role="status"]' depending on the DOM) to ensure the status
element is fetched only from operator tiles and avoid flaky assertions.
In `@web/cypress/views/yaml-editor.ts`:
- Around line 99-104: The selector in clickFieldDetailsButton is too broad —
using .parents('li').find('button') can match buttons from other nested items;
change to scope to the nearest list item and then click the button within that
scope. Update clickFieldDetailsButton to use cy.contains('h5',
fieldName).closest('li') (or .closest('li').within(() => cy.contains('button',
'View details').click())) so the lookup is limited to the nearest ancestor li
and the button lookup uses the 'button' context.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: ef81c7ae-ffe5-4194-b81a-ad35272f388f
📒 Files selected for processing (32)
web/cypress/e2e/table/fields.spec.tsweb/cypress/integration-tests/client_performance.cy.tsweb/cypress/integration-tests/dns_dashboards.cy.tsweb/cypress/integration-tests/dns_tracking.cy.tsweb/cypress/integration-tests/flowRTT.cy.tsweb/cypress/integration-tests/flowRTT_dashboards.cy.tsweb/cypress/integration-tests/gateway_topology_logo.cy.tsweb/cypress/integration-tests/ingress_dashboard.cy.tsweb/cypress/integration-tests/netflow_conversations.cy.tsweb/cypress/integration-tests/netflow_export.cy.tsweb/cypress/integration-tests/netflow_external_subnet.cy.tsweb/cypress/integration-tests/netflow_table.cy.tsweb/cypress/integration-tests/netflow_zone_multiCluster.cy.tsweb/cypress/integration-tests/netobserv_udn.cy.tsweb/cypress/integration-tests/network_health.cy.tsweb/cypress/integration-tests/overview_page.cy.tsweb/cypress/integration-tests/packet_drop.cy.tsweb/cypress/integration-tests/packet_drop_dashboards.cy.tsweb/cypress/integration-tests/quickFilters.cy.tsweb/cypress/integration-tests/table_queryopts.cy.tsweb/cypress/integration-tests/topology_edges_labels.cy.tsweb/cypress/integration-tests/topology_groups.cy.tsweb/cypress/integration-tests/topology_view.cy.tsweb/cypress/support/commands.tsweb/cypress/views/dashboards-page.tsweb/cypress/views/list-page.tsweb/cypress/views/netflow-page.tsweb/cypress/views/netobserv.tsweb/cypress/views/network-health.tsweb/cypress/views/operator-hub-page.tsweb/cypress/views/pages.tsweb/cypress/views/yaml-editor.ts
|
Rebased without changes |
jpinsonneau
left a comment
There was a problem hiding this comment.
Nice work, thanks @Amoghrd !
Just some nit you may want to address here.
ac46faf to
fbbc77b
Compare
fbbc77b to
c293816
Compare
|
Reran the changed tests post review comment changes. All passed |
kapjain-rh
left a comment
There was a problem hiding this comment.
Looks good to me, one comment only
I saw in some cases the way of action changed,But mostly looks the improvements in previous tests :)
c293816 to
c9021fd
Compare
|
Yup all are just improvements or to make the tests less flaky |
|
/lgtm |
|
[APPROVALNOTIFIER] This PR is APPROVED Approval requirements bypassed by manually added approval. This pull-request has been approved by: The full list of commands accepted by this bot can be found here. The pull request process is described here DetailsNeeds approval from an approver in each of these files:Approvers can indicate their approval by writing |
|
@jpinsonneau Could you help merge this? |
addea95
into
netobserv:main
- Replace complex CSS selector with manage-overview-panels-button - Replace overviewSelectors.panelsModal with #overview-panels-modal - Matches PR netobserv#1426 approach to reduce dependency on PF selectors All 3 overview tests now passing on OCP 4.14 cluster 373965 Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Replace complex CSS selector with manage-overview-panels-button - Replace overviewSelectors.panelsModal with #overview-panels-modal - Matches PR netobserv#1426 approach to reduce dependency on PF selectors All 3 overview tests now passing on OCP 4.14 cluster 373965 Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Add getTopologyScopeURL() and getMemoryUsageMB() helper functions - Update tab navigation to use .contains() instead of nth-child() - Simplify beforeEach to wait for page load instead of intercepting - Use getMemoryUsageMB() helper for consistent memory calculation - Update API URL from **/backend/api/flow/metrics* to **/api/flow/metrics* - Keep fixture paths as netobserv/perf/ (PF4 branch structure) Matches upstream PR netobserv#1426 pattern to reduce PF selector dependencies Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Following PR netobserv#1426 pattern, replace brittle nth-child() selectors with resilient .contains() for tab navigation to reduce PatternFly version dependency. Changes: - nth-child(2) → .contains('Traffic flows') - nth-child(3) → .contains('Topology') Files updated: - packet_drop_dashboards.cy.ts - netflow_zone_multiCluster.cy.ts (2 occurrences) - topology_groups.cy.ts - dns_dashboards.cy.ts - dns_tracking.cy.ts - packet_drop.cy.ts - flowRTT_dashboards.cy.ts - quickFilters.cy.ts Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Major improvements to test stability by reducing dependency on PatternFly-specific CSS selectors: **Removed Selectors:** - mColumns, mPanels: Use openColumnsModal()/openPanelsModal() commands - expand: Unused selector - overviewExport, tableExport, topologyExport: Use #export-button - expandedQuerySummaryPanel: Unused - PF-specific classes in checkPopupItems **Updated Commands:** - checkPopupItems: Uses label matching instead of PF data-list classes - selectPopupItems: Uses parent/input traversal instead of PF classes **Updated Tests:** - dns_tracking.cy.ts: openColumnsModal(), openPanelsModal() - netflow_external_subnet.cy.ts: openColumnsModal() - netflow_table.cy.ts: openColumnsModal(), showAdvancedOptions() - netflow_zone_multiCluster.cy.ts: openColumnsModal() - netflow_export.cy.ts: #export-button, export-modal, showAdvancedOptions() **Selector Improvements:** - optsClose: .pf-c-drawer__close > .pf-c-button → [aria-label="Close drawer panel"] Following PR netobserv#1426 pattern of resilient selectors for better test maintainability across PatternFly versions. Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Description
Dependencies
#1365
Checklist
Jenkins run: noo-frontend-tests#58
All failing tests were flaky and passed on rerun
Summary by CodeRabbit