From 3c6d2c3b5c129c828f98e1be050dc13575175ee4 Mon Sep 17 00:00:00 2001
From: abose <arun@core.ai>
Date: Sun, 26 Apr 2026 21:01:53 +0530
Subject: [PATCH] fix(live-preview): prevent reflected XSS in
 browser-not-supported page

The error page reflected URL params back via innerHTML, so a crafted
URL could inject arbitrary HTML/JS. Switch to safe DOM construction
(textContent + createElement) and reduce the strings to plain text
with a "\n" line-break marker and a "{0}" placeholder for the
phcode.io link, which the page now builds as a hardcoded anchor.
---
 .../phoenix-splash/live-preview-error.html    | 42 +++++++++++++++----
 src/nls/root/strings.js                       |  4 +-
 2 files changed, 36 insertions(+), 10 deletions(-)

diff --git a/src/assets/phoenix-splash/live-preview-error.html b/src/assets/phoenix-splash/live-preview-error.html
index a8b73d5bb5..eed67140e5 100644
--- a/src/assets/phoenix-splash/live-preview-error.html
+++ b/src/assets/phoenix-splash/live-preview-error.html
@@ -5,14 +5,40 @@
         <link rel="stylesheet" href="styles.css">
         <meta name="robots" content="noindex">
         <script type="text/javascript">
+            // URL params are reflected into the page, so they must NEVER reach
+            // innerHTML — that would be reflected XSS. Build the DOM with
+            // textContent and createElement only. The strings are plain text:
+            // mainHeading uses "\n" for line breaks, mainSpan uses "{0}" as
+            // the placeholder for the phcode.io link.
             function applyTranslations() {
-                const urlSearchParams = new URLSearchParams(window.location.search);
-                const params = Object.fromEntries(urlSearchParams.entries());
-                if(params.mainHeading){
-                    document.getElementById("mainHeading").innerHTML = decodeURIComponent(params.mainHeading);
+                const params = Object.fromEntries(
+                    new URLSearchParams(window.location.search).entries()
+                );
+                if (params.mainHeading) {
+                    const el = document.getElementById("mainHeading");
+                    el.textContent = "";
+                    const lines = decodeURIComponent(params.mainHeading).split("\n");
+                    lines.forEach(function(line, i) {
+                        if (i > 0) {
+                            el.appendChild(document.createElement("br"));
+                        }
+                        el.appendChild(document.createTextNode(line));
+                    });
                 }
-                if(params.mainSpan){
-                    document.getElementById("mainSpan").innerHTML = decodeURIComponent(params.mainSpan);
+                if (params.mainSpan) {
+                    const el = document.getElementById("mainSpan");
+                    el.textContent = "";
+                    const parts = decodeURIComponent(params.mainSpan).split("{0}");
+                    parts.forEach(function(part, i) {
+                        if (i > 0) {
+                            const a = document.createElement("a");
+                            a.href = "https://phcode.io";
+                            a.style.color = "white";
+                            a.textContent = "phcode.io";
+                            el.appendChild(a);
+                        }
+                        el.appendChild(document.createTextNode(part));
+                    });
                 }
             }
         </script>
@@ -23,9 +49,9 @@
         <div id="mainDiv">
             <img id="logo"  src="images/phoenix-logo-broken.svg"/>
             <div id="MainText" class="safari-text">
-                <h2 id="mainHeading">Uh Oh! <br>Your current browser doesn't support live preview.</h2>
+                <h2 id="mainHeading">Uh Oh!<br>Your current browser doesn't support live preview.</h2>
                 <span id="mainSpan">
-                    Get the best live preview experience by downloading our native apps for Windows, Mac, and Linux from <a href="https://phcode.io" style="color: white">phcode.io</a>.<br>
+                    Get the best live preview experience by downloading our native apps for Windows, Mac, and Linux from <a href="https://phcode.io" style="color: white">phcode.io</a>.
                 </span><br>
             </div>
         </div>
diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js
index eacba28a80..9e28baf8dc 100644
--- a/src/nls/root/strings.js
+++ b/src/nls/root/strings.js
@@ -1503,8 +1503,8 @@ define({
     "DESCRIPTION_LIVEDEV_NO_PREVIEW_DETAILS": "Please select an HTML file to preview",
     "DESCRIPTION_LIVEDEV_PREVIEW_RESTRICTED": "Preview Unavailable!",
     "DESCRIPTION_LIVEDEV_PREVIEW_RESTRICTED_DETAILS": "This HTML file is not part of the current project. For security reasons, only project files can be live-previewed. To preview this file, open its containing folder as a separate project.",
-    "DESCRIPTION_LIVEDEV_MAIN_HEADING": "Uh Oh! <br>Your current browser doesn't support live preview.",
-    "DESCRIPTION_LIVEDEV_MAIN_SPAN": "Get the best live preview experience by downloading our native apps for Windows, Mac, and Linux from <a href=\"https://phcode.io\" style=\"color: white\">phcode.io</a>.<br>",
+    "DESCRIPTION_LIVEDEV_MAIN_HEADING": "Uh Oh!\nYour current browser doesn't support live preview.",
+    "DESCRIPTION_LIVEDEV_MAIN_SPAN": "Get the best live preview experience by downloading our native apps for Windows, Mac, and Linux from {0}.",
     "DESCRIPTION_LIVEDEV_SECURITY_POPOUT_MESSAGE": "You are about to open a file for live preview. Please proceed only if you trust the source of this project. Click 'Trust Project' to continue, or close this window if you do not trust the source.",
     "DESCRIPTION_LIVEDEV_SECURITY_TRUST_MESSAGE": "You are about to open a file for live preview. Please proceed by clicking 'Trust Project' only if you trust the source of this project!",
     "CONFIRM_EXTERNAL_BROWSER_TITLE": "Pop-ups Blocked",