Initial Commit

apps/testbed/e2e/extensions/autofill-detection.spec.ts

@@ -0,0 +1,55 @@
+import { test, expect } from "@playwright/test";
+
+test.describe("Autofill Detection", () => {
+  test("extension-test page renders without extension", async ({ page }) => {
+    await page.goto("/extension-test");
+    await expect(page.locator('[data-testid="page-title"]')).toContainText(
+      "Extension Test",
+    );
+    await expect(page.locator('[data-testid="demo-card"]')).toBeVisible();
+  });
+
+  test("output shows 'not detected' without extension injection", async ({
+    page,
+  }) => {
+    await page.goto("/extension-test");
+    const output = page.locator('[data-testid="output"]');
+    await expect(output).toBeVisible();
+    // Without extension, should not show detected
+    const text = await output.textContent();
+    expect(text).not.toContain("✓ Extension injected");
+  });
+
+  test("MutationObserver detects programmatic injection", async ({ page }) => {
+    await page.goto("/extension-test");
+
+    // Simulate extension injection via page.evaluate
+    await page.evaluate(() => {
+      const div = document.createElement("div");
+      div.id = "extension-injected";
+      div.textContent = "Injected by test";
+      document.body.appendChild(div);
+    });
+
+    // Output should update to show detected
+    await expect(page.locator('[data-testid="output"]')).toContainText(
+      "Extension injected",
+      { timeout: 3000 },
+    );
+  });
+
+  test("extension-mount div is present as injection target", async ({
+    page,
+  }) => {
+    await page.goto("/extension-test");
+    const mount = page.locator('[data-testid="extension-mount"]');
+    await expect(mount).toBeVisible();
+    // The injection target div has both testid and id attributes
+    await expect(page.locator("#extension-mount")).toBeVisible();
+  });
+
+  test("console-panel is visible on extension page", async ({ page }) => {
+    await page.goto("/extension-test");
+    await expect(page.locator('[data-testid="console-panel"]')).toBeVisible();
+  });
+});

apps/testbed/e2e/extensions/content-script.spec.ts

@@ -0,0 +1,59 @@
+import { test, expect } from "@playwright/test";
+import path from "node:path";
+import os from "node:os";
+import fs from "node:fs";
+import { launchWithExtension } from "@suaveplan/testing-e2e/extension-fixture";
+
+// Path to the test extension fixture
+const EXTENSION_PATH = path.resolve(
+  new URL(import.meta.url).pathname,
+  "../../fixtures/test-extension",
+);
+
+test.describe("Content Script Extension", () => {
+  test.skip(
+    !fs.existsSync(EXTENSION_PATH),
+    "Test extension fixture not found — skipping extension tests",
+  );
+
+  test("extension page title is visible without extension", async ({
+    page,
+  }) => {
+    // Basic smoke test — no extension needed
+    await page.goto("/extension-test");
+    await expect(page.locator('[data-testid="page-title"]')).toContainText(
+      "Extension Test",
+    );
+    await expect(page.locator('[data-testid="extension-mount"]')).toBeVisible();
+    await expect(page.locator('[data-testid="output"]')).toBeVisible();
+  });
+
+  test("extension-mount target is present on page", async ({ page }) => {
+    await page.goto("/extension-test");
+    await expect(page.locator('[data-testid="extension-mount"]')).toBeVisible();
+    // The id is also extension-mount for CSS targeting by extensions
+    await expect(page.locator("#extension-mount")).toBeVisible();
+  });
+
+  test.skip("extension injects content into page", async () => {
+    // Full extension test — requires the extension fixture to be built
+    const userDataDir = fs.mkdtempSync(path.join(os.tmpdir(), "pw-ext-"));
+    const { context, extensionId } = await launchWithExtension({
+      extensionPath: EXTENSION_PATH,
+      userDataDir,
+    });
+
+    try {
+      const page = await context.newPage();
+      await page.goto("http://localhost:3200/extension-test");
+      expect(extensionId).toBeTruthy();
+      await expect(page.locator('[data-testid="output"]')).toContainText(
+        "Extension injected",
+        { timeout: 5000 },
+      );
+    } finally {
+      await context.close();
+      fs.rmSync(userDataDir, { recursive: true, force: true });
+    }
+  });
+});