From eb82d4265721c05d7d1d46172232d0d9908e1475 Mon Sep 17 00:00:00 2001
From: Maxx Crawford <maxx.crawford@gmail.com>
Date: Mon, 23 Jan 2023 09:25:07 -0600
Subject: [PATCH] Security fix: Swap innerHTML to document.createFragment for
 pageAction.js

---
 src/js/pageAction.js | 38 ++++++++++++++++++++++++++++----------
 1 file changed, 28 insertions(+), 10 deletions(-)

diff --git a/src/js/pageAction.js b/src/js/pageAction.js
index 8aa51e4..a856ac8 100644
--- a/src/js/pageAction.js
+++ b/src/js/pageAction.js
@@ -7,17 +7,35 @@ async function init() {
     tr.classList.add("menu-item", "hover-highlight");
     tr.setAttribute("data-cookie-store-id", identity.cookieStoreId);
     const td = document.createElement("td");
-    td.innerHTML = Utils.escaped`
-        <div class="menu-icon">
-          <div class="usercontext-icon"
-            data-identity-icon="${identity.icon}"
-            data-identity-color="${identity.color}">
-          </div>
-        </div>
-        <span class="menu-text">${identity.name}</span>
-        <img alt="" class="page-action-flag flag-img" src="/img/flags/.png"/>
-        `;
 
+    // Create `<div class="menu-icon">`
+    const fragmentDivMenuIcon = document.createElement("div");
+    fragmentDivMenuIcon.classList.add("menu-icon");
+
+    // Create `<div class="usercontext-icon"`
+    const fragmentDivUserContextIcon= document.createElement("div");
+    fragmentDivUserContextIcon.classList.add("usercontext-icon");
+    fragmentDivUserContextIcon.setAttribute("data-identity-icon", identity.icon);
+    fragmentDivUserContextIcon.setAttribute("data-identity-color", identity.color);
+    fragmentDivMenuIcon.appendChild(fragmentDivUserContextIcon);
+
+    // Append both of <td>
+    td.appendChild(fragmentDivMenuIcon);
+    
+    // Create <span class"menu-text">
+    const fragmentSpanMenuText= document.createElement("span");
+    const fragmentSpanMenuTextContent = document.createTextNode(identity.name);
+    fragmentSpanMenuText.classList.add("menu-text");
+    fragmentSpanMenuText.appendChild(fragmentSpanMenuTextContent);
+    td.appendChild(fragmentSpanMenuText);
+
+    // Create <img class"flag-img">
+    // Note: Flag source is dynamically set via mozillaVpn.js
+    const fragmentImgFlag= document.createElement("img");
+    fragmentImgFlag.classList.add("page-action-flag");
+    fragmentImgFlag.classList.add("flag-img");
+
+    td.appendChild(fragmentImgFlag);
     tr.appendChild(td);
     fragment.appendChild(tr);