Security fix: Swap innerHTML to document.createFragment for pageActio…

…n.js
mozilla · Jan 23, 2023 · 6e5e3cc · 6e5e3cc
1 parent a91c6b0
commit 6e5e3cc
Showing 1 changed file with 28 additions and 10 deletions.
diff --git 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);