test(RHOAIENG-79908): add texts to preserve search input min width in ai hub catalog

[Philip-Carneiro]

https://redhat.atlassian.net/browse/RHOAIENG-79908

Description

To prevent in the future to bug of the searchbar size re-appear.
I created tests to don't let it happen again.

How Has This Been Tested?

It was tested if the search input field in Model Catalog, MCP Catalog and Agent Catalog have at least 400px width via cypress

Test Impact

Don't let this bug re-appear in the future

Request review criteria:

Self checklist (all need to be checked):

• The developer has manually tested the changes and verified that the changes work
• Testing instructions have been added in the PR body (for PRs involving changes that are not immediately obvious).
• The developer has added tests or explained why testing cannot be added (unit or cypress tests for related changes)
• The code follows our Best Practices (React coding standards, PatternFly usage, performance considerations)

If you have UI changes:

• Included any necessary screenshots or gifs if it was a UI change.
• Included tags to the UX team if it was a UI/UX change.

After the PR is posted & before it merges:

• The developer has tested their solution on a cluster by using the image produced by the PR to main

Summary by CodeRabbit

• Tests
  • Added regression coverage for search fields in the Agents, MCP, and Model Catalogs.
  • Verified that each catalog search field is visible and maintains a minimum width of 400 pixels.
  • Expanded automated catalog scenarios to confirm search input behavior across supported catalog experiences.

[coderabbitai]

Warning

Review limit reached

@Philip-Carneiro, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 47 minutes

Limit details: You’ve used the included review currently available.

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

How can I continue?

Wait for the limit to reset, then comment @coderabbitai review or push new commits to the PR.

An organization admin can change what happens after included review limits in Billing.

How do review limits work?

CodeRabbit enforces per-developer PR review limits within each organization.

For paid Pro and Pro+ reviews, CodeRabbit uses a developer's included PR review attempts over the past 7 days to set the current hourly allowance. At typical activity levels, the full plan allowance applies. Higher sustained activity can lower the allowance until earlier attempts leave the 7-day window.

Please refer docs for additional details.

Review details

⚙️ Run configuration

Configuration used: Repository YAML (base), Central YAML (inherited), Organization UI (inherited)

Review profile: ASSERTIVE

Plan: Pro Plus

Run ID: bcc32f9a-9d65-4c99-b6ae-2399e4612abf

📥 Commits

Reviewing files that changed from the base of the PR and between 0b81daf and f53d1cc.

📒 Files selected for processing (1)

• packages/cypress/cypress/pages/modelCatalog/modelCatalog.ts

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository YAML (base), Central YAML (inherited), Organization UI (inherited)

Review profile: ASSERTIVE

Plan: Pro Plus

Run ID: 6dab8f0c-7fdb-4dce-956d-1adcd8c8f9b5

📥 Commits

Reviewing files that changed from the base of the PR and between 25bbe31 and 0b81daf.

📒 Files selected for processing (7)

• packages/cypress/cypress/pages/agentsCatalog.ts
• packages/cypress/cypress/pages/mcpCatalog.ts
• packages/cypress/cypress/pages/modelCatalog/modelCatalog.ts
• packages/cypress/cypress/tests/mocked/agentsCatalog/agentsCatalogSearchInput.cy.ts
• packages/cypress/cypress/tests/mocked/catalogHelpers.ts
• packages/cypress/cypress/tests/mocked/mcpCatalog/mcpCatalogSearchInput.cy.ts
• packages/cypress/cypress/tests/mocked/modelCatalog/modelCatalogSearchInput.cy.ts

Included review availability: Your plan provides up to 1 included review per hour; 0 remain after this review.

📜 Recent review details

⏰ Context from checks skipped due to timeout. (6)

• GitHub Check: Phase 0: Hermetic Build Preflight
• GitHub Check: Red Hat Konflux / odh-dashboard-on-pull-request
• GitHub Check: Red Hat Konflux / odh-core-bff-on-pull-request
• GitHub Check: Red Hat Konflux / odh-mod-arch-notebooks-on-pull-request
• GitHub Check: check / check
• GitHub Check: Setup

🧰 Additional context used

📓 Path-based instructions (3)

