@salesforce/webapp-experimental 1.72.0 → 1.73.1

package/dist/proxy/handler.d.ts

@@ -29,9 +29,15 @@ export type ProxyHandler = (req: IncomingMessage, res: ServerResponse, next?: ()
  *
  * @param manifest - WebApp manifest configuration
  * @param orgInfo - Salesforce org information
- * @param target - Target URL for dev server forwarding
+ * @param target - Target URL for dev server forwarding (optional)
+ * @param basePath - Base path for routing (optional)
  * @param options - Proxy configuration options
  * @returns Async request handler function for Node.js HTTP server
  */
 export declare function createProxyHandler(manifest: WebAppManifest, orgInfo?: OrgInfo, target?: string, basePath?: string, options?: ProxyOptions): ProxyHandler;
+/**
+ * Inject Live Preview script into HTML content.
+ * Used by the Vite plugin's transformIndexHtml hook and the standalone proxy's sendResponse.
+ */
+export declare function injectLivePreviewScript(html: string): string;
 //# sourceMappingURL=handler.d.ts.map

package/dist/proxy/handler.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"handler.d.ts","sourceRoot":"","sources":["../../src/proxy/handler.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAGjE,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAM/D;;GAEG;AACH,eAAO,MAAM,yBAAyB,uBAAuB,CAAC;AAE9D;;GAEG;AACH,eAAO,MAAM,mBAAmB,8BAA8B,CAAC;AAO/D;;GAEG;AACH,MAAM,WAAW,YAAY;IAE5B,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,cAAc,CAAC,EAAE,CAAC,cAAc,EAAE,OAAO,KAAK,IAAI,CAAC;CACnD;AAED;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,CAC1B,GAAG,EAAE,eAAe,EACpB,GAAG,EAAE,cAAc,EACnB,IAAI,CAAC,EAAE,MAAM,IAAI,KACb,OAAO,CAAC,IAAI,CAAC,CAAC;AAofnB;;;;;;;;GAQG;AACH,wBAAgB,kBAAkB,CACjC,QAAQ,EAAE,cAAc,EACxB,OAAO,CAAC,EAAE,OAAO,EACjB,MAAM,CAAC,EAAE,MAAM,EACf,QAAQ,CAAC,EAAE,MAAM,EACjB,OAAO,CAAC,EAAE,YAAY,GACpB,YAAY,CAGd"}
+{"version":3,"file":"handler.d.ts","sourceRoot":"","sources":["../../src/proxy/handler.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAIjE,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAM/D;;GAEG;AACH,eAAO,MAAM,yBAAyB,uBAAuB,CAAC;AAE9D;;GAEG;AACH,eAAO,MAAM,mBAAmB,8BAA8B,CAAC;AA2B/D;;GAEG;AACH,MAAM,WAAW,YAAY;IAE5B,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,cAAc,CAAC,EAAE,CAAC,cAAc,EAAE,OAAO,KAAK,IAAI,CAAC;CACnD;AAED;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,CAC1B,GAAG,EAAE,eAAe,EACpB,GAAG,EAAE,cAAc,EACnB,IAAI,CAAC,EAAE,MAAM,IAAI,KACb,OAAO,CAAC,IAAI,CAAC,CAAC;AAmkBnB;;;;;;;;;GASG;AACH,wBAAgB,kBAAkB,CACjC,QAAQ,EAAE,cAAc,EACxB,OAAO,CAAC,EAAE,OAAO,EACjB,MAAM,CAAC,EAAE,MAAM,EACf,QAAQ,CAAC,EAAE,MAAM,EACjB,OAAO,CAAC,EAAE,YAAY,GACpB,YAAY,CAGd;AAED;;;GAGG;AACH,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAE5D"}

package/dist/proxy/handler.js

@@ -4,6 +4,7 @@
  * For full license text, see the LICENSE.txt file
  */
 import { createRequire } from "node:module";
+import { getLivePreviewScriptContent, LIVE_PREVIEW_SCRIPT_MARKER } from "./livePreviewScript.js";
 import { applyTrailingSlash, matchRoute } from "./routing.js";
 import { refreshOrgAuth } from "../app/index.js";
 const require = createRequire(import.meta.url);
@@ -20,6 +21,23 @@ export const WEBAPP_PROXY_HEADER = "X-Salesforce-WebApp-Proxy";
  * Endpoint for Lightning Out frontdoor URL generation
  */
 const LIGHTNING_OUT_SINGLE_ACCESS_PATH = "/services/oauth2/singleaccess";
+const SALESFORCE_API_PREFIXES = ["/services/", "/lwr/apex/"];
+const AUTH_FAILED_RESPONSE = {
+    error: "AUTHENTICATION_FAILED",
+    message: "Authentication failed. Please re-authenticate to your Salesforce org.",
+    status: 401,
+};
+/**
+ * Thrown when a Salesforce authentication operation fails
+ * (e.g. token refresh failure, missing credentials).
+ * Caught in request handlers to return a 401 response.
+ */
+class AuthenticationError extends Error {
+    constructor(message) {
+        super(message);
+        this.name = "AuthenticationError";
+    }
+}
 /**
  * Handles all proxy routing and forwarding for WebApps
  */
@@ -73,6 +91,13 @@ class WebAppProxyHandler {
                 if (this.options?.debug) {
                     console.log(`[webapps-proxy] Rewrite to ${req.url}`);
                 }
+                // After rewrite, let Vite handle the rewritten request (or forward to dev server if no next)
+                if (next) {
+                    next();
+                    return;
+                }
+                await this.forwardToDevServer(req, res);
+                return;
             }
             if (match.type === "file-upload") {
                 console.log("[webapps-proxy] file-upload match found → handleFileUpload");
@@ -80,6 +105,14 @@ class WebAppProxyHandler {
                 return;
             }
         }
+        // Check if this is a Salesforce API request that needs proxying
+        if (SALESFORCE_API_PREFIXES.some((prefix) => pathname.startsWith(prefix))) {
+            await this.handleSalesforceApi(req, res);
+            return;
+        }
+        // For all other requests (static assets, HMR, HTML), let Vite handle them directly
+        // Note: In Vite middleware mode, HTML script injection is handled by
+        // the Vite plugin's transformIndexHtml hook, not here.
         if (next) {
             next();
         }
@@ -87,6 +120,26 @@ class WebAppProxyHandler {
             await this.forwardToDevServer(req, res);
         }
     }
+    async forwardToDevServer(req, res) {
+        try {
+            const baseUrl = this.target ?? `http://${req.headers.host ?? "localhost"}`;
+            const url = new URL(req.url ?? "/", baseUrl);
+            if (this.options?.debug) {
+                console.log(`[webapps-proxy] Forwarding to dev server: ${url.href}`);
+            }
+            const body = req.method !== "GET" && req.method !== "HEAD" ? await getBody(req) : undefined;
+            const response = await fetch(url.href, {
+                method: req.method,
+                headers: getFilteredHeaders(req.headers),
+                body: body,
+            });
+            await this.sendResponse(res, response);
+        }
+        catch (error) {
+            console.error("[webapps-proxy] Dev server request failed:", error);
+            this.sendAuthOrGatewayError(res, error, "Failed to forward request to dev server");
+        }
+    }
     handleRedirect(res, location, statusCode) {
         res.writeHead(statusCode, { Location: location });
         res.end();
@@ -121,6 +174,17 @@ class WebAppProxyHandler {
         res.writeHead(statusCode, { "Content-Type": "application/json" });
         res.end(JSON.stringify(body));
     }
+    sendAuthOrGatewayError(res, error, gatewayMessage) {
+        if (error instanceof AuthenticationError) {
+            this.sendJson(res, 401, AUTH_FAILED_RESPONSE);
+        }
+        else {
+            this.sendJson(res, 502, {
+                error: "GATEWAY_ERROR",
+                message: gatewayMessage,
+            });
+        }
+    }
     async handleLightningOutFrontdoor(req, res, _url) {
         try {
             if (!this.orgInfo) {
@@ -166,7 +230,7 @@ class WebAppProxyHandler {
         if (response.status === 401 || response.status === 403) {
             const updatedOrgInfo = await this.refreshToken();
             if (!updatedOrgInfo) {
-                throw new Error("Failed to refresh token");
+                throw new AuthenticationError("Failed to refresh token");
             }
             baseUrl = updatedOrgInfo.rawInstanceUrl.replace(/\/$/, "");
             response = await fetch(`${baseUrl}${LIGHTNING_OUT_SINGLE_ACCESS_PATH}`, {
@@ -219,7 +283,9 @@ class WebAppProxyHandler {
                 console.warn(`[webapps-proxy] Received ${response.status}, refreshing token...`);
                 const updatedOrgInfo = await this.refreshToken();
                 if (updatedOrgInfo === undefined) {
-                    throw new Error("Failed to refresh token");
+                    console.error("[webapps-proxy] Failed to refresh token - authentication error");
+                    this.sendJson(res, 401, AUTH_FAILED_RESPONSE);
+                    return;
                 }
                 if (this.options?.debug) {
                     console.log("[webapps-proxy] Token refreshed, retrying request");
@@ -241,11 +307,7 @@ class WebAppProxyHandler {
         }
         catch (error) {
             console.error("[webapps-proxy] Salesforce API request failed:", error);
-            res.writeHead(502, { "Content-Type": "application/json" });
-            res.end(JSON.stringify({
-                error: "GATEWAY_ERROR",
-                message: "Failed to forward request to Salesforce",
-            }));
+            this.sendAuthOrGatewayError(res, error, "Failed to forward request to Salesforce");
         }
     }
     async refreshToken() {
@@ -256,7 +318,7 @@ class WebAppProxyHandler {
         // This handles cases where orgInfo was created without an explicit alias
         const refreshIdentifier = this.orgInfo.orgAlias || this.orgInfo.username;
         if (!refreshIdentifier) {
-            throw new Error("Cannot refresh token: no org alias or username available");
+            throw new AuthenticationError("Cannot refresh token: no org alias or username available");
         }
         const updatedOrgInfo = await refreshOrgAuth(refreshIdentifier);
         if (!updatedOrgInfo) {
@@ -310,39 +372,17 @@ class WebAppProxyHandler {
                         body: body,
                     });
                 }
+                else {
+                    console.error("[webapps-proxy] Failed to refresh token for GraphQL - authentication error");
+                    this.sendJson(res, 401, AUTH_FAILED_RESPONSE);
+                    return;
+                }
             }
             await this.sendResponse(res, response);
         }
         catch (error) {
             console.error("[webapps-proxy] GraphQL request failed:", error);
-            res.writeHead(502, { "Content-Type": "application/json" });
-            res.end(JSON.stringify({
-                error: "GATEWAY_ERROR",
-                message: "Failed to forward GraphQL request to Salesforce",
-            }));
-        }
-    }
-    async forwardToDevServer(req, res) {
-        try {
-            const url = new URL(req.url ?? "/", this.target);
-            if (this.options?.debug) {
-                console.log(`[webapps-proxy] Forwarding to dev server: ${url.href}`);
-            }
-            const body = req.method !== "GET" && req.method !== "HEAD" ? await getBody(req) : undefined;
-            const response = await fetch(url.href, {
-                method: req.method,
-                headers: getFilteredHeaders(req.headers),
-                body: body,
-            });
-            await this.sendResponse(res, response);
-        }
-        catch (error) {
-            console.error("[webapps-proxy] Dev server request failed:", error);
-            res.writeHead(502, { "Content-Type": "application/json" });
-            res.end(JSON.stringify({
-                error: "GATEWAY_ERROR",
-                message: "Failed to forward request to dev server",
-            }));
+            this.sendAuthOrGatewayError(res, error, "Failed to forward GraphQL request to Salesforce");
         }
     }
     async sendResponse(res, response) {
@@ -353,18 +393,67 @@ class WebAppProxyHandler {
                 headers[key] = value;
             }
         });
-        res.writeHead(response.status, headers);
-        if (response.body) {
+        // Check if response is HTML and should have script injected
+        const contentType = response.headers.get("content-type") || "";
+        const isHtml = contentType.includes("text/html");
+        if (isHtml && response.body) {
+            // Buffer the entire response body to inject script
+            const chunks = [];
             const reader = response.body.getReader();
             while (true) {
                 const { done, value } = await reader.read();
                 if (done)
                     break;
-                res.write(value);
+                chunks.push(value);
+            }
+            // Combine all chunks into a single buffer
+            const totalLength = chunks.reduce((sum, chunk) => sum + chunk.length, 0);
+            const buffer = new Uint8Array(totalLength);
+            let offset = 0;
+            for (const chunk of chunks) {
+                buffer.set(chunk, offset);
+                offset += chunk.length;
+            }
+            // Convert to string, inject script, and convert back
+            const html = new TextDecoder().decode(buffer);
+            const modifiedHtml = WebAppProxyHandler.injectLivePreviewScript(html);
+            // Update content-length header
+            const modifiedBuffer = new TextEncoder().encode(modifiedHtml);
+            headers["content-length"] = modifiedBuffer.length.toString();
+            res.writeHead(response.status, headers);
+            res.write(modifiedBuffer);
+        }
+        else {
+            // For non-HTML responses, stream as before
+            res.writeHead(response.status, headers);
+            if (response.body) {
+                const reader = response.body.getReader();
+                while (true) {
+                    const { done, value } = await reader.read();
+                    if (done)
+                        break;
+                    res.write(value);
+                }
             }
         }
         res.end();
     }
+    static injectLivePreviewScript(html) {
+        if (html.includes(LIVE_PREVIEW_SCRIPT_MARKER)) {
+            return html;
+        }
+        const scriptContent = getLivePreviewScriptContent();
+        const scriptTag = `<script ${LIVE_PREVIEW_SCRIPT_MARKER}>` + scriptContent + "<" + "/script>";
+        if (html.includes("</body>")) {
+            const lastBodyIndex = html.lastIndexOf("</body>");
+            return html.substring(0, lastBodyIndex) + scriptTag + html.substring(lastBodyIndex);
+        }
+        if (html.includes("</html>")) {
+            const lastHtmlIndex = html.lastIndexOf("</html>");
+            return html.substring(0, lastHtmlIndex) + scriptTag + html.substring(lastHtmlIndex);
+        }
+        return html + scriptTag;
+    }
     /**
      * Proxy POST /chatter/handlers/file/body (XHR/file upload) to Salesforce.
      * Uses rawInstanceUrl for Chatter API. Preserves multipart/form-data from XHR.
@@ -426,7 +515,8 @@ class WebAppProxyHandler {
  *
  * @param manifest - WebApp manifest configuration
  * @param orgInfo - Salesforce org information
- * @param target - Target URL for dev server forwarding
+ * @param target - Target URL for dev server forwarding (optional)
+ * @param basePath - Base path for routing (optional)
  * @param options - Proxy configuration options
  * @returns Async request handler function for Node.js HTTP server
  */
@@ -434,6 +524,13 @@ export function createProxyHandler(manifest, orgInfo, target, basePath, options)
     const handler = new WebAppProxyHandler(manifest, orgInfo, target, basePath, options);
     return (req, res, next) => handler.handle(req, res, next);
 }
+/**
+ * Inject Live Preview script into HTML content.
+ * Used by the Vite plugin's transformIndexHtml hook and the standalone proxy's sendResponse.
+ */
+export function injectLivePreviewScript(html) {
+    return WebAppProxyHandler.injectLivePreviewScript(html);
+}
 function getFilteredHeaders(headers) {
     const filtered = {};
     const hopByHopHeaders = new Set([
@@ -448,7 +545,11 @@ function getFilteredHeaders(headers) {
     ]);
     for (const [key, value] of Object.entries(headers)) {
         if (!hopByHopHeaders.has(key.toLowerCase()) && value) {
-            filtered[key] = Array.isArray(value) ? value.join(", ") : value;
+            filtered[key] = Array.isArray(value)
+                ? value.join(", ")
+                : typeof value === "string"
+                    ? value
+                    : String(value);
         }
     }
     return filtered;

package/dist/proxy/index.d.ts

@@ -4,6 +4,6 @@
  * For full license text, see the LICENSE.txt file
  */
 export type { ProxyOptions, ProxyHandler } from "./handler.js";
-export { createProxyHandler, WEBAPP_HEALTH_CHECK_PARAM, WEBAPP_PROXY_HEADER } from "./handler.js";
+export { createProxyHandler, injectLivePreviewScript, WEBAPP_HEALTH_CHECK_PARAM, WEBAPP_PROXY_HEADER, } from "./handler.js";
 export { getErrorPageTemplate } from "./error-page.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/proxy/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/proxy/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC/D,OAAO,EAAE,kBAAkB,EAAE,yBAAyB,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAClG,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/proxy/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC/D,OAAO,EACN,kBAAkB,EAClB,uBAAuB,EACvB,yBAAyB,EACzB,mBAAmB,GACnB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/proxy/index.js

@@ -3,5 +3,5 @@
  * All rights reserved.
  * For full license text, see the LICENSE.txt file
  */
-export { createProxyHandler, WEBAPP_HEALTH_CHECK_PARAM, WEBAPP_PROXY_HEADER } from "./handler.js";
+export { createProxyHandler, injectLivePreviewScript, WEBAPP_HEALTH_CHECK_PARAM, WEBAPP_PROXY_HEADER, } from "./handler.js";
 export { getErrorPageTemplate } from "./error-page.js";

package/dist/proxy/livePreviewScript.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Copyright (c) 2026, Salesforce, Inc.,
+ * All rights reserved.
+ * For full license text, see the LICENSE.txt file
+ */
+/**
+ * Returns the JavaScript source that gets injected into previewed web apps.
+ * Reads from templates/livePreviewScript.js at runtime (copied to dist/ by postbuild).
+ * Cached after first read.
+ *
+ * Responsibilities:
+ *  - Fetch interceptor for network-error detection (runs synchronously on load)
+ *  - Runtime / compile / HMR error listeners
+ *  - Error deduplication
+ *  - postMessage bridge to the VS Code webview (when running inside an iframe)
+ *  - Standalone browser error overlay (when NOT inside an iframe)
+ *  - Copy / paste / right-click bridge for VS Code webview
+ */
+export declare function getLivePreviewScriptContent(): string;
+/** Data attribute used to detect (and prevent) double injection. */
+export declare const LIVE_PREVIEW_SCRIPT_MARKER = "data-live-preview";
+//# sourceMappingURL=livePreviewScript.d.ts.map

package/dist/proxy/livePreviewScript.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"livePreviewScript.d.ts","sourceRoot":"","sources":["../../src/proxy/livePreviewScript.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AASH;;;;;;;;;;;;GAYG;AACH,wBAAgB,2BAA2B,IAAI,MAAM,CAKpD;AAED,oEAAoE;AACpE,eAAO,MAAM,0BAA0B,sBAAsB,CAAC"}

package/dist/proxy/livePreviewScript.js

@@ -0,0 +1,32 @@
+/**
+ * Copyright (c) 2026, Salesforce, Inc.,
+ * All rights reserved.
+ * For full license text, see the LICENSE.txt file
+ */
+import { readFileSync } from "node:fs";
+import { dirname, join } from "node:path";
+import { fileURLToPath } from "node:url";
+const __dirname = dirname(fileURLToPath(import.meta.url));
+let cached = null;
+/**
+ * Returns the JavaScript source that gets injected into previewed web apps.
+ * Reads from templates/livePreviewScript.js at runtime (copied to dist/ by postbuild).
+ * Cached after first read.
+ *
+ * Responsibilities:
+ *  - Fetch interceptor for network-error detection (runs synchronously on load)
+ *  - Runtime / compile / HMR error listeners
+ *  - Error deduplication
+ *  - postMessage bridge to the VS Code webview (when running inside an iframe)
+ *  - Standalone browser error overlay (when NOT inside an iframe)
+ *  - Copy / paste / right-click bridge for VS Code webview
+ */
+export function getLivePreviewScriptContent() {
+    if (cached)
+        return cached;
+    const scriptPath = join(__dirname, "templates", "livePreviewScript.js");
+    cached = readFileSync(scriptPath, "utf-8");
+    return cached;
+}
+/** Data attribute used to detect (and prevent) double injection. */
+export const LIVE_PREVIEW_SCRIPT_MARKER = "data-live-preview";

package/dist/proxy/livePreviewScript.test.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Copyright (c) 2026, Salesforce, Inc.,
+ * All rights reserved.
+ * For full license text, see the LICENSE.txt file
+ */
+export {};
+//# sourceMappingURL=livePreviewScript.test.d.ts.map

package/dist/proxy/livePreviewScript.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"livePreviewScript.test.d.ts","sourceRoot":"","sources":["../../src/proxy/livePreviewScript.test.ts"],"names":[],"mappings":"AAAA;;;;GAIG"}

package/dist/proxy/livePreviewScript.test.js

@@ -0,0 +1,101 @@
+/**
+ * Copyright (c) 2026, Salesforce, Inc.,
+ * All rights reserved.
+ * For full license text, see the LICENSE.txt file
+ */
+import { describe, it, expect } from "vitest";
+import { injectLivePreviewScript } from "./handler.js";
+import { getLivePreviewScriptContent, LIVE_PREVIEW_SCRIPT_MARKER } from "./livePreviewScript.js";
+describe("getLivePreviewScriptContent", () => {
+    it("should return a non-empty string", () => {
+        const content = getLivePreviewScriptContent();
+        expect(content).toBeTruthy();
+        expect(typeof content).toBe("string");
+        expect(content.length).toBeGreaterThan(100);
+    });
+    it("should contain the fetch interceptor", () => {
+        const content = getLivePreviewScriptContent();
+        expect(content).toContain("setupFetchInterceptorImmediate");
+        expect(content).toContain("_vscodeIntercepted");
+    });
+    it("should contain the error deduplication logic", () => {
+        const content = getLivePreviewScriptContent();
+        expect(content).toContain("ERROR_DEDUP_WINDOW_MS");
+        expect(content).toContain("getErrorHash");
+        expect(content).toContain("recentErrors");
+    });
+    it("should contain the sendErrorToParent function", () => {
+        const content = getLivePreviewScriptContent();
+        expect(content).toContain("sendErrorToParent");
+    });
+    it("should contain the error overlay function", () => {
+        const content = getLivePreviewScriptContent();
+        expect(content).toContain("showErrorOverlayInPage");
+        expect(content).toContain("vscode-error-panel");
+    });
+    it("should contain the copy/paste bridge", () => {
+        const content = getLivePreviewScriptContent();
+        expect(content).toContain("sendCopyMessage");
+        expect(content).toContain('command: "copy"');
+    });
+    it("should contain the iframeAlive heartbeat", () => {
+        const content = getLivePreviewScriptContent();
+        expect(content).toContain("iframeAlive");
+    });
+    it("should contain error listeners (window.error, unhandledrejection, console.error)", () => {
+        const content = getLivePreviewScriptContent();
+        expect(content).toContain('window.addEventListener(\n\t\t\t"error"');
+        expect(content).toContain('window.addEventListener("unhandledrejection"');
+        expect(content).toContain("console.error = function");
+    });
+    it("should wrap error details in a metadata object for postMessage", () => {
+        const content = getLivePreviewScriptContent();
+        expect(content).toContain("metadata:");
+        expect(content).toContain("metadata: {");
+    });
+});
+describe("LIVE_PREVIEW_SCRIPT_MARKER", () => {
+    it("should be a non-empty string", () => {
+        expect(LIVE_PREVIEW_SCRIPT_MARKER).toBeTruthy();
+        expect(typeof LIVE_PREVIEW_SCRIPT_MARKER).toBe("string");
+    });
+});
+describe("injectLivePreviewScript", () => {
+    it("should inject script before </body>", () => {
+        const html = "<html><body><div>Hello</div></body></html>";
+        const result = injectLivePreviewScript(html);
+        expect(result).toContain(LIVE_PREVIEW_SCRIPT_MARKER);
+        expect(result.indexOf(LIVE_PREVIEW_SCRIPT_MARKER)).toBeLessThan(result.indexOf("</body>"));
+    });
+    it("should inject before </html> when no </body> is present", () => {
+        const html = "<html><div>Hello</div></html>";
+        const result = injectLivePreviewScript(html);
+        expect(result).toContain(LIVE_PREVIEW_SCRIPT_MARKER);
+        expect(result.indexOf(LIVE_PREVIEW_SCRIPT_MARKER)).toBeLessThan(result.indexOf("</html>"));
+    });
+    it("should append at the end when no </body> or </html>", () => {
+        const html = "<div>Hello</div>";
+        const result = injectLivePreviewScript(html);
+        expect(result).toContain(LIVE_PREVIEW_SCRIPT_MARKER);
+        expect(result).toContain("<div>Hello</div>");
+        expect(result.endsWith("</script>")).toBe(true);
+    });
+    it("should prevent double injection", () => {
+        const html = "<html><body><div>Hello</div></body></html>";
+        const first = injectLivePreviewScript(html);
+        const second = injectLivePreviewScript(first);
+        expect(first).toBe(second);
+    });
+    it("should wrap script in <script> tags", () => {
+        const html = "<html><body></body></html>";
+        const result = injectLivePreviewScript(html);
+        expect(result).toContain("<script>");
+        expect(result).toContain("</script>");
+    });
+    it("should contain actual script content in the output", () => {
+        const html = "<html><body></body></html>";
+        const result = injectLivePreviewScript(html);
+        expect(result).toContain("sendErrorToParent");
+        expect(result).toContain("setupFetchInterceptorImmediate");
+    });
+});

package/dist/proxy/templates/livePreviewScript.js

@@ -0,0 +1,738 @@
+/**
+ * Copyright (c) 2026, Salesforce, Inc.,
+ * All rights reserved.
+ * For full license text, see the LICENSE.txt file
+ */
+
+/* eslint-disable */
+// Live Preview injected script — loaded at runtime by livePreviewScript.ts via readFileSync.
+// This file runs in the browser (injected into <script> tags), NOT in Node.js.
+// Live Preview postMessage contract (match extension TypeScript type):
+// type: 'runtime' | 'compile' | 'network' | 'hmr' - extension uses for Fix Code vs Refresh Panel vs Re-authenticate
+// For network: always send status (401/403 = auth, 0 = connection/socket failure)
+// CRITICAL: Set up fetch interceptor IMMEDIATELY (synchronously, before defer)
+// This ensures we catch all network errors, even those that happen during page load
+(function setupFetchInterceptorImmediate() {
+	if (window.fetch && !window.fetch._vscodeIntercepted) {
+		const originalFetch = window.fetch;
+		window.fetch = function () {
+			const args = Array.prototype.slice.call(arguments);
+			const url = typeof args[0] === "string" ? args[0] : args[0] && args[0].url ? args[0].url : "";
+			const method = (args[1] && args[1].method ? args[1].method : "GET").toUpperCase();
+			const startTime = Date.now();
+
+			return originalFetch
+				.apply(window, args)
+				.then(function (response) {
+					const duration = Date.now() - startTime;
+
+					if (response.status >= 400) {
+						const errorData = {
+							type: "network",
+							method: method,
+							url: url,
+							status: response.status,
+							duration: duration,
+							message: "Network error: " + response.status + " " + (response.statusText || ""),
+						};
+						// Use sendErrorToParent (via window.__vscodeLivePreviewSendError) so dedup applies.
+						// Do NOT use console.error here — it would trigger the override and double-send.
+						if (typeof window.__vscodeLivePreviewSendError === "function") {
+							try {
+								window.__vscodeLivePreviewSendError(errorData);
+							} catch (err) {}
+						} else if (window.parent && window.parent !== window) {
+							// Fallback before init: send directly (no dedup yet)
+							try {
+								window.parent.postMessage(
+									{
+										type: errorData.type,
+										message: errorData.message,
+										metadata: {
+											method: errorData.method,
+											url: errorData.url,
+											status: errorData.status,
+											duration: errorData.duration,
+										},
+										_source: "webapps-proxy-injected-script",
+									},
+									"*",
+								);
+							} catch (e) {}
+						}
+					}
+
+					return response;
+				})
+				.catch(function (error) {
+					const duration = Date.now() - startTime;
+					const status =
+						(error && error.status) || (error && error.response && error.response.status) || 0;
+					const errorData = {
+						type: "network",
+						method: method,
+						url: url,
+						status: status,
+						duration: duration,
+						message:
+							error && error.message
+								? error.message
+								: status > 0
+									? "Network error: " + status
+									: "Network request failed",
+						stack: error && error.stack ? error.stack : "",
+					};
+					// Use sendErrorToParent (via window.__vscodeLivePreviewSendError) so dedup applies.
+					// Do NOT use console.error — it would trigger the override and double-send.
+					if (typeof window.__vscodeLivePreviewSendError === "function") {
+						try {
+							window.__vscodeLivePreviewSendError(errorData);
+						} catch (err) {}
+					} else if (window.parent && window.parent !== window) {
+						try {
+							window.parent.postMessage(
+								{
+									type: errorData.type,
+									message: errorData.message,
+									stack: errorData.stack,
+									metadata: {
+										method: errorData.method,
+										url: errorData.url,
+										status: errorData.status,
+										duration: errorData.duration,
+									},
+									_source: "webapps-proxy-injected-script",
+								},
+								"*",
+							);
+						} catch (e) {}
+					}
+					throw error;
+				});
+		};
+		window.fetch._vscodeIntercepted = true;
+	}
+})();
+(function () {
+	// Defer script execution to avoid blocking initial page render
+	// Use requestIdleCallback if available, otherwise setTimeout
+	function deferInit(callback) {
+		if (window.requestIdleCallback) {
+			window.requestIdleCallback(callback, { timeout: 100 });
+		} else {
+			setTimeout(callback, 0);
+		}
+	}
+	function initVSCodeLivePreview() {
+		const recentErrors = {};
+		const ERROR_DEDUP_WINDOW_MS = 2000;
+
+		function safeStr(val, maxLen) {
+			if (val == null) return "";
+			const s = typeof val === "string" ? val : String(val);
+			return s.substring(0, maxLen == null ? s.length : maxLen);
+		}
+
+		function getErrorHash(errorData) {
+			if (errorData.type === "network") {
+				return (
+					(errorData.type || "unknown") +
+					"|" +
+					(errorData.status || "0") +
+					"|" +
+					safeStr(errorData.url, 100) +
+					"|" +
+					(errorData.method || "GET")
+				);
+			}
+			return (
+				(errorData.type || "unknown") +
+				"|" +
+				safeStr(errorData.message, 100) +
+				"|" +
+				safeStr(errorData.source, 50)
+			);
+		}
+
+		function escapeHtml(text) {
+			if (!text) return "";
+			const div = document.createElement("div");
+			div.textContent = text;
+			return div.innerHTML;
+		}
+
+		// Extracts filename from error data. Mirrors logic in errorPathUtils.ts (extension)
+		// and uiPreviewWebview.js (webview) — keep patterns in sync across all three.
+		function extractFileName(errorData) {
+			const combined =
+				(errorData.message || "") + " " + (errorData.source || "") + " " + (errorData.stack || "");
+			const patterns = [
+				/Failed to reload\s+\/?@?fs?\/?([^\s:?)]+\.[jt]sx?)/,
+				/@fs\/([^\s:?)]+\.[jt]sx?)/,
+				/\/(src\/[^\s:?)]+\.[jt]sx?)/,
+				/\/([^\s\/:?)]+\.[jt]sx?)[\s:?]/,
+				/at\s+\w+\s+\([^)]*\/([^\s\/:?)]+\.[jt]sx?)/,
+			];
+			for (let i = 0; i < patterns.length; i++) {
+				const m = combined.match(patterns[i]);
+				if (m && m[1]) {
+					const parts = m[1].split("/");
+					return parts[parts.length - 1];
+				}
+			}
+			return null;
+		}
+
+		function getFileIconLabel(name) {
+			if (!name) return "JS";
+			const ext = name.split(".").pop().toLowerCase();
+			if (ext === "ts" || ext === "tsx") return "TS";
+			if (ext === "jsx") return "JSX";
+			return "JS";
+		}
+
+		// SVG illustration for error overlay (Figma design asset)
+		const ERROR_OVERLAY_SVG =
+			'<svg width="300" height="192" viewBox="0 0 300 192" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M104.698 144.786C104.458 144.138 103.542 144.138 103.302 144.786L101.757 148.962C101.621 149.33 101.33 149.621 100.962 149.757L96.7861 151.302C96.1381 151.542 96.1381 152.458 96.7861 152.698L100.962 154.243C101.33 154.379 101.621 154.67 101.757 155.038L103.302 159.214C103.542 159.862 104.458 159.862 104.698 159.214L106.243 155.038C106.379 154.67 106.67 154.379 107.038 154.243L111.214 152.698C111.862 152.458 111.862 151.542 111.214 151.302L107.038 149.757C106.67 149.621 106.379 149.33 106.243 148.962L104.698 144.786Z" stroke="#757575" stroke-width="0.6"/><path d="M57.265 44.5117C57.5175 43.8294 58.4825 43.8294 58.735 44.5117L59.8937 47.6433C59.9731 47.8578 60.1422 48.0269 60.3567 48.1063L63.4883 49.265C64.1706 49.5175 64.1706 50.4825 63.4883 50.735L60.3567 51.8937C60.1422 51.9731 59.9731 52.1422 59.8937 52.3567L58.735 55.4883C58.4825 56.1706 57.5175 56.1706 57.265 55.4883L56.1063 52.3567C56.0269 52.1422 55.8578 51.9731 55.6433 51.8937L52.5117 50.735C51.8294 50.4825 51.8294 49.5175 52.5117 49.265L55.6433 48.1063C55.8578 48.0269 56.0269 47.8578 56.1063 47.6433L57.265 44.5117Z" fill="#AEAEAE"/><path d="M236.477 128.332C236.313 127.889 235.687 127.889 235.523 128.332L234.742 130.442C234.691 130.581 234.581 130.691 234.442 130.742L232.332 131.523C231.889 131.687 231.889 132.313 232.332 132.477L234.442 133.258C234.581 133.309 234.691 133.419 234.742 133.558L235.523 135.668C235.687 136.111 236.313 136.111 236.477 135.668L237.258 133.558C237.309 133.419 237.419 133.309 237.558 133.258L239.668 132.477C240.111 132.313 240.111 131.687 239.668 131.523L237.558 130.742C237.419 130.691 237.309 130.581 237.258 130.442L236.477 128.332Z" fill="#AEAEAE"/><rect x="160" y="106" width="2" height="16" transform="rotate(-90 160 106)" fill="#7CB1FE"/><rect x="160" y="88" width="2" height="16" transform="rotate(-90 160 88)" fill="#7CB1FE"/><path d="M56 96C56 89.3726 61.3726 84 68 84L75 84C75 90.6274 69.6274 96 63 96L56 96Z" fill="#066AFE"/><path d="M264 48C257.373 48 252 42.6274 252 36L252 29C258.627 29 264 34.3726 264 41L264 48Z" fill="#066AFE"/><path d="M56 96C56 91.5818 52.4183 88 48 88C48 92.4183 51.5817 96 56 96Z" fill="#7CB1FE"/><path d="M264 48C259.582 48 256 51.5817 256 56C260.418 56 264 52.4183 264 48Z" fill="#7CB1FE"/><path d="M40 152C53.2548 152 64 141.255 64 128C50.7452 128 40 138.745 40 152Z" fill="#066AFE"/><path d="M264 120C250.745 120 240 109.255 240 96C253.255 96 264 106.745 264 120Z" fill="#066AFE"/><path d="M88 96L60 96C48.9543 96 40 104.954 40 116L40 168" stroke="#7CB1FE"/><path d="M216 96H244C255.046 96 264 87.0457 264 76V24" stroke="#7CB1FE"/><path d="M128 64L128 128L112 128C98.7452 128 88 117.255 88 104L88 88C88 74.7452 98.7452 64 112 64L128 64Z" fill="#066AFE"/><path d="M176 128L176 64L192 64C205.255 64 216 74.7452 216 88L216 104C216 117.255 205.255 128 192 128L176 128Z" fill="url(#pg1)"/><defs><linearGradient id="pg1" x1="176" y1="67.5" x2="217.94" y2="86.14" gradientUnits="userSpaceOnUse"><stop stop-color="#7CB1FE"/><stop offset="1" stop-color="#066AFE"/></linearGradient></defs></svg>';
+
+		const COPY_FEEDBACK_DELAY_MS = 1500;
+
+		function injectOverlayStyles() {
+			if (document.getElementById("vscode-error-overlay-styles")) return;
+			const style = document.createElement("style");
+			style.id = "vscode-error-overlay-styles";
+			style.textContent = [
+				'#vscode-error-panel{position:fixed;top:0;left:0;right:0;bottom:0;background:#181818;z-index:999999;overflow-y:auto;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:0 0 30px;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif}',
+				".vep-content{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:46px}",
+				".vep-top{display:flex;flex-direction:column;align-items:center;gap:16px}",
+				".vep-illustration{width:300px;height:192px}",
+				".vep-title{display:flex;align-items:center;gap:8px;padding-bottom:8px}",
+				".vep-title-icon{width:16px;height:16px;color:#FE8AA7;font-size:16px;display:flex;align-items:center;justify-content:center}",
+				".vep-title-text{font-weight:600;font-size:20px;line-height:26px;color:#FE8AA7}",
+				".vep-body{display:flex;flex-direction:column;align-items:center;gap:24px;width:416px}",
+				".vep-fields{display:flex;flex-direction:column;gap:16px;width:100%}",
+				".vep-field{display:flex;flex-direction:column;gap:8px;width:100%}",
+				".vep-label{font-weight:500;font-size:14px;line-height:17px;color:#FFFFFF}",
+				".vep-file-box{box-sizing:border-box;display:flex;align-items:center;padding:4px 8px;gap:4px;width:100%;background:#181818;border:1px solid #444444;border-radius:4px}",
+				".vep-file-icon{font-size:10px;font-weight:700;color:#F9E3B6;letter-spacing:0.3px}",
+				".vep-file-name{font-weight:500;font-size:13px;line-height:16px;color:#AEAEAE;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}",
+				".vep-error-box{box-sizing:border-box;display:flex;align-items:center;padding:8px;gap:4px;width:100%;background:#242424;border:1px solid #FE8AA7;border-radius:8px}",
+				".vep-error-icon{width:16px;height:16px;color:#FE8AA7;font-size:16px;flex-shrink:0;display:flex;align-items:center;justify-content:center}",
+				".vep-error-msg{font-weight:500;font-size:12px;line-height:14px;color:#FE8AA7;word-break:break-word}",
+				".vep-stack-box{box-sizing:border-box;padding:8px;width:100%;max-height:200px;overflow-y:auto;background:#181818;border:1px solid #444444;border-radius:4px;font-weight:500;font-size:12px;line-height:14px;color:#AEAEAE;white-space:pre-wrap;word-break:break-word;user-select:text}",
+				".vep-actions{display:flex;gap:8px;width:100%}",
+				".vep-btn{display:flex;align-items:center;gap:4px;padding:2px 4px;background:#066AFE;border-radius:4px;border:none;cursor:pointer;font-weight:500;font-size:11px;line-height:13px;color:#fff;white-space:nowrap}",
+				".vep-btn:hover{background:#0559d4}",
+			].join("\n");
+			document.head.appendChild(style);
+		}
+
+		function showErrorOverlayInPage(errorData) {
+			try {
+				const existing = document.getElementById("vscode-error-panel");
+				if (existing) existing.remove();
+
+				injectOverlayStyles();
+
+				const errorType = errorData.type || "runtime";
+				const titleMap = {
+					network: "Network Error",
+					compile: "Compilation Error",
+					hmr: "HMR Error",
+					component: "Component Error",
+				};
+				const titleText = titleMap[errorType] || "Runtime Error";
+				const fileName = extractFileName(errorData);
+				const fileIcon = getFileIconLabel(fileName);
+
+				const panel = document.createElement("div");
+				panel.id = "vscode-error-panel";
+
+				const fileHtml = fileName
+					? '<div class="vep-field"><div class="vep-label">File</div>' +
+						'<div class="vep-file-box"><span class="vep-file-icon">' +
+						escapeHtml(fileIcon) +
+						"</span>" +
+						'<span class="vep-file-name">' +
+						escapeHtml(fileName) +
+						"</span></div></div>"
+					: "";
+
+				const stackHtml =
+					errorData.stack && errorData.stack.trim()
+						? '<div class="vep-field"><div class="vep-label">Stack Trace</div>' +
+							'<div class="vep-stack-box">' +
+							escapeHtml(errorData.stack) +
+							"</div></div>"
+						: "";
+
+				panel.innerHTML =
+					'<div class="vep-content">' +
+					'<div class="vep-top">' +
+					'<div class="vep-illustration">' +
+					ERROR_OVERLAY_SVG +
+					"</div>" +
+					'<div class="vep-title"><span class="vep-title-icon">\u2297</span>' +
+					'<span class="vep-title-text">' +
+					escapeHtml(titleText) +
+					"</span></div>" +
+					"</div>" +
+					'<div class="vep-body">' +
+					'<div class="vep-fields">' +
+					fileHtml +
+					'<div class="vep-field"><div class="vep-label">Error</div>' +
+					'<div class="vep-error-box"><span class="vep-error-icon">\u2297</span>' +
+					'<span class="vep-error-msg">' +
+					escapeHtml(errorData.message || "Unknown error") +
+					"</span></div></div>" +
+					stackHtml +
+					"</div>" +
+					'<div class="vep-actions">' +
+					'<button class="vep-btn" id="vep-copy-btn">\u{1F4CB} Copy Error</button>' +
+					'<button class="vep-btn" id="vep-retry-btn">\u21BB Retry</button>' +
+					"</div>" +
+					"</div>" +
+					"</div>";
+
+				document.body.appendChild(panel);
+
+				document.getElementById("vep-copy-btn").onclick = function () {
+					const parts = [titleText, ""];
+					if (fileName) parts.push("File: " + fileName);
+					parts.push("Error: " + (errorData.message || "Unknown error"));
+					if (errorData.stack && errorData.stack.trim()) {
+						parts.push("");
+						parts.push("Stack Trace:");
+						parts.push(errorData.stack);
+					}
+					const text = parts.join("\n");
+					const btn = this;
+					if (navigator.clipboard && navigator.clipboard.writeText) {
+						navigator.clipboard
+							.writeText(text)
+							.then(function () {
+								btn.innerHTML = "\u2714 Copied!";
+								setTimeout(function () {
+									btn.innerHTML = "\u{1F4CB} Copy Error";
+								}, COPY_FEEDBACK_DELAY_MS);
+							})
+							.catch(function () {
+								btn.innerHTML = "Copy failed";
+							});
+					}
+				};
+				document.getElementById("vep-retry-btn").onclick = function () {
+					panel.remove();
+					window.location.reload();
+				};
+
+				document.addEventListener("keydown", function onEsc(e) {
+					if (e.key === "Escape") {
+						panel.remove();
+						document.removeEventListener("keydown", onEsc);
+					}
+				});
+			} catch (e) {
+				console.error("[webapps-proxy] showErrorOverlayInPage failed:", e);
+			}
+		}
+
+		function sendErrorToParent(errorData) {
+			const errorHash = getErrorHash(errorData);
+			const now = Date.now();
+
+			if (recentErrors[errorHash]) {
+				const timeSinceLastSend = now - recentErrors[errorHash];
+				if (timeSinceLastSend < ERROR_DEDUP_WINDOW_MS) {
+					return;
+				}
+			}
+
+			recentErrors[errorHash] = now;
+
+			const errorKeys = Object.keys(recentErrors);
+			if (errorKeys.length > 50) {
+				const sortedKeys = errorKeys.sort(function (a, b) {
+					return recentErrors[a] - recentErrors[b];
+				});
+				for (let i = 0; i < sortedKeys.length - 50; i++) {
+					delete recentErrors[sortedKeys[i]];
+				}
+			}
+
+			if (window.parent && window.parent !== window) {
+				try {
+					const msg = {
+						type: errorData.type,
+						message: errorData.message,
+						stack: errorData.stack,
+						metadata: {
+							source: errorData.source || window.location.href,
+							level: errorData.level,
+							method: errorData.method,
+							url: errorData.url,
+							status: errorData.status,
+							duration: errorData.duration,
+						},
+						_source: "webapps-proxy-injected-script",
+					};
+					window.parent.postMessage(msg, "*");
+				} catch (err) {
+					console.error("[webapps-proxy] Failed to send error to parent:", err);
+				}
+			} else {
+				showErrorOverlayInPage(errorData);
+			}
+		}
+		// Expose for fetch interceptor: once init runs, network errors use sendErrorToParent (dedup)
+		try {
+			window.__vscodeLivePreviewSendError = sendErrorToParent;
+		} catch (e) {}
+
+		const initTime = new Date().toISOString();
+		if (window.parent && window.parent !== window) {
+			try {
+				window.parent.postMessage(
+					{
+						command: "iframeAlive",
+						version: "2026-01-19-v5",
+						timestamp: initTime,
+						source: "webapps-proxy-injected-script",
+					},
+					"*",
+				);
+			} catch (e) {
+				console.error("[webapps-proxy] Failed to send iframeAlive message:", e);
+			}
+		}
+		if (!document.getElementById("vscode-text-selection-style")) {
+			const style = document.createElement("style");
+			style.id = "vscode-text-selection-style";
+			style.textContent =
+				"* { -webkit-user-select: text !important; user-select: text !important; }";
+			document.head.appendChild(style);
+		}
+
+		let lastSelection = "";
+		let lastCopyTime = 0;
+		const COPY_THROTTLE_MS = 100;
+
+		// Function to get current selection and send copy message
+		function sendCopyMessage(forceCopy) {
+			if (forceCopy === undefined) forceCopy = false;
+			const timestamp = new Date().toISOString();
+			const now = Date.now();
+			const timeSinceLastCopy = now - lastCopyTime;
+			let selection = window.getSelection();
+			let text = "";
+
+			if (selection && selection.toString().trim()) {
+				text = selection.toString();
+			} else {
+				try {
+					const docSelection = document.getSelection();
+					if (docSelection && docSelection.toString().trim()) {
+						text = docSelection.toString();
+					}
+				} catch (e) {}
+			}
+			if (!text || text.length === 0) {
+				try {
+					const activeElement = document.activeElement;
+					if (
+						activeElement &&
+						(activeElement.tagName === "INPUT" || activeElement.tagName === "TEXTAREA")
+					) {
+						const input = activeElement;
+						if (input.selectionStart !== undefined && input.selectionEnd !== undefined) {
+							text = input.value.substring(input.selectionStart, input.selectionEnd);
+						}
+					}
+				} catch (e) {}
+			}
+			if (!text || text.trim().length === 0) {
+				return;
+			}
+
+			const selectionChanged = text !== lastSelection;
+			const shouldThrottle = !forceCopy && timeSinceLastCopy < COPY_THROTTLE_MS;
+
+			if (forceCopy || (selectionChanged && !shouldThrottle)) {
+				lastSelection = text;
+				lastCopyTime = now;
+
+				if (window.parent && window.parent !== window) {
+					try {
+						const message = {
+							command: "copy",
+							text: text,
+							timestamp: timestamp,
+						};
+						window.parent.postMessage(message, "*");
+					} catch (err) {
+						console.error("[webapps-proxy] Copy: Error sending postMessage:", err);
+					}
+				}
+			}
+		}
+
+		// Listen for keyboard shortcuts (Cmd+C / Ctrl+C) - user-initiated, always send
+		document.addEventListener(
+			"keydown",
+			function (e) {
+				// Cmd+C (Mac) or Ctrl+C (Windows/Linux)
+				if ((e.metaKey || e.ctrlKey) && (e.key === "c" || e.key === "C" || e.keyCode === 67)) {
+					// Small delay to ensure selection is captured after VS Code processes the event
+					setTimeout(function () {
+						sendCopyMessage(true); // forceCopy = true for user-initiated actions
+					}, 0);
+				}
+			},
+			true,
+		); // Use capture phase - highest priority
+
+		// Listen for copy events as backup
+		document.addEventListener(
+			"copy",
+			function (e) {
+				// Also force send on copy event (user-initiated)
+				setTimeout(function () {
+					sendCopyMessage(true);
+				}, 0);
+			},
+			true,
+		); // Use capture phase to catch before VS Code intercepts
+
+		document.addEventListener(
+			"contextmenu",
+			function (e) {
+				// Prevent default browser context menu so our custom one shows
+				e.preventDefault();
+				const selection = window.getSelection();
+				const selectedText = selection && selection.toString().trim() ? selection.toString() : "";
+				if (window.parent && window.parent !== window) {
+					try {
+						window.parent.postMessage(
+							{
+								command: "rightClick",
+								x: e.clientX,
+								y: e.clientY,
+								selectedText: selectedText,
+							},
+							"*",
+						);
+					} catch (err) {
+						console.error("[webapps-proxy] Right-click: Error sending postMessage:", err);
+					}
+				}
+			},
+			true,
+		);
+
+		window.addEventListener("message", function (e) {
+			if (e.data && e.data.command === "getSelection") {
+				const selection = window.getSelection();
+				const text = selection && selection.toString() ? selection.toString() : "";
+				if (window.parent && window.parent !== window) {
+					window.parent.postMessage({ command: "selectionText", text: text }, "*");
+				}
+			} else if (e.data && e.data.command === "selectAll") {
+				document.execCommand("selectAll", false, null);
+			} else if (e.data && e.data.command === "paste") {
+				// Paste text into active element or document
+				if (e.data.text) {
+					try {
+						const activeElement = document.activeElement;
+						if (
+							activeElement &&
+							(activeElement.tagName === "INPUT" ||
+								activeElement.tagName === "TEXTAREA" ||
+								activeElement.isContentEditable)
+						) {
+							if (activeElement.tagName === "INPUT" || activeElement.tagName === "TEXTAREA") {
+								const input = activeElement;
+								const start = input.selectionStart || 0;
+								const end = input.selectionEnd || 0;
+								const value = input.value || "";
+								input.value = value.substring(0, start) + e.data.text + value.substring(end);
+								input.selectionStart = input.selectionEnd = start + e.data.text.length;
+								input.dispatchEvent(new Event("input", { bubbles: true }));
+							} else if (activeElement.isContentEditable) {
+								document.execCommand("insertText", false, e.data.text);
+							}
+						} else {
+							// Fallback: try to paste into body
+							document.execCommand("insertText", false, e.data.text);
+						}
+					} catch (err) {
+						console.error("[webapps-proxy] paste: Failed to paste text:", err);
+					}
+				}
+			}
+		});
+
+		// Send click events to parent to hide context menu when clicking elsewhere
+		document.addEventListener(
+			"click",
+			function (e) {
+				if (window.parent && window.parent !== window) {
+					try {
+						window.parent.postMessage(
+							{
+								command: "iframeClick",
+								x: e.clientX,
+								y: e.clientY,
+							},
+							"*",
+						);
+					} catch (err) {
+						// Silently fail if postMessage fails
+					}
+				}
+			},
+			true,
+		);
+
+		// 1. Handle unhandled JavaScript errors (runtime - extension shows Refresh Panel)
+		window.addEventListener(
+			"error",
+			function (event) {
+				const errorData = {
+					type: "runtime",
+					message: event.message || "Unknown error",
+					stack: event.error ? event.error.stack : "",
+					source: event.filename || window.location.href,
+				};
+				console.error("[webapps-proxy] Unhandled error detected:", errorData);
+				sendErrorToParent(errorData);
+			},
+			true,
+		);
+
+		// 2. Handle unhandled promise rejections (runtime or network - extension shows appropriate actions)
+		window.addEventListener("unhandledrejection", function (event) {
+			const reason = event.reason;
+			const msg =
+				reason && reason.message ? reason.message : String(reason) || "Unhandled promise rejection";
+			// "Failed to fetch" and similar come from fetch() rejections (DNS, CORS, connection) — classify as network
+			const isNetworkFailure =
+				/failed to fetch|network request failed|load failed|networkerror/i.test(msg);
+			const errorData = {
+				type: isNetworkFailure ? "network" : "runtime",
+				message: msg,
+				stack: reason && reason.stack ? reason.stack : "",
+				source: window.location.href,
+			};
+			console.error("[webapps-proxy] Unhandled promise rejection detected:", errorData);
+			sendErrorToParent(errorData);
+		});
+
+		// 3. Override console.error to catch errors surfaced by frameworks (React, Vite).
+		// Trade-off: this catches all console.error calls (including third-party noise).
+		// The ignore list below filters known framework messages. A re-entrancy guard
+		// prevents infinite loops if sendErrorToParent itself triggers console.error.
+		const originalConsoleError = console.error;
+		let _inConsoleErrorOverride = false;
+		console.error = function () {
+			const args = Array.prototype.slice.call(arguments);
+			originalConsoleError.apply(console, args);
+			if (_inConsoleErrorOverride) return;
+			_inConsoleErrorOverride = true;
+			try {
+				let message = "";
+				let stack = "";
+
+				for (let i = 0; i < args.length; i++) {
+					const arg = args[i];
+					if (arg instanceof Error) {
+						message = arg.message;
+						stack = arg.stack || "";
+						break;
+					} else if (typeof arg === "string") {
+						message = arg;
+					} else if (arg && typeof arg === "object") {
+						message =
+							arg.message && typeof arg.message === "string" ? arg.message : JSON.stringify(arg);
+					} else {
+						message = String(arg);
+					}
+				}
+
+				// If no message extracted, stringify all args (avoid [object Object])
+				if (!message && args.length > 0) {
+					message = args
+						.map(function (arg) {
+							if (arg && typeof arg === "object" && !(arg instanceof Error)) {
+								return arg.message && typeof arg.message === "string"
+									? arg.message
+									: JSON.stringify(arg);
+							}
+							return String(arg);
+						})
+						.join(" ");
+				}
+				// Skip sending noise: [object Object] with no useful content
+				if (message === "[object Object]") {
+					return;
+				}
+
+				const messageLower = (
+					typeof message === "string" ? message : String(message)
+				).toLowerCase();
+				if (messageLower.includes("failed to reload")) {
+					const errorData = {
+						type: "compile",
+						level: "error",
+						message: (typeof message === "string" ? message : String(message)) || "Console error",
+						stack: stack,
+					};
+					sendErrorToParent(errorData);
+					return;
+				}
+				// Filter out other noisy/expected errors that shouldn't trigger notifications
+				const shouldIgnore =
+					messageLower.includes("hmr update") ||
+					messageLower.includes("fast refresh") ||
+					messageLower.includes("could not fast refresh") ||
+					(messageLower.includes("[vite]") && messageLower.includes("hmr")) ||
+					messageLower.includes("reactdomclient.createroot");
+
+				if (shouldIgnore) {
+					return; // Don't send these to VS Code
+				}
+
+				// Skip network errors: fetch interceptor already sends them (avoids double postMessage)
+				for (let i = 0; i < args.length; i++) {
+					if (args[i] && typeof args[i] === "object" && args[i].type === "network") {
+						return;
+					}
+				}
+
+				const errorData = {
+					type: "runtime",
+					level: "error",
+					message: message || "Console error",
+					stack: stack,
+				};
+
+				sendErrorToParent(errorData);
+			} finally {
+				_inConsoleErrorOverride = false;
+			}
+		};
+	}
+
+	// Defer execution to avoid blocking initial page render
+	// Wait for page to be interactive before initializing
+	if (document.readyState === "loading") {
+		document.addEventListener("DOMContentLoaded", function () {
+			deferInit(initVSCodeLivePreview);
+		});
+	} else if (document.readyState === "interactive") {
+		// DOM is interactive, defer to next idle period
+		deferInit(initVSCodeLivePreview);
+	} else {
+		// DOM is complete, run immediately but asynchronously
+		deferInit(initVSCodeLivePreview);
+	}
+})();

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@salesforce/webapp-experimental",
   "description": "[experimental] Core package for Salesforce Web Applications",
-  "version": "1.72.0",
+  "version": "1.73.1",
   "license": "SEE LICENSE IN LICENSE.txt",
   "type": "module",
   "main": "./dist/index.js",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@salesforce/core": "^8.23.4",
-    "@salesforce/sdk-data": "^1.72.0",
+    "@salesforce/sdk-data": "^1.73.1",
     "axios": "^1.7.7",
     "micromatch": "^4.0.8",
     "path-to-regexp": "^8.3.0"