Skip to content

fix: improve project-switcher data-testid for uniqueness and special chars#578

Merged
DhanushSantosh merged 2 commits intoAutoMaker-Org:v0.13.0rcfrom
stefandevo:fix/v0.13.0rc-e2e-ci
Jan 18, 2026
Merged

fix: improve project-switcher data-testid for uniqueness and special chars#578
DhanushSantosh merged 2 commits intoAutoMaker-Org:v0.13.0rcfrom
stefandevo:fix/v0.13.0rc-e2e-ci

Conversation

@stefandevo
Copy link
Copy Markdown
Collaborator

@stefandevo stefandevo commented Jan 18, 2026

Summary

  • Combines stable project.id with sanitized name for unique, deterministic test IDs
  • Expands sanitization to properly handle special characters (removes non-alphanumeric except hyphens)
  • Updates E2E tests to use ends-with selector pattern for matching

This addresses the CodeRabbitAI feedback on PR #574 regarding potential test-id collisions and special character handling.

Test plan

  • E2E tests pass with the new data-testid format
  • Project switcher items can be selected by tests using the ends-with pattern
  • Projects with special characters in names produce valid CSS selectors

Summary by CodeRabbit

  • Tests
    • Enhanced test ID generation for the project switcher component to improve test reliability and robustness.
    • Updated test selectors across multiple test suites to work reliably with the new test ID format.
    • No changes to user-facing functionality.

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

…chars

The data-testid generation was using only the sanitized project name which
could produce collisions and didn't handle special characters properly.

Changes:
- Combine stable project.id with sanitized name: project-switcher-{id}-{name}
- Expand sanitization to remove non-alphanumeric chars (except hyphens)
- Collapse multiple hyphens and trim leading/trailing hyphens
- Update E2E tests to use ends-with selector for matching

This ensures test IDs are deterministic, unique, and safe for CSS selectors.
@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Jan 18, 2026

Warning

Rate limit exceeded

@stefandevo has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 22 minutes and 30 seconds before requesting another review.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

📥 Commits

Reviewing files that changed from the base of the PR and between ef2dcba and 1ede7e7.

📒 Files selected for processing (6)
  • apps/ui/src/components/layout/project-switcher/components/project-switcher-item.tsx
  • apps/ui/src/lib/utils.ts
  • apps/ui/tests/features/feature-manual-review-flow.spec.ts
  • apps/ui/tests/projects/new-project-creation.spec.ts
  • apps/ui/tests/projects/open-existing-project.spec.ts
  • apps/ui/tests/utils/core/elements.ts

Note

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.

📝 Walkthrough

Walkthrough

The changes refactor the project switcher item's test ID generation to include both a project ID and a sanitized version of the project name, creating a more unique identifier (project-switcher-{id}-{sanitizedName}). Corresponding test files are updated to use ends-with selectors to accommodate the new format.

Changes

Cohort / File(s) Summary
Component Test ID Enhancement
apps/ui/src/components/layout/project-switcher/components/project-switcher-item.tsx
Introduces sanitization logic for project names (lowercase, hyphenated, alphanumeric-only) and constructs a new test ID format combining project ID with sanitized name. Replaces direct test ID with the new aggregated identifier applied via data-testid attribute.
Test Selector Updates
apps/ui/tests/features/feature-manual-review-flow.spec.ts, apps/ui/tests/projects/new-project-creation.spec.ts, apps/ui/tests/projects/open-existing-project.spec.ts
Updates three test files to use ends-with CSS attribute selectors ([data-testid$="-{projectName}"]) instead of exact test ID matches, accommodating the new data-testid format that appends additional identifiers. Each update includes a clarifying comment.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐰 A tail of test IDs, now quite divine,
With sanitized names in a neat design,
No more exact matches, just ends-with embrace,
Selectors more flexible, quicker to trace!

🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title accurately describes the main change: improving project-switcher data-testid for uniqueness and special character handling, which is the core objective of the PR.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✏️ Tip: You can configure your own custom pre-merge checks in the 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

Comment @coderabbitai help to get the list of available commands and usage tips.

@gemini-code-assist
Copy link
Copy Markdown
Contributor

Summary of Changes

