Upload image via chat (#686)

e2e-tests/attach_image.spec.ts

@@ -1,4 +1,6 @@
+import path from "path";
 import { test } from "./helpers/test_helper";
+import { expect } from "@playwright/test";
 import * as fs from "fs";
 
 // It's hard to read the snapshots, but they should be identical across
@@ -15,7 +17,7 @@ test("attach image - home chat", async ({ po }) => {
 
   await po
     .getHomeChatInputContainer()
-    .locator("input[type='file']")
+    .getByTestId("chat-context-file-input")
     .setInputFiles("e2e-tests/fixtures/images/logo.png");
   await po.sendPrompt("[dump]");
   await po.snapshotServerDump("last-message", { name: SNAPSHOT_NAME });
@@ -29,13 +31,40 @@ test("attach image - chat", async ({ po }) => {
   // attach via file input (click-to-upload)
   await po
     .getChatInputContainer()
-    .locator("input[type='file']")
+    .getByTestId("chat-context-file-input")
     .setInputFiles("e2e-tests/fixtures/images/logo.png");
   await po.sendPrompt("[dump]");
   await po.snapshotServerDump("last-message", { name: SNAPSHOT_NAME });
   await po.snapshotMessages({ replaceDumpPath: true });
 });
 
+test("attach image - chat - upload to codebase", async ({ po }) => {
+  await po.setUp({ autoApprove: true });
+  await po.sendPrompt("basic");
+
+  // attach via file input (click-to-upload)
+  await po
+    .getChatInputContainer()
+    .getByTestId("upload-to-codebase-file-input")
+    .setInputFiles("e2e-tests/fixtures/images/logo.png");
+  await po.sendPrompt("[[UPLOAD_IMAGE_TO_CODEBASE]]");
+
+  await po.snapshotServerDump("last-message", { name: "upload-to-codebase" });
+  await po.snapshotMessages({ replaceDumpPath: true });
+
+  // new/image/file.png
+  const appPath = await po.getCurrentAppPath();
+  const filePath = path.join(appPath, "new", "image", "file.png");
+  expect(fs.existsSync(filePath)).toBe(true);
+  // check contents of filePath is equal in value to e2e-tests/fixtures/images/logo.png
+  const expectedContents = fs.readFileSync(
+    "e2e-tests/fixtures/images/logo.png",
+    "base64",
+  );
+  const actualContents = fs.readFileSync(filePath, "base64");
+  expect(actualContents).toBe(expectedContents);
+});
+
 // attach image via drag-and-drop to chat input container
 test("attach image via drag - chat", async ({ po }) => {
   await po.setUp({ autoApprove: true });

e2e-tests/snapshots/attach_image.spec.ts_attach-image---chat---upload-to-codebase-1.aria.yml

@@ -0,0 +1,23 @@
+- paragraph: basic
+- img
+- text: file1.txt
+- img
+- text: file1.txt
+- paragraph: More EOM
+- img
+- text: Approved
+- paragraph: "[[UPLOAD_IMAGE_TO_CODEBASE]]"
+- paragraph: "Attachments:"
+- paragraph: "File to upload to codebase: logo.png (file id: DYAD_ATTACHMENT_0)"
+- paragraph: Uploading image to codebase
+- img
+- text: file.png
+- img
+- text: "new/image/file.png Summary: Uploaded image to codebase"
+- paragraph: "[[dyad-dump-path=*]]"
+- img
+- text: Approved
+- button "Undo":
+  - img
+- button "Retry":
+  - img

e2e-tests/snapshots/attach_image.spec.ts_upload-to-codebase

@@ -0,0 +1,3 @@
+===
+role: user
+message: [{"type":"text","text":"[[UPLOAD_IMAGE_TO_CODEBASE]]\n\nAttachments:\n\n\nFile to upload to codebase: logo.png (file id: DYAD_ATTACHMENT_0)"},{"type":"image_url","image_url":{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAhGVYSWZNTQAqAAAACAAFARIAAwAAAAEAAQAAARoABQAAAAEAAABKARsABQAAAAEAAABSASgAAwAAAAEAAgAAh2kABAAAAAEAAABaAAAAAAAAAEgAAAABAAAASAAAAAEAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAADHbxzxAAAACXBIWXMAAAsTAAALEwEAmpwYAAABWWlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNi4wLjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp0aWZmPSJodHRwOi8vbnMuYWRvYmUuY29tL3RpZmYvMS4wLyI+CiAgICAgICAgIDx0aWZmOk9yaWVudGF0aW9uPjE8L3RpZmY6T3JpZW50YXRpb24+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgoZXuEHAAACbElEQVQ4EY1TTWgTQRR+M7NpQoKmPVTPQi/qoaDWQAsxIigqRS/JzYNHxVz0oAcrG6hQoV68ePNQECUpeBFBIqQiVBrbaqvgoXjRSzVJf8zfzu7MG2eWbGywFN8e3ux73/fNm/dmAP7TFCgSQHeurSC4t1eEAFET4+WjzPIq5AX5ZURMjO5GNEk7VbJKKWU9Or8WBg2cvPRxlLXiX7arVtFWNjVkzSX/VJBPK0YKRMIciI6477kjhsDrAxfJoebVUwd0bl1vBD0ChpzR5JkrKzGvjum2B8MtrphLRXGTY5RKCaioi7wr/lcgID+//Omsu4EzERg4GIIoWAygxrezwOvNhmiAoCrkCtZtqF9BPp33d86nl46jw173aWKtXWtzWi21kELDgzOo+mJCCRBIFIowBr3rOQK4bDJC90PVrf5Ayi/efDP62QBvn14Y5m0sKogOCoWy/nvL55syqOl4ppCRT6+9GxAKjgmtLYg3ldVkM4Hs0Fr4QSmxwi28T1gUHE+J9rpGdozqRvoWcmKWUMpyEXWH2IYJiq0KtQYr/qgRWc3T4lJ/IbNVx/xmmCrMXJ+ML3+wZP+Jmre5MN8/NVYoFKTB2XbJ+vYyPi9l/4hLq+XZpZMJ0BxzP3z1XGpO99qUDg897VFGEkd+3lm9lVy8e2NsceL7q/iqwvCIohIYU9MGm+pwuuOwbUVtm+D0uXIO5b57noxCWzJoSQJNIaAhm8BxMze7PGbboLFA/El0BYxqcJTJC+Vkg5PrLU4PO1KBg/jVo87jZ++Tb4PSDX5XMxdq14QOpvfI9XDMxTKPKQim9DqtY8H/Tv8HGFE+AZtzYdAAAAAASUVORK5CYII="}}]