Fix flaky e2e tests with better selectors and waits (#2498)

e2e-tests/delete_app.spec.ts

@@ -23,5 +23,5 @@ testSkipIfWindows("delete app", async ({ po }) => {
   // Make sure the app is deleted
   await po.isCurrentAppNameNone();
   expect(fs.existsSync(appPath)).toBe(false);
-  expect(po.getAppListItem({ appName })).not.toBeVisible();
+  await expect(po.getAppListItem({ appName })).not.toBeVisible();
 });

e2e-tests/favorite_app.spec.ts

@@ -29,7 +29,7 @@ test.describe("Favorite App Tests", () => {
 
     // Check that the star is filled (favorited)
     const star = favoriteButton.locator("svg");
-    await expect(star).toHaveClass(/fill-\[#6c55dc\]/);
+    await expect(star).toHaveClass(/(?:^|\s)fill-\[#6c55dc\]/);
   });
 
   test("Remove app from favorite", async ({ po }) => {
@@ -57,7 +57,7 @@ test.describe("Favorite App Tests", () => {
 
     // Check that the star is filled (favorited)
     const star = favoriteButton.locator("svg");
-    await expect(star).toHaveClass(/fill-\[#6c55dc\]/);
+    await expect(star).toHaveClass(/(?:^|\s)fill-\[#6c55dc\]/);
 
     // Now, remove from favorite
     const unfavoriteButton = appItem
@@ -67,6 +67,7 @@ test.describe("Favorite App Tests", () => {
     await unfavoriteButton.click();
 
     // Check that the star is not filled (unfavorited)
-    await expect(star).not.toHaveClass(/fill-\[#6c55dc\]/);
+    // Match fill-[#6c55dc] only at start or after whitespace (not as part of hover:fill-...)
+    await expect(star).not.toHaveClass(/(?:^|\s)fill-\[#6c55dc\]/);
   });
 });

e2e-tests/file_tree_search.spec.ts

@@ -20,7 +20,7 @@ test("file tree search finds content matches and surfaces line numbers", async (
 
   // Content search should find files whose contents match the query and show line info
   await searchInput.fill("import");
-  const resultItem = po.page.getByText("App.tsx").first();
+  const resultItem = po.page.getByText("main.tsx").first();
   await expect(resultItem).toBeVisible({ timeout: Timeout.MEDIUM });
 
   // Files are collapsed by default in the new accordion UI, so we need to click to expand

e2e-tests/git_collaboration.spec.ts

@@ -37,7 +37,7 @@ test.describe("Git Collaboration", () => {
     await expect(
       po.page.getByTestId("branch-actions-menu-trigger"),
     ).toBeVisible({
-      timeout: 10000,
+      timeout: Timeout.MEDIUM,
     });
     await po.page.getByTestId("branch-actions-menu-trigger").click();
     await po.page.getByTestId("create-branch-trigger").click();
@@ -93,9 +93,19 @@ test.describe("Git Collaboration", () => {
       "main",
     );
 
+    // Helper to ensure branch item is visible (expands accordion if needed)
+    async function ensureBranchItemVisible(branchName: string) {
+      const branchItem = po.page.getByTestId(`branch-item-${branchName}`);
+      if (!(await branchItem.isVisible().catch(() => false))) {
+        await branchesCard.click();
+      }
+      await expect(branchItem).toBeVisible({ timeout: Timeout.MEDIUM });
+    }
+
     // Rename feature-2 to feature-2-renamed
     const renamedBranch = "feature-2-renamed";
-    await branchesCard.click();
+    // Ensure the branches accordion is expanded (it may already be expanded, so check first)
+    await ensureBranchItemVisible(featureBranch2);
     await po.page.getByTestId(`branch-actions-${featureBranch2}`).click();
     await po.page.getByTestId("rename-branch-menu-item").click();
     await po.page.getByTestId("rename-branch-input").fill(renamedBranch);
@@ -147,7 +157,8 @@ test.describe("Git Collaboration", () => {
     expect(fs.existsSync(mergeTestFilePath)).toBe(false);
 
     // Merge feature-1 into main (we are currently on main)
-    await branchesCard.click();
+    // Ensure the branches accordion is expanded
+    await ensureBranchItemVisible(featureBranch);
     await po.page.getByTestId(`branch-actions-${featureBranch}`).click();
     await po.page.getByTestId("merge-branch-menu-item").click();
     await po.page.getByTestId("merge-branch-submit-button").click();
@@ -177,7 +188,8 @@ test.describe("Git Collaboration", () => {
 
     // 5. Delete Branch
     // Delete feature-1
-    await branchesCard.click();
+    // Ensure the branches accordion is expanded
+    await ensureBranchItemVisible(featureBranch);
     await po.page.getByTestId(`branch-actions-${featureBranch}`).click();
     await po.page.getByTestId("delete-branch-menu-item").click();
     await po.page.getByRole("button", { name: "Delete Branch" }).click();
@@ -230,7 +242,7 @@ test.describe("Git Collaboration", () => {
     await expect(
       po.page.getByTestId("branch-actions-menu-trigger"),
     ).toBeVisible({
-      timeout: 10000,
+      timeout: Timeout.MEDIUM,
     });
 
     // Test git pull - should succeed with no remote changes

e2e-tests/mention_files.spec.ts

-import { test } from "./helpers/test_helper";
+import { expect } from "@playwright/test";
+import { test, Timeout } from "./helpers/test_helper";
 
 test("mention file", async ({ po }) => {
   await po.setUp({ autoApprove: true });
@@ -6,8 +7,14 @@ test("mention file", async ({ po }) => {
   await po.importApp("minimal-with-ai-rules");
   await po.goToAppsTab();
   await po.getChatInput().click();
-  await po.getChatInput().fill("[dump] @");
-  await po.page.getByRole("menuitem", { name: "Choose AI_RULES.md" }).click();
+  // Use pressSequentially so the mention trigger (@) is properly detected by Lexical
+  await po.getChatInput().pressSequentially("[dump] @");
+  // Wait for the mention menu to appear
+  const menuItem = po.page.getByRole("menuitem", {
+    name: "Choose AI_RULES.md",
+  });
+  await expect(menuItem).toBeVisible({ timeout: Timeout.MEDIUM });
+  await menuItem.click();
   await po.page.getByRole("button", { name: "Send message" }).click();
   await po.waitForChatCompletion();
 

e2e-tests/supabase_migrations.spec.ts

 import { expect } from "@playwright/test";
-import { testSkipIfWindows } from "./helpers/test_helper";
+import { testSkipIfWindows, Timeout } from "./helpers/test_helper";
 import fs from "fs-extra";
 import path from "path";
 import { execSync } from "child_process";
@@ -28,7 +28,10 @@ testSkipIfWindows("supabase migrations", async ({ po }) => {
   const migrationsSwitch = po.page.getByRole("switch", {
     name: "Write SQL migration files",
   });
+  await expect(migrationsSwitch).toBeVisible({ timeout: Timeout.MEDIUM });
   await migrationsSwitch.click();
+  // Wait for the setting to be persisted
+  await expect(migrationsSwitch).toBeChecked();
   await po.goToChatTab();
 
   // Send a prompt that triggers a migration
@@ -91,7 +94,10 @@ testSkipIfWindows("supabase migrations with native git", async ({ po }) => {
   const migrationsSwitch = po.page.getByRole("switch", {
     name: "Write SQL migration files",
   });
+  await expect(migrationsSwitch).toBeVisible({ timeout: Timeout.MEDIUM });
   await migrationsSwitch.click();
+  // Wait for the setting to be persisted
+  await expect(migrationsSwitch).toBeChecked();
   await po.goToChatTab();
 
   // Send a prompt that triggers a migration