Hello @stefandevo, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request refines the data-testid generation for project switcher items to ensure unique and stable identifiers, particularly when project names contain special characters. This enhancement directly addresses previous feedback on potential test ID collisions and character handling, leading to more robust and reliable end-to-end tests by providing consistent element selection.

Highlights

  • Improved data-testid Generation: The data-testid for ProjectSwitcherItem components now combines a stable project.id with a thoroughly sanitized version of the project.name to ensure uniqueness and readability.
  • Enhanced Sanitization Logic: The sanitization process for project names has been expanded to handle special characters more robustly. It converts names to lowercase, replaces spaces with hyphens, removes most non-alphanumeric characters (except hyphens), collapses multiple hyphens, and trims leading/trailing hyphens.
  • Updated E2E Tests: End-to-end tests have been updated to use an 'ends-with' CSS selector pattern ([data-testid$="-{sanitizedName}"]) to reliably locate project switcher items, aligning with the new data-testid format.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help /gemini help Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.

Copy link
Copy Markdown
Contributor

@gemini-code-assist gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

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

Code Review

This pull request improves the data-testid for project switcher items by including a sanitized project name, which is a great step for test stability. The implementation in ProjectSwitcherItem is solid. However, the E2E tests have been updated in a way that will fail if project names contain special characters, uppercase letters, or spaces, as they don't apply the same sanitization logic. I've provided suggestions to fix this in the test files by replicating the sanitization logic. For better long-term maintainability, I also recommend extracting this sanitization logic into a shared utility function.

Comment thread apps/ui/tests/projects/open-existing-project.spec.ts Outdated
Comment thread apps/ui/tests/features/feature-manual-review-flow.spec.ts Outdated
Comment thread apps/ui/tests/projects/new-project-creation.spec.ts Outdated
Address PR review comments by:
- Creating shared sanitizeForTestId utility in apps/ui/src/lib/utils.ts
- Updating ProjectSwitcherItem to use the shared utility
- Adding matching helper to test utils for E2E tests
- Updating all E2E tests to use the sanitization helper

This ensures the component and tests use identical sanitization logic,
making tests robust against project names with special characters.
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)
apps/ui/tests/projects/open-existing-project.spec.ts (1)

85-111: Stabilize the settings route handler to avoid disposed-response failures.

The pipeline error (apiResponse.json: Response has been disposed) points at the route.fetch()response.json() flow. Add a defensive fallback so the test doesn’t hard-fail if the response is disposed or aborted.

💡 Proposed fix
     await page.route('**/api/settings/global', async (route) => {
-      const response = await route.fetch();
-      const json = await response.json();
+      const response = await route.fetch();
+      let json;
+      try {
+        json = await response.json();
+      } catch {
+        await route.continue();
+        return;
+      }
       if (json.settings) {
         // Remove currentProjectId to prevent restoring a project
         json.settings.currentProjectId = null;
@@
       await route.fulfill({
         status: response.status(),
         headers: response.headers(),
         json,
       });
     });
🤖 Fix all issues with AI agents
In
`@apps/ui/src/components/layout/project-switcher/components/project-switcher-item.tsx`:
- Around line 40-55: The sanitizedName computation can produce an empty string
(e.g., project.name contains only symbols/whitespace), causing testId
(`project-switcher-${project.id}-${sanitizedName}`) to end with a trailing
hyphen; update the code around sanitizedName and testId to handle that case by
using a fallback: after computing sanitizedName, if it's empty either set a
default token (e.g., 'untitled' or 'unknown') or build testId conditionally so
you only append `-${sanitizedName}` when sanitizedName.length > 0; adjust the
variables named sanitizedName and testId in project-switcher-item.tsx (and the
analogous occurrence at the other location) accordingly.
♻️ Duplicate comments (2)
apps/ui/tests/projects/new-project-creation.spec.ts (1)

81-83: Align selector with sanitized test-id format.

Same concern as the open-existing test: the selector should use the sanitized name to match project-switcher-{id}-{sanitizedName}.

apps/ui/tests/features/feature-manual-review-flow.spec.ts (1)

134-136: Align selector with sanitized test-id format.

Same concern as the other updated tests: use a sanitized project name (or shared helper) when building the ends-with selector.

@DhanushSantosh DhanushSantosh merged commit 0c053da into AutoMaker-Org:v0.13.0rc Jan 18, 2026
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants