Improve image attachement e2e test (#2168)

 ## Summary by cubic Switched image attachment e2e tests to use Playwright’s native file chooser instead of setting hidden inputs. This reduces flakiness and matches real user behavior. - **Bug Fixes** - Wait for the file chooser before clicking the menu item, then set files via the dialog. - Removed hidden input selectors and Escape key handling. - Updated home chat, chat, and upload-to-codebase tests. <sup>Written for commit 7afe922fa377ad29f0af880ed466a9ed31e0c602. Summary will update on new commits.</sup>

Improve image attachement e2e test (#2168)
3b66d4de · Mohamed Aziz Mejri · GitHub · 398f6afa · 3b66d4de
--- a/e2e-tests/attach_image.spec.ts
+++ b/e2e-tests/attach_image.spec.ts
@@ -24,13 +24,15 @@ test("attach image - home chat", async ({ po }) => {
  // Hover over "Attach files" to open submenu
  await po.page.getByRole("menuitem", { name: "Attach files" }).hover();

-  // attach via file input (click-to-upload)
-  await po.page
-    .getByTestId("chat-context-file-input")
-    .setInputFiles("e2e-tests/fixtures/images/logo.png");
+  // Set up file chooser listener BEFORE clicking the menu item
+  const fileChooserPromise = po.page.waitForEvent("filechooser");

-  // Close the menu by pressing Escape
-  await po.page.keyboard.press("Escape");
+  // Click the menu item to trigger the file picker
+  await po.page.getByText("Attach file as chat context").click();
+
+  // Handle the file chooser dialog
+  const fileChooser = await fileChooserPromise;
+  await fileChooser.setFiles("e2e-tests/fixtures/images/logo.png");

  await po.sendPrompt("[dump]");
  await po.snapshotServerDump("last-message", { name: SNAPSHOT_NAME });
@@ -50,13 +52,15 @@ test("attach image - chat", async ({ po }) => {
  // Hover over "Attach files" to open submenu
  await po.page.getByRole("menuitem", { name: "Attach files" }).hover();

-  // attach via file input (click-to-upload)
-  await po.page
-    .getByTestId("chat-context-file-input")
-    .setInputFiles("e2e-tests/fixtures/images/logo.png");
+  // Set up file chooser listener BEFORE clicking the menu item
+  const fileChooserPromise = po.page.waitForEvent("filechooser");
+
+  // Click the menu item to trigger the file picker
+  await po.page.getByText("Attach file as chat context").click();

-  // Close the menu by pressing Escape
-  await po.page.keyboard.press("Escape");
+  // Handle the file chooser dialog
+  const fileChooser = await fileChooserPromise;
+  await fileChooser.setFiles("e2e-tests/fixtures/images/logo.png");

  await po.sendPrompt("[dump]");
  await po.snapshotServerDump("last-message", { name: SNAPSHOT_NAME });
@@ -76,13 +80,15 @@ test("attach image - chat - upload to codebase", async ({ po }) => {
  // Hover over "Attach files" to open submenu
  await po.page.getByRole("menuitem", { name: "Attach files" }).hover();

-  // attach via file input (click-to-upload)
-  await po.page
-    .getByTestId("upload-to-codebase-file-input")
-    .setInputFiles("e2e-tests/fixtures/images/logo.png");
+  // Set up file chooser listener BEFORE clicking the menu item
+  const fileChooserPromise = po.page.waitForEvent("filechooser");
+
+  // Click the menu item to trigger the file picker
+  await po.page.getByText("Upload file to codebase").click();

-  // Close the menu by pressing Escape
-  await po.page.keyboard.press("Escape");
+  // Handle the file chooser dialog
+  const fileChooser = await fileChooserPromise;
+  await fileChooser.setFiles("e2e-tests/fixtures/images/logo.png");

  await po.sendPrompt("[[UPLOAD_IMAGE_TO_CODEBASE]]");