refactor: consolidate auth logic into helper, add letter E2E tests,

2026-05-04 08:56:52 +00:00 · 2026-04-15 01:43:03 +05:30
parent 9c6400b18a
commit 5594ac50d0
5 changed files with 156 additions and 57 deletions
@@ -0,0 +1,101 @@
+import { expect, test } from "@playwright/test";
+import { AuthHelper } from "./utils/auth";
+
+test.describe("Letter Drafting (Real Backend)", () => {
+  const password = "Password123!";
+
+  test("should create, store as draft, and persist data", async ({ page }) => {
+    const timestamp = Date.now() + Math.random();
+    const email = `draft-${timestamp}@example.com`;
+    const name = `Draft Author ${timestamp}`;
+
+    await AuthHelper.registerAndLogin(page, email, name, password);
+
+    console.log(">> [Draft] Navigating to Editor via UI...");
+    await page.getByRole("button", { name: /write something/i }).click();
+
+    console.log(`>> [Draft] Current URL after click: ${page.url()}`);
+
+    // Wait for the recipient input to be present in the DOM
+    const recipientInput = page.locator("#recipient");
+    await recipientInput.waitFor({ state: "visible", timeout: 20000 });
+
+    const recipientName = "Dear Friend";
+    await recipientInput.fill(recipientName);
+
+    // Type into the Fabric.js canvas
+    console.log(">> [Draft] Typing into canvas...");
+    const canvasInput = page.getByLabel("Canvas text input");
+    await canvasInput.waitFor({ state: "visible" });
+    await canvasInput.focus();
+    await canvasInput.fill("This is a secret draft created by E2E testing.");
+
+    // Store as draft
+    console.log(">> [Draft] Clicking Store...");
+    await page.getByRole("button", { name: /store/i }).click();
+
+    // Verify Success Modal/Alert
+    await expect(page.getByText(/your letter is saved/i)).toBeVisible();
+
+    // Verify URL updated with a UUID
+    await expect(page).toHaveURL(/\/quill\/[0-9a-f-]{36}/);
+    const savedUrl = page.url();
+    console.log(`>> [Draft] Saved URL: ${savedUrl}`);
+
+    // Reload and verify persistence
+    console.log(">> [Draft] Reloading to verify persistence...");
+    await page.goto(savedUrl);
+
+    // Wait for initial load overlay to disappear
+    await expect(page.getByText(/opening your draft/i)).toBeHidden();
+
+    // Check recipient
+    await expect(page.locator("#recipient")).toHaveValue(recipientName);
+
+    // Check canvas content
+    await expect(canvasInput).toHaveValue(/This is a secret draft/);
+  });
+
+  test("should seal a letter and show sharing link", async ({ page }) => {
+    const timestamp = Date.now() + Math.random();
+    const email = `seal-${timestamp}@example.com`;
+    const name = `Seal Author ${timestamp}`;
+
+    await AuthHelper.registerAndLogin(page, email, name, password);
+
+    console.log(">> [Seal] Navigating to Editor via UI...");
+    await page.getByRole("button", { name: /write something/i }).click();
+
+    const recipientInput = page.locator("#recipient");
+    await recipientInput.waitFor({ state: "visible", timeout: 20000 });
+    await recipientInput.fill("A Secret Guest");
+
+    const canvasInput = page.getByLabel("Canvas text input");
+    await canvasInput.focus();
+    await canvasInput.fill("This letter will be sealed and shared.");
+
+    // Click Seal
+    console.log(">> [Seal] Clicking Seal...");
+    await page.getByRole("button", { name: /seal/i }).click();
+
+    // Verify "Sealed & Ready" modal
+    console.log(">> [Seal] Verifying sharing modal...");
+    await expect(page.getByText(/sealed & ready/i)).toBeVisible();
+
+    // Verify sharing link contains a hash (the key)
+    const linkInput = page.locator("input[readOnly]");
+    const linkValue = await linkInput.inputValue();
+
+    expect(linkValue).toContain("/read/");
+    expect(linkValue).toContain("#");
+
+    console.log(`>> [Seal] Sharing link generated: ${linkValue}`);
+
+    // Verify "Copy" button works
+    await expect(page.getByRole("button", { name: /copy/i })).toBeVisible();
+
+    // Close modal
+    await page.getByRole("button", { name: /close/i }).click();
+    await expect(page.getByText(/sealed & ready/i)).toBeHidden();
+  });
+});