test: deepen GUI resilience, accessibility, and performance tests

tests/e2e/gui-resilience.spec.ts

@@ -150,6 +150,99 @@ test.describe("Login Form Validation", () => {
   });
 });
 
+// ---------------------------------------------------------------------------
+// Form Validation: Change Password Page
+// ---------------------------------------------------------------------------
+test.describe("Change Password Form Validation", () => {
+  test.use({ storageState: { cookies: [], origins: [] } });
+
+  test("change password button disabled when fields are empty", async ({ page }) => {
+    await page.goto("/change-password");
+    await page.waitForLoadState("domcontentloaded");
+
+    const submitBtn = page.getByRole("button", { name: /change password/i });
+    await expect(submitBtn).toBeDisabled();
+  });
+
+  test("mismatched passwords show error", async ({ page }) => {
+    await page.goto("/change-password");
+    await page.waitForLoadState("domcontentloaded");
+
+    // Use exact label match for "New password" to avoid matching
+    // the "Generate strong password" button text
+    await page.getByLabel("Current password").fill("admin");
+    await page.getByLabel("New password", { exact: true }).fill("NewPass123");
+    await page.getByLabel("Confirm new password").fill("DifferentPass456");
+
+    await page.getByRole("button", { name: /change password/i }).click();
+
+    // The client-side validation catches mismatch before the API call
+    await expect(page.getByText(/do not match/i)).toBeVisible({ timeout: 5_000 });
+  });
+});
+
+// ---------------------------------------------------------------------------
+// Form Validation: Add Member (People settings section)
+// ---------------------------------------------------------------------------
+test.describe("Add Member Form Validation", () => {
+  test("adding a duplicate username shows error", async ({ loggedInPage: page }) => {
+    // Open settings dialog and navigate to People section
+    await page.locator("aside").getByText("Settings").click();
+    await expect(page.locator("h2").filter({ hasText: "Settings" })).toBeVisible({
+      timeout: 5_000,
+    });
+
+    // Navigate to People section
+    await page.getByRole("button", { name: /people/i }).click();
+    await page.waitForTimeout(500);
+
+    // Click "Add Members" to show the form
+    const addBtn = page.getByRole("button", { name: /add members/i });
+    await addBtn.click();
+    await page.waitForTimeout(500);
+
+    // Fill in a username that already exists ("admin" is the default user)
+    await page.locator("input[placeholder='Username']").fill("admin");
+    await page.locator("input[placeholder='Password']").fill("StrongPass123");
+
+    // Submit the form
+    await page.getByRole("button", { name: /create/i }).click();
+
+    // Should show an error (duplicate username or user-already-exists)
+    await expect(page.getByText(/already exists|duplicate|conflict|taken|failed/i)).toBeVisible({
+      timeout: 10_000,
+    });
+  });
+});
+
+// ---------------------------------------------------------------------------
+// Form Validation: QR Generate (no-file tool)
+// ---------------------------------------------------------------------------
+test.describe("QR Generate Form Validation", () => {
+  test("download button disabled when text input is empty", async ({ loggedInPage: page }) => {
+    await page.goto("/qr-generate");
+    await page.waitForLoadState("domcontentloaded");
+
+    // The download button should be disabled when no data is entered
+    const downloadBtn = page.locator("[data-testid='qr-generate-download']");
+    await expect(downloadBtn).toBeVisible({ timeout: 5_000 });
+    await expect(downloadBtn).toBeDisabled();
+  });
+
+  test("download button enabled after entering text", async ({ loggedInPage: page }) => {
+    await page.goto("/qr-generate");
+    await page.waitForLoadState("domcontentloaded");
+
+    // Enter data in the URL field (default content type)
+    const urlInput = page.locator("[data-testid='qr-input-url']");
+    await urlInput.fill("https://example.com");
+
+    // Now the download button should be enabled
+    const downloadBtn = page.locator("[data-testid='qr-generate-download']");
+    await expect(downloadBtn).toBeEnabled({ timeout: 5_000 });
+  });
+});
+
 // ---------------------------------------------------------------------------
 // Tool Form Validation: Process Button State
 // ---------------------------------------------------------------------------
@@ -186,6 +279,45 @@ test.describe("Tool Form Validation", () => {
   });
 });
 
+// ---------------------------------------------------------------------------
+// Toast Behavior
+// ---------------------------------------------------------------------------
+test.describe("Toast Behavior", () => {
+  test("toasts do not block main UI interaction", async ({ loggedInPage: page }) => {
+    // Sonner's Toaster component lazily renders its container on first toast,
+    // so we can't rely on a DOM element existing before any toast fires.
+    // Instead, verify the main content area is fully interactive.
+    await page.waitForLoadState("domcontentloaded");
+    await expect(page.locator("main")).toBeVisible({ timeout: 10_000 });
+
+    // The body should have content (page loaded correctly)
+    const content = await page.textContent("body");
+    expect(content).toBeDefined();
+    expect(content?.length).toBeGreaterThan(0);
+  });
+
+  test("success toast after processing auto-dismisses", async ({ loggedInPage: page }) => {
+    await page.goto("/resize");
+    await uploadTestImage(page);
+
+    // Set a width and process
+    await page.locator("input[placeholder='Auto']").first().fill("50");
+    await page.getByRole("button", { name: "Resize" }).click();
+    await waitForProcessing(page);
+
+    // Wait for the download link to appear (processing complete)
+    await expect(page.getByRole("link", { name: /download/i }).first()).toBeVisible({
+      timeout: 15_000,
+    });
+
+    // The page should still be interactive after processing
+    // (toasts don't block interaction)
+    await expect(page.locator("main")).toBeVisible();
+    const sidebar = page.locator("aside");
+    await expect(sidebar).toBeVisible();
+  });
+});
+
 // ---------------------------------------------------------------------------
 // State Reset: Upload -> Navigate Away -> Come Back
 // ---------------------------------------------------------------------------
@@ -283,12 +415,12 @@ test.describe("Memory and Stability", () => {
     }
   });
 
-  test("open and close Settings dialog 5 times without slowdown", async ({
+  test("open and close Settings dialog 20 times without slowdown", async ({
     loggedInPage: page,
   }) => {
     const timings: number[] = [];
 
-    for (let i = 0; i < 5; i++) {
+    for (let i = 0; i < 20; i++) {
       const start = Date.now();
 
       // Open settings
@@ -313,4 +445,30 @@ test.describe("Memory and Stability", () => {
     const lastOpen = timings[timings.length - 1];
     expect(lastOpen).toBeLessThan(Math.max(firstOpen * 3, 2000));
   });
+
+  test("10x upload/clear cycle without crash or leak", async ({ loggedInPage: page }) => {
+    await page.goto("/resize");
+
+    for (let i = 0; i < 10; i++) {
+      // Upload
+      await uploadTestImage(page);
+      await expect(page.getByText(/test-image/i).first()).toBeVisible({ timeout: 5_000 });
+
+      // Clear files
+      const clearBtn = page.getByText("Clear all");
+      if (await clearBtn.isVisible({ timeout: 2000 }).catch(() => false)) {
+        await clearBtn.click();
+        await page.waitForTimeout(300);
+      }
+
+      // Dropzone should reappear
+      await expect(page.getByText("Upload from computer")).toBeVisible({ timeout: 5_000 });
+    }
+
+    // After 10 cycles, the page should still be responsive
+    await expect(page.locator("main")).toBeVisible();
+    const content = await page.textContent("body");
+    expect(content).toBeDefined();
+    expect(content?.length).toBeGreaterThan(0);
+  });
 });