**

⚙️ CodeRabbit configuration file

**: REVIEW PRIORITIES:

1. Security vulnerabilities — provide severity, exploit scenario,
   and remediation code. Cite CWE/CVE IDs.
2. Bugs that could reach production — logic errors, null/undefined,
   race conditions, incorrect async handling, resource leaks.
3. API contract correctness — shape mismatches, missing error handling,
   silent failures, wrong HTTP status codes.
4. Performance only when measurable — O(n^2) in hot paths, unbounded
   memory growth, missing pagination.

Do not comment on:

• Naming preferences (unless genuinely misleading)
• Import ordering or formatting (handled by ESLint and Prettier)
• Alternative patterns that are equally valid
• Missing docs unless a public API is genuinely unclear
• Code deduplication / DRY suggestions where both copies are short
  and self-contained (< 20 lines)
• Adding explicit type annotations when TypeScript can infer the type
• Suggesting exhaustive switch/if-else when a default branch exists

Files:

• packages/cypress/cypress/pages/mcpCatalog.ts
• packages/cypress/cypress/tests/mocked/catalogHelpers.ts
• packages/cypress/cypress/tests/mocked/modelCatalog/modelCatalogSearchInput.cy.ts
• packages/cypress/cypress/tests/mocked/mcpCatalog/mcpCatalogSearchInput.cy.ts
• packages/cypress/cypress/pages/modelCatalog/modelCatalog.ts
• packages/cypress/cypress/pages/agentsCatalog.ts
• packages/cypress/cypress/tests/mocked/agentsCatalog/agentsCatalogSearchInput.cy.ts

packages/cypress/**/*.{ts,js}

⚙️ CodeRabbit configuration file

packages/cypress/**/*.{ts,js}: CYPRESS E2E TESTS (shared test framework):

1. Use data-testid selectors, not CSS classes (resilient to style changes).
2. Avoid cy.wait(ms) with fixed delays — use cy.intercept() for API readiness.
3. Follow conventions in .claude/rules/cypress-e2e.md and .claude/rules/cypress-mock.md.
4. (Suppression) Fixtures contain K8s resource manifests (including
   Secret-type objects with structural field names like secretKey,
   accessKey) and test configuration — not actual credential values.
   Suppress false positives on these structural property names and
   placeholder data values. Still flag any value matching a real
   credential format (AKIA keys, PATs, JWTs, 40-char hex strings, etc.)
   — real credentials belong only in test-variables.yml (gitignored).
5. (Suppression) Do not flag cy.exec() shell commands as injection
   risks (CWE-78) when the command string is composed from controlled
   sources: Cypress.env() CI variables, hardcoded fixture values, K8s
   API response fields (resource names, namespaces), or literal strings.
   DO still flag cy.exec() calls that incorporate user-facing input
   (form field values, URL parameters from the app under test, or
   unvalidated external API responses).
6. (Suppression) Do not suggest restructuring test isolation patterns,
   extracting shared beforeEach blocks, or changing import boundaries
   across test files. Test architecture is intentional.

Files:

• packages/cypress/cypress/pages/mcpCatalog.ts
• packages/cypress/cypress/tests/mocked/catalogHelpers.ts
• packages/cypress/cypress/tests/mocked/modelCatalog/modelCatalogSearchInput.cy.ts
• packages/cypress/cypress/tests/mocked/mcpCatalog/mcpCatalogSearchInput.cy.ts
• packages/cypress/cypress/pages/modelCatalog/modelCatalog.ts
• packages/cypress/cypress/pages/agentsCatalog.ts
• packages/cypress/cypress/tests/mocked/agentsCatalog/agentsCatalogSearchInput.cy.ts

**/*.{ts,tsx,js,jsx}

⚙️ CodeRabbit configuration file

**/*.{ts,tsx,js,jsx}: WEB SECURITY (XSS, CSRF Prevention):

1. No dangerouslySetInnerHTML without sanitization (XSS - CWE-79)
2. Validate all API responses before rendering
3. CSRF token validation for state-changing operations
4. No sensitive data in localStorage

Files:

