diff --git a/e2e-tests/approve.spec.ts b/e2e-tests/approve.spec.ts
new file mode 100644
index 0000000..5624ab7
--- /dev/null
+++ b/e2e-tests/approve.spec.ts
@@ -0,0 +1,16 @@
+import { test } from "./helpers/test_helper";
+import { expect } from "@playwright/test";
+
+test("write to index, approve, check preview", async ({ po }) => {
+ await po.setUp();
+ await po.sendPrompt("tc=write-index");
+ await po.snapshotMessages();
+ await po.approveProposal();
+
+ // Should be slightly different from above, because it will say "approved"
+ await po.snapshotMessages();
+
+ // This can be pretty slow because it's waiting for the app to build.
+ await expect(po.getPreviewIframeElement()).toBeVisible({ timeout: 15_000 });
+ await po.snapshotPreview();
+});
diff --git a/e2e-tests/fixtures/write-index.md b/e2e-tests/fixtures/write-index.md
new file mode 100644
index 0000000..6e48a9a
--- /dev/null
+++ b/e2e-tests/fixtures/write-index.md
@@ -0,0 +1,15 @@
+OK, I'm going to do some writing now...
+
+
+const Index = () => {
+ return (
+
+ Testing:write-index!
+
+ );
+};
+
+export default Index;
+
+
+And it's done!
diff --git a/e2e-tests/helpers/test_helper.ts b/e2e-tests/helpers/test_helper.ts
index 527e76e..c119298 100644
--- a/e2e-tests/helpers/test_helper.ts
+++ b/e2e-tests/helpers/test_helper.ts
@@ -20,6 +20,23 @@ class PageObject {
await expect(this.page.getByTestId("messages-list")).toMatchAriaSnapshot();
}
+ async approveProposal() {
+ await this.page.getByTestId("approve-proposal-button").click();
+ }
+
+ async rejectProposal() {
+ await this.page.getByTestId("reject-proposal-button").click();
+ }
+
+ getPreviewIframeElement() {
+ return this.page.getByTestId("preview-iframe-element");
+ }
+
+ async snapshotPreview() {
+ const iframe = this.getPreviewIframeElement();
+ await expect(iframe.contentFrame().locator("body")).toMatchAriaSnapshot();
+ }
+
async snapshotServerDump() {
// Get the text content of the messages list
const messagesListText = await this.page
@@ -199,11 +216,12 @@ export const test = base.extend<{
{ auto: true },
],
attachScreenshotsToReport: [
- async ({ page }, use, testInfo) => {
+ async ({ electronApp }, use, testInfo) => {
await use();
// After the test we can check whether the test passed or failed.
if (testInfo.status !== testInfo.expectedStatus) {
+ const page = await electronApp.firstWindow();
const screenshot = await page.screenshot();
await testInfo.attach("screenshot", {
body: screenshot,
diff --git a/e2e-tests/reject.spec.ts b/e2e-tests/reject.spec.ts
new file mode 100644
index 0000000..1ad9038
--- /dev/null
+++ b/e2e-tests/reject.spec.ts
@@ -0,0 +1,14 @@
+import { test } from "./helpers/test_helper";
+import { expect } from "@playwright/test";
+
+test("reject", async ({ po }) => {
+ await po.setUp();
+ await po.sendPrompt("tc=write-index");
+ await po.snapshotMessages();
+ await po.rejectProposal();
+
+ // Should be slightly different from above, because it will say "rejected"
+ await po.snapshotMessages();
+
+ await expect(po.getPreviewIframeElement()).not.toBeVisible();
+});
diff --git a/e2e-tests/snapshots/approve.spec.ts_write-to-index-approve-check-preview-1.aria.yml b/e2e-tests/snapshots/approve.spec.ts_write-to-index-approve-check-preview-1.aria.yml
new file mode 100644
index 0000000..89efbdc
--- /dev/null
+++ b/e2e-tests/snapshots/approve.spec.ts_write-to-index-approve-check-preview-1.aria.yml
@@ -0,0 +1,9 @@
+- paragraph: tc=write-index
+- paragraph: OK, I'm going to do some writing now...
+- img
+- text: Index.tsx
+- img
+- text: "src/pages/Index.tsx Summary: write-description"
+- paragraph: And it's done!
+- button "Retry":
+ - img
\ No newline at end of file
diff --git a/e2e-tests/snapshots/approve.spec.ts_write-to-index-approve-check-preview-2.aria.yml b/e2e-tests/snapshots/approve.spec.ts_write-to-index-approve-check-preview-2.aria.yml
new file mode 100644
index 0000000..0b43a10
--- /dev/null
+++ b/e2e-tests/snapshots/approve.spec.ts_write-to-index-approve-check-preview-2.aria.yml
@@ -0,0 +1,13 @@
+- paragraph: tc=write-index
+- paragraph: OK, I'm going to do some writing now...
+- img
+- text: Index.tsx
+- img
+- text: "src/pages/Index.tsx Summary: write-description"
+- paragraph: And it's done!
+- img
+- text: Approved
+- button "Undo":
+ - img
+- button "Retry":
+ - img
\ No newline at end of file
diff --git a/e2e-tests/snapshots/approve.spec.ts_write-to-index-approve-check-preview-3.aria.yml b/e2e-tests/snapshots/approve.spec.ts_write-to-index-approve-check-preview-3.aria.yml
new file mode 100644
index 0000000..d176260
--- /dev/null
+++ b/e2e-tests/snapshots/approve.spec.ts_write-to-index-approve-check-preview-3.aria.yml
@@ -0,0 +1,4 @@
+- region "Notifications (F8)":
+ - list
+- region "Notifications alt+T"
+- text: Testing:write-index!
\ No newline at end of file
diff --git a/e2e-tests/snapshots/reject.spec.ts_reject-1.aria.yml b/e2e-tests/snapshots/reject.spec.ts_reject-1.aria.yml
new file mode 100644
index 0000000..89efbdc
--- /dev/null
+++ b/e2e-tests/snapshots/reject.spec.ts_reject-1.aria.yml
@@ -0,0 +1,9 @@
+- paragraph: tc=write-index
+- paragraph: OK, I'm going to do some writing now...
+- img
+- text: Index.tsx
+- img
+- text: "src/pages/Index.tsx Summary: write-description"
+- paragraph: And it's done!
+- button "Retry":
+ - img
\ No newline at end of file
diff --git a/e2e-tests/snapshots/reject.spec.ts_reject-2.aria.yml b/e2e-tests/snapshots/reject.spec.ts_reject-2.aria.yml
new file mode 100644
index 0000000..5217ba1
--- /dev/null
+++ b/e2e-tests/snapshots/reject.spec.ts_reject-2.aria.yml
@@ -0,0 +1,11 @@
+- paragraph: tc=write-index
+- paragraph: OK, I'm going to do some writing now...
+- img
+- text: Index.tsx
+- img
+- text: "src/pages/Index.tsx Summary: write-description"
+- paragraph: And it's done!
+- img
+- text: Rejected
+- button "Retry":
+ - img
\ No newline at end of file
diff --git a/src/components/chat/ChatInput.tsx b/src/components/chat/ChatInput.tsx
index de8f5b2..1436fc0 100644
--- a/src/components/chat/ChatInput.tsx
+++ b/src/components/chat/ChatInput.tsx
@@ -673,6 +673,7 @@ function ChatInputActions({
variant="outline"
onClick={onApprove}
disabled={!isApprovable || isApproving || isRejecting}
+ data-testid="approve-proposal-button"
>
{isApproving ? (
@@ -687,6 +688,7 @@ function ChatInputActions({
variant="outline"
onClick={onReject}
disabled={!isApprovable || isApproving || isRejecting}
+ data-testid="reject-proposal-button"
>
{isRejecting ? (
diff --git a/src/components/preview_panel/PreviewIframe.tsx b/src/components/preview_panel/PreviewIframe.tsx
index 0541a89..4e6af66 100644
--- a/src/components/preview_panel/PreviewIframe.tsx
+++ b/src/components/preview_panel/PreviewIframe.tsx
@@ -464,6 +464,7 @@ export const PreviewIframe = ({ loading }: { loading: boolean }) => {
) : (