fix: Initialize modal state from initialData and improve test stability

[Cristhianzl]

This pull request improves the reliability and maintainability of the global variable modal and its related end-to-end tests. The main changes include making the modal correctly initialize its state from initialData, refactoring the user settings tests to be more robust when selecting fields, and enhancing test selectors for better stability.

Frontend logic improvements:

• The GlobalVariableModal component now properly initializes its state (key, value, type, and fields) from the initialData prop when it is provided, ensuring the modal displays correct information when editing existing variables.

Test robustness and maintainability:

• Added a FALLBACK_FIELDS list and a new helper function trySelectAvailableField in userSettings.spec.ts to attempt selecting any available field from a prioritized list, making the test less brittle to changes in available fields. [1] [2]
• Replaced hardcoded field selection and waits in the test with the new helper function, improving reliability and reducing test flakiness.
• Updated selectors for clicking on variable names to use .ag-cell:has-text(...) instead of relying on .last(), making element targeting more precise and robust. [1] [2]

Test tagging:

• Added the @components tag to the "should see general profile gradient" test for improved test categorization.

Summary by CodeRabbit

• Bug Fixes
  • Fixed Global Variable Modal to properly pre-fill fields when editing existing variables.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Caution

Review failed

The pull request is closed.

Walkthrough

Added initialization effect in GlobalVariableModal to pre-fill form fields from dynamic initialData updates, and refactored test selectors in userSettings.spec.ts to use locator-based queries with a fallback field selection helper for improved resilience.

Changes

Cohort / File(s)	Summary
Form State Initialization src/frontend/src/components/core/GlobalVariableModal/GlobalVariableModal.tsx	Added effect hook to initialize modal state (key, value, type, fields) from initialData prop changes, enabling form pre-population in edit scenarios
Test Selector Refactoring src/frontend/tests/extended/features/userSettings.spec.ts	Introduced FALLBACK_FIELDS constant and trySelectAvailableField helper function to dynamically select field options; replaced hard-coded text-based selectors with CSS locator-based queries and added timing waits for stability; updated test scope tag

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch cz/fix-state-gv-dialog

---

---

📜 Recent review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between e970dce and 54c30be.

📒 Files selected for processing (2)

• src/frontend/src/components/core/GlobalVariableModal/GlobalVariableModal.tsx
• src/frontend/tests/extended/features/userSettings.spec.ts

_{✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.}

---

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 and usage tips.}