• packages/cypress/cypress/pages/mcpCatalog.ts
• packages/cypress/cypress/tests/mocked/catalogHelpers.ts
• packages/cypress/cypress/tests/mocked/modelCatalog/modelCatalogSearchInput.cy.ts
• packages/cypress/cypress/tests/mocked/mcpCatalog/mcpCatalogSearchInput.cy.ts
• packages/cypress/cypress/pages/modelCatalog/modelCatalog.ts
• packages/cypress/cypress/pages/agentsCatalog.ts
• packages/cypress/cypress/tests/mocked/agentsCatalog/agentsCatalogSearchInput.cy.ts

---

📝 Walkthrough

Walkthrough

Added search-input page-object helpers for the Agents, MCP, and Model Catalogs. Added mocked Cypress regression tests for each catalog. The tests configure catalog API responses, open the catalog pages, and verify that the search inputs are visible and at least 400 pixels wide.

🚥 Pre-merge checks | ✅ 10

✅ Passed checks (10 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title identifies the catalog search input minimum-width regression tests and references the related issue.
Description check	✅ Passed	The description links the issue, explains the purpose, identifies Cypress coverage, and completes the relevant checklist items.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Contribution Quality And Spam Detection	✅ Passed	Diff adds three catalog selectors and three focused Cypress width tests for linked RHOAIENG-79908; it adds no security or validation logic and shows prior repository contributions.
No Hardcoded Secrets	✅ Passed	PASS — PR adds only Cypress TypeScript tests/helpers. No hardcoded keys, tokens, passwords, credential URLs, or config base64 strings were added; user@example.com is a mock fixture. No CWE-798/CWE-...
No Weak Cryptography	✅ Passed	The PR diff contains only Cypress page helpers, tests, and mock intercepts; scans found no MD5, SHA1, DES, RC4, ECB, custom crypto, or secret comparison.
No Injection Vectors	✅ Passed	The PR adds constant test-ID lookups and Cypress mocks only; no changed-code CWE-89, CWE-78, CWE-94, CWE-502, or CWE-79 injection pattern is present.
No Privileged Containers	✅ Passed	origin/main...HEAD changes only seven Cypress TypeScript files; no Kubernetes/OpenShift manifest, Helm template, Dockerfile, or prohibited privileged-container marker was added.
No Sensitive Data In Logs	✅ Passed	The PR adds page-object methods, Cypress assertions, and mock bodies; no new logging statements or sensitive values emitted to logs were found. Existing cy.log calls are unchanged and non-sensitive.

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[rhods-ci-bot]

/early-gate-build

[manaswinidas]

Type-check is failing

[paulovmr]

FYI Please be sure to rebase this pull request before approving it, to get the latest mock location changes

[openshift-ci]

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by:
Once this PR has been reviewed and has the lgtm label, please ask for approval from manaswinidas. For more information see the Code Review Process.

The full list of commands accepted by this bot can be found here.

Details

Needs approval from an approver in each of these files:

• OWNERS

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[coderabbitai]

Note

GitHub couldn't provide a complete incremental comparison for this pull request, so CodeRabbit is performing a full review instead. This review may take a little longer.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 60.43%. Comparing base (42f4942) to head (0b81daf).
⚠️ Report is 2 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #9229      +/-   ##
==========================================
+ Coverage   59.93%   60.43%   +0.50%     
==========================================
  Files        3124     3150      +26     
  Lines       97153    97818     +665     
  Branches    25572    25750     +178     
==========================================
+ Hits        58224    59117     +893     
+ Misses      38929    38701     -228     

Flag	Coverage Δ
cypress-mock	70.00% <ø> (+0.57%)	⬆️
unit	30.59% <ø> (+0.02%)	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.
see 79 files with indirect coverage changes

---

Continue to review full report in Codecov by Harness.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 25bbe31...0b81daf. Read the comment docs.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[coderabbitai]

Note

GitHub couldn't provide a complete incremental comparison for this pull request, so CodeRabbit is performing a full review instead. This review may take a little longer.

[rhods-ci-bot]

/early-gate-build

[coderabbitai]

Note

GitHub couldn't provide a complete incremental comparison for this pull request, so CodeRabbit is performing a full review instead. This review may take a little longer.