(Firefox warning fix-1) Senitize HTML In swapDropdown Method (#294)

* senitize elements * senitize elements
XengShi · Dec 10, 2024 · 15254c7 · 15254c7
1 parent ce7e083
commit 15254c7
Showing 1 changed file with 15 additions and 11 deletions.
diff --git a/script.js b/script.js
@@ -728,11 +728,14 @@ document.addEventListener("DOMContentLoaded", () => {
         element.addEventListener('click', () => {
             const engine = element.getAttribute('data-engine');
             const radioButton = document.querySelector(`input[type="radio"][value="engine${engine}"]`);
+            const selector = `*[data-engine-name=${element.getAttribute('data-engine-name')}]`;
 
+            // console.log(element, selector);
+
             radioButton.checked = true;
 
             // Swap The dropdown. and sort them
-            swapDropdown(element);
+            swapDropdown(selector);
             sortDropdown()
 
             localStorage.setItem("selectedSearchEngine", radioButton.value);
@@ -748,10 +751,10 @@ document.addEventListener("DOMContentLoaded", () => {
 
             const radioButtonValue = radioButton.value.charAt(radioButton.value.length - 1);
 
-            const element = document.querySelector(`[data-engine="${radioButtonValue}"]`);
+            const selector = `[data-engine="${radioButtonValue}"]`;
 
             // Swap The dropdown.
-            swapDropdown(element);
+            swapDropdown(selector);
             sortDropdown()
 
             localStorage.setItem("selectedSearchEngine", radioButton.value);
@@ -765,15 +768,16 @@ document.addEventListener("DOMContentLoaded", () => {
      */
     function swapDropdown(selectedElement) {
         // Swap innerHTML
+        const element = document.querySelector(selectedElement);
         const tempHTML = defaultEngine.innerHTML;
-        defaultEngine.innerHTML = selectedElement.innerHTML;
-        selectedElement.innerHTML = tempHTML;
+        defaultEngine.innerHTML = element.innerHTML;
+        element.innerHTML = tempHTML;
 
         // Swap attributes
         ['data-engine', 'data-engine-name', 'id'].forEach(attr => {
             const tempAttr = defaultEngine.getAttribute(attr);
-            defaultEngine.setAttribute(attr, selectedElement.getAttribute(attr));
-            selectedElement.setAttribute(attr, tempAttr);
+            defaultEngine.setAttribute(attr, element.getAttribute(attr));
+            element.setAttribute(attr, tempAttr);
         });
     }
 
@@ -815,9 +819,9 @@ document.addEventListener("DOMContentLoaded", () => {
         // check if the default selected search engine is same as the stored one.
         if (storedSearchEngineSN !== defaultDropdownSN) {
             // The following line will find out the appropriate dropdown for the selected search engine.
-            const storedSearchEngineDropdown = document.querySelector(`*[data-engine="${storedSearchEngineSN}"]`);
+            const selector = `*[data-engine="${storedSearchEngineSN}"]`;
 
-            swapDropdown(storedSearchEngineDropdown);
+            swapDropdown(selector);
             sortDropdown();
         }
 
@@ -860,14 +864,14 @@ document.addEventListener("DOMContentLoaded", () => {
             } else if (event.key === 'ArrowUp') {
                 selectedIndex = (selectedIndex - 1 + dropdownItems.length) % dropdownItems.length; // Move up, loop around
             } else if (event.key === "Enter") {
-                const element = document.querySelector('.dropdown-content .selected');
+                const selector = '.dropdown-content .selected';
                 const engine = element.getAttribute('data-engine');
                 const radioButton = document.querySelector(`input[type="radio"][value="engine${engine}"]`);
 
                 radioButton.checked = true;
 
                 // Swap The dropdown. and sort them
-                swapDropdown(element);
+                swapDropdown(selector);
                 sortDropdown()
             }
             updateSelection();