Update root-cert-stats to use runtime.sendMessage #542 (#547)

* Adding send message and on message functions

* moving table displaying into a new function

* updating rootCertStats from var to let

* updating comments

* Apply Linter change, unused const

Co-authored-by: Rob Wu <rob@robwu.nl>

---------

Co-authored-by: Rob Wu <rob@robwu.nl>
Co-authored-by: rebloor <git@sherpa.co.nz>

root-cert-stats/background.js

@@ -1,9 +1,6 @@
 "use strict";
 
-// Note: declared with "var" because popup.js references this global variable.
-// If this were to be declared with "const" or "let", then the variable would
-// still be available to this file, but not to popup.js.
-var rootCertStats = {};
+let rootCertStats = {};
 
 /*
 On an onHeadersReceived event, if there was a successful TLS connection
@@ -39,3 +36,12 @@ browser.webRequest.onHeadersReceived.addListener(logRootCert,
   {urls: ["<all_urls>"]},
   ["blocking"]
 );
+
+/*
+Send the rootCertStats object to popup.js when requested.
+*/
+browser.runtime.onMessage.addListener((message, sender, sendResponse) => {
+  if (message.action === "getRootCertStats") {
+    sendResponse({ rootCertStats: rootCertStats });
+  }
+});

root-cert-stats/popup.js

@@ -1,33 +1,37 @@
 "use strict";
 
 /*
-Get the background page to access the rootCertStats object
+Send message to the background page to get the rootCertStats object
 */
-const backgroundPage = browser.extension.getBackgroundPage();
+browser.runtime.sendMessage({ action: "getRootCertStats" }, response => {
+  displayTable(response.rootCertStats);
+});
 
-let entries = Object.keys(backgroundPage.rootCertStats);
 
-/*
-If there are any stats, show the table, and append one row for each entry.
-Each row contains the name of the CA and the number of times it has been
-used as a trust root.
-*/
-if (entries.length > 0) {
-
-  let noData = document.querySelector(".no-data");
-  noData.classList.add("hidden");
-  let entryTable = document.querySelector(".root-cert-table");
-  entryTable.classList.remove("hidden");
-
-  for (let entry of entries) {
-    let entryTR = document.createElement("tr");
-    let entryName =  document.createElement("td");
-    let entryValue =  document.createElement("td");
-    entryName.textContent = entry;
-    entryValue.textContent = backgroundPage.rootCertStats[entry];
+function displayTable(rootCertStats) {
+  /*
+  If there are any stats, show the table, and append one row for each entry.
+  Each row contains the name of the CA and the number of times it has been
+  used as a trust root.
+  */
+  let entries = Object.keys(rootCertStats);
 
-    entryTR.appendChild(entryName);
-    entryTR.appendChild(entryValue);
-    entryTable.appendChild(entryTR);
+  if (entries.length > 0) {  
+    let noData = document.querySelector(".no-data");
+    noData.classList.add("hidden");
+    let entryTable = document.querySelector(".root-cert-table");
+    entryTable.classList.remove("hidden");
+
+    for (let entry of entries) {
+      let entryTR = document.createElement("tr");
+      let entryName =  document.createElement("td");
+      let entryValue =  document.createElement("td");
+      entryName.textContent = entry;
+      entryValue.textContent = rootCertStats[entry];
+
+      entryTR.appendChild(entryName);
+      entryTR.appendChild(entryValue);
+      entryTable.appendChild(entryTR);
+    }
   }
 }