Escape only where we are displaying

Signed-off-by: DL6ER <dl6er@dl6er.de>

scripts/pi-hole/js/groups-clients.js

@@ -147,7 +147,7 @@ function initTable() {
         '" title="' +
         tooltip +
         '" class="breakall">' +
-        data.client +
+        utils.escapeHtml(data.client) +
         "</code>";
       if (data.name !== null && data.name.length > 0)
         ipName +=
@@ -156,13 +156,13 @@ function initTable() {
           '" title="' +
           tooltip +
           '" class="breakall">' +
-          data.name +
+          utils.escapeHtml(data.name) +
           "</code>";
       $("td:eq(1)", row).html(ipName);
 
       $("td:eq(2)", row).html('<input id="comment_' + dataId + '" class="form-control">');
       var commentEl = $("#comment_" + dataId, row);
-      commentEl.val(utils.unescapeHtml(data.comment));
+      commentEl.val(data.comment);
       commentEl.on("change", editClient);
 
       $("td:eq(3)", row).empty();
@@ -403,11 +403,14 @@ function delItems(ids) {
 }
 
 function addClient() {
-  const comment = utils.escapeHtml($("#new_comment").val());
+  const comment = $("#new_comment").val();
 
   // Check if the user wants to add multiple IPs (space or newline separated)
   // If so, split the input and store it in an array
-  var ips = utils.escapeHtml($("#select").val().trim()).split(/[\s,]+/);
+  var ips = $("#select")
+    .val()
+    .trim()
+    .split(/[\s,]+/);
   // Remove empty elements
   ips = ips.filter(function (el) {
     return el !== "";
@@ -483,7 +486,7 @@ function editClient() {
     .find("#multiselect_" + client)
     .val()
     .map(Number);
-  const comment = utils.escapeHtml(tr.find("#comment_" + client).val());
+  const comment = tr.find("#comment_" + client).val();
   const enabled = tr.find("#enabled_" + client).is(":checked");
 
   var done = "edited";

scripts/pi-hole/js/groups-common.js

@@ -36,11 +36,6 @@ function processGroupResult(data, type, done, notDone) {
   // Loop over errors and display them
   data.processed.errors.forEach(function (error) {
     console.log(error); // eslint-disable-line no-console
-    utils.showAlert(
-      "error",
-      "",
-      `Error while ${notDone} ${type} ${utils.escapeHtml(error.item)}`,
-      error.error
-    );
+    utils.showAlert("error", "", `Error while ${notDone} ${type} ${error.item}`, error.error);
   });
 }

scripts/pi-hole/js/groups-domains.js

@@ -151,7 +151,7 @@ function initTable() {
           '" title="' +
           tooltip +
           '" class="breakall">' +
-          data.domain +
+          utils.escapeHtml(data.domain) +
           "</code>"
       );
 
@@ -205,7 +205,7 @@ function initTable() {
       // Comment field
       $("td:eq(4)", row).html('<input id="comment_' + dataId + '" class="form-control">');
       var commentEl = $("#comment_" + dataId, row);
-      commentEl.val(utils.unescapeHtml(data.comment));
+      commentEl.val(data.comment);
       commentEl.on("change", editDomain);
 
       // Group assignment field (multi-select)
@@ -512,7 +512,7 @@ function addDomain() {
   domains = domains.filter(function (el) {
     return el !== "";
   });
-  const domainStr = utils.escapeHtml(JSON.stringify(domains));
+  const domainStr = JSON.stringify(domains);
 
   utils.disableAll();
   utils.showAlert("info", "", "Adding domain(s)...", domainStr);
@@ -578,7 +578,7 @@ function editDomain() {
   const newTypestr = tr.find("#type_" + domain).val();
   const oldTypeStr = tr.find("#old_type_" + domain).val();
   const enabled = tr.find("#enabled_" + domain).is(":checked");
-  const comment = utils.escapeHtml(tr.find("#comment_" + domain).val());
+  const comment = tr.find("#comment_" + domain).val();
   // Convert list of string integers to list of integers using map
   const groups = tr
     .find("#multiselect_" + domain)
@@ -624,7 +624,7 @@ function editDomain() {
 
   utils.disableAll();
   const domainDecoded = utils.hexDecode(domain.split("_")[0]);
-  utils.showAlert("info", "", "Editing domain...", domain);
+  utils.showAlert("info", "", "Editing domain...", domainDecoded);
   $.ajax({
     url: "/api/domains/" + newTypestr + "/" + encodeURIComponent(domainDecoded),
     method: "put",

scripts/pi-hole/js/groups-lists.js

@@ -194,16 +194,20 @@ function initTable() {
         // Local files cannot be downloaded from a distant client so don't show
         // a link to such a list here
         $("td:eq(2)", row).html(
-          '<code id="address_' + dataId + '" class="breakall">' + data.address + "</code>"
+          '<code id="address_' +
+            dataId +
+            '" class="breakall">' +
+            utils.escapeHtml(data.address) +
+            "</code>"
         );
       } else {
         $("td:eq(2)", row).html(
           '<a id="address_' +
             dataId +
             '" class="breakall" href="' +
-            data.address +
+            encodeURI(data.address) +
             '" target="_blank" rel="noopener noreferrer">' +
-            data.address +
+            utils.escapeHtml(data.address) +
             "</a>"
         );
       }
@@ -227,7 +231,7 @@ function initTable() {
 
       $("td:eq(4)", row).html('<input id="comment_' + dataId + '" class="form-control">');
       var commentEl = $("#comment_" + dataId, row);
-      commentEl.val(utils.unescapeHtml(data.comment));
+      commentEl.val(data.comment);
       commentEl.on("change", editList);
 
       $("td:eq(5)", row).empty();
@@ -497,11 +501,13 @@ function delItems(ids) {
 
 function addList(event) {
   const type = event.data.type;
-  const comment = utils.escapeHtml($("#new_comment").val());
+  const comment = $("#new_comment").val();
 
   // Check if the user wants to add multiple domains (space or newline separated)
   // If so, split the input and store it in an array
-  var addresses = utils.escapeHtml($("#new_address").val()).split(/[\s,]+/);
+  var addresses = $("#new_address")
+    .val()
+    .split(/[\s,]+/);
   // Remove empty elements
   addresses = addresses.filter(function (el) {
     return el !== "";

scripts/pi-hole/js/groups.js

@@ -75,7 +75,7 @@ $(function () {
         '<input id="name_' + data.id + '" title="' + tooltip + '" class="form-control">'
       );
       var nameEl = $("#name_" + data.id, row);
-      nameEl.val(utils.unescapeHtml(data.name));
+      nameEl.val(data.name);
       nameEl.on("change", editGroup);
 
       $("td:eq(2)", row).html(
@@ -98,7 +98,7 @@ $(function () {
       $("td:eq(3)", row).html('<input id="comment_' + data.id + '" class="form-control">');
       var comment = data.comment !== null ? data.comment : "";
       var commentEl = $("#comment_" + data.id, row);
-      commentEl.val(utils.unescapeHtml(comment));
+      commentEl.val(comment);
       commentEl.on("change", editGroup);
 
       $("td:eq(4)", row).empty();
@@ -277,7 +277,7 @@ function delItems(ids) {
 }
 
 function addGroup() {
-  const comment = utils.escapeHtml($("#new_comment").val());
+  const comment = $("#new_comment").val();
 
   // Check if the user wants to add multiple groups (space or newline separated)
   // If so, split the input and store it in an array
@@ -337,9 +337,9 @@ function editGroup() {
   const tr = $(this).closest("tr");
   const id = tr.attr("data-id");
   const oldName = idNames[id];
-  const name = utils.escapeHtml(tr.find("#name_" + id).val());
+  const name = tr.find("#name_" + id).val();
   const enabled = tr.find("#enabled_" + id).is(":checked");
-  const comment = utils.escapeHtml(tr.find("#comment_" + id).val());
+  const comment = tr.find("#comment_" + id).val();
 
   var done = "edited";
   var notDone = "editing";

scripts/pi-hole/js/index.js

@@ -262,7 +262,7 @@ function updateForwardDestinationsPie() {
 }
 
 function updateTopClientsTable(blocked) {
-  var api, style, tablecontent, overlay, clienttable;
+  let api, style, tablecontent, overlay, clienttable;
   if (blocked) {
     api = "/api/stats/top_clients?blocked=true";
     style = "queries-blocked";
@@ -280,9 +280,8 @@ function updateTopClientsTable(blocked) {
   $.getJSON(api, function (data) {
     // Clear tables before filling them with data
     tablecontent.remove();
-    var url,
-      percentage,
-      sum = blocked ? data.blocked_queries : data.total_queries;
+    let url, percentage;
+    const sum = blocked ? data.blocked_queries : data.total_queries;
 
     // Add note if there are no results (e.g. privacy mode enabled)
     if (jQuery.isEmptyObject(data.clients)) {
@@ -292,10 +291,14 @@ function updateTopClientsTable(blocked) {
     // Populate table with content
     data.clients.forEach(function (client) {
       // Sanitize client
-      var clientname = utils.escapeHtml(client.name);
-      var clientip = utils.escapeHtml(client.ip);
-      if (clientname.length === 0) clientname = clientip;
-      url = '<a href="queries.lp?client_ip=' + clientip + '">' + clientname + "</a>";
+      let clientname = client.name;
+      if (clientname.length === 0) clientname = client.ip;
+      url =
+        '<a href="queries.lp?client_ip=' +
+        encodeURIComponent(client.ip) +
+        '">' +
+        utils.escapeHtml(clientname) +
+        "</a>";
       percentage = (client.count / sum) * 100;
 
       // Add row to table
@@ -316,7 +319,7 @@ function updateTopClientsTable(blocked) {
 }
 
 function updateTopDomainsTable(blocked) {
-  var api, style, tablecontent, overlay, domaintable;
+  let api, style, tablecontent, overlay, domaintable;
   if (blocked) {
     api = "/api/stats/top_domains?blocked=true";
     style = "queries-blocked";
@@ -334,11 +337,8 @@ function updateTopDomainsTable(blocked) {
   $.getJSON(api, function (data) {
     // Clear tables before filling them with data
     tablecontent.remove();
-    var url,
-      domain,
-      percentage,
-      urlText,
-      sum = blocked ? data.blocked_queries : data.total_queries;
+    let url, domain, percentage, urlText;
+    const sum = blocked ? data.blocked_queries : data.total_queries;
 
     // Add note if there are no results (e.g. privacy mode enabled)
     if (jQuery.isEmptyObject(data.domains)) {
@@ -348,7 +348,7 @@ function updateTopDomainsTable(blocked) {
     // Populate table with content
     data.domains.forEach(function (item) {
       // Sanitize domain
-      domain = utils.escapeHtml(item.domain);
+      domain = encodeURIComponent(item.domain);
       // Substitute "." for empty domain lookups
       urlText = domain === "" ? "." : domain;
       url = '<a href="queries.lp?domain=' + domain + '">' + urlText + "</a>";

scripts/pi-hole/js/settings-advanced.js

@@ -59,11 +59,11 @@ function generateRow(topic, key, value) {
     "</div>" +
     '<div class="box-body">' +
     '<div class="form-group">';
-  var defaultValueHint = "";
+  let defaultValueHint = "";
   if (value.modified) {
     defaultValueHint = "";
     if (value.default !== null) {
-      var defVal = utils.escapeHtml(JSON.stringify(value.default));
+      let defVal = utils.escapeHtml(JSON.stringify(value.default));
       switch (defVal) {
         case "true": {
           defVal = "enabled";

scripts/pi-hole/js/settings-dns-records.js

@@ -173,7 +173,7 @@ function delHosts(elem) {
       utils.showAlert(
         "error",
         "",
-        "Error while deleting DNS record: <code>" + utils.escapeHtml(elem) + "</code>",
+        "Error while deleting DNS record: <code>" + elem + "</code>",
         data.responseText
       );
       console.log(exception); // eslint-disable-line no-console
@@ -205,7 +205,7 @@ function delCNAME(elem) {
       utils.showAlert(
         "error",
         "",
-        "Error while deleting CNAME record: <code>" + utils.escapeHtml(elem) + "</code>",
+        "Error while deleting CNAME record: <code>" + elem + "</code>",
         data.responseText
       );
       console.log(exception); // eslint-disable-line no-console

scripts/pi-hole/js/utils.js

@@ -86,8 +86,8 @@ function padNumber(num) {
 var showAlertBox = null;
 function showAlert(type, icon, title, message) {
   const options = {
-      title: "&nbsp;<strong>" + title + "</strong><br>",
-      message: message,
+      title: "&nbsp;<strong>" + escapeHtml(title) + "</strong><br>",
+      message: escapeHtml(message),
       icon: icon,
     },
     settings = {
@@ -123,9 +123,9 @@ function showAlert(type, icon, title, message) {
         var data = JSON.parse(message);
         console.log(data); // eslint-disable-line no-console
         if (data.error !== undefined) {
-          options.title = "&nbsp;<strong>" + data.error.message + "</strong><br>";
+          options.title = "&nbsp;<strong>" + escapeHtml(data.error.message) + "</strong><br>";
 
-          if (data.error.hint !== null) options.message = data.error.hint;
+          if (data.error.hint !== null) options.message = escapeHtml(data.error.hint);
         }
       } catch {
         // Do nothing