PFG content script now passes around a jsonable object rather than the raw data

assets/js/background.js

@@ -2,26 +2,43 @@ document.getElementById("grabbutton").addEventListener("click", function () {
     browser.tabs.query({ active: true, currentWindow: true }).then(tabs => {
         browser.tabs
             .sendMessage(tabs[0].id, { action: "get" })
-            .then(response => {
+            .then((response) => {
                 tablebody = document.getElementById("tablebody");
                 tablebody.innerHTML = "";
-                response.forEach(row => {
-                    let tr = document.createElement("tr");
-                    const cellids = [0, 4, 6, 7];
-                    for (let i = 0; i < cellids.length; i++) {
-                        let td = document.createElement("td");
-                        td.textContent = row[cellids[i]];
-                        if (i == 1) td.textContent = td.textContent.substring(13);
-                        tr.appendChild(td);
-                    }
+
+                console.log(response);
+
+                keys = Object.keys(response);
+                keys.forEach(key => {
+                    tr = document.createElement("tr");
+
+                    td1 = document.createElement("td");
+                    td1.textContent = key;
+                    tr.appendChild(td1);
+
+                    td2 = document.createElement("td");
+                    td2.textContent = response[key].qty;
+                    tr.appendChild(td2);
+
+                    td3 = document.createElement("td");
+                    td3.textContent = response[key].cost;
+                    tr.appendChild(td3);
+
+                    td4 = document.createElement("td");
+                    td4.textContent = "$" + (parseFloat(response[key].qty * response[key].cost.substring(1)).toFixed(2));
+                    tr.appendChild(td4);
+
                     tablebody.appendChild(tr);
+                    console.log(tr);
+
                 });
+                browser.storage.local.set(responsedata);
             });
-    })
-        .catch(error => {
-            console.log(error);
-        });
-});
+    });
+})
+    .catch(error => {
+        console.log(error);
+    });
 
 document.getElementById("inputbutton").addEventListener("click", function () {
     browser.tabs.query({ active: true, currentWindow: true }).then(tabs => {

assets/js/contentscript_pfg.js

@@ -1,9 +1,14 @@
 function getInvoice() {
-    return Array.from(document.getElementsByClassName("css-8tkdem")).map(row => {
+    let invoice = Array.from(document.getElementsByClassName("css-8tkdem")).map(row => {
         return Array.from(row.children).map(container => {
             return container.textContent;
         })
     });
+    x = {};
+    invoice.forEach((row) => {
+        x[row[0]] = { qty: row[4].substring(13), cost: row[6] }
+    });
+    return x;
 }
 
 browser.runtime.onMessage.addListener(function (message, sender, sendResponse) {

manifest.json

@@ -4,7 +4,8 @@
     "version": "0.1",
     "manifest_version": 2,
     "permissions": [
-        "activeTab"
+        "activeTab",
+        "storage"
     ],
     "icons": {
         "48": "assets/img/favicon.ico"