Bug 1168376: Show transferred size in request summary instead of decompressed size

https://github.com/MoonchildProductions/moebius/pull/93
- without: DOMContentLoaded and load

5 files changed, 63 insertions, 37 deletions

diff --git a/devtools/client/netmonitor/test/browser_net_charts-03.js b/devtools/client/netmonitor/test/browser_net_charts-03.js
index c7d9b0c1a..4a655a8ca 100644
--- a/devtools/client/netmonitor/test/browser_net_charts-03.js
+++ b/devtools/client/netmonitor/test/browser_net_charts-03.js
@@ -33,6 +33,10 @@ add_task(function* () {
     totals: {
       label1: value => "Hello " + L10N.numberWithDecimals(value, 2),
       label2: value => "World " + L10N.numberWithDecimals(value, 2)
+    },
+    header: {
+      label1: "label1header",
+      label2: "label2header",
     }
   });
 
@@ -51,39 +55,48 @@ add_task(function* () {
   is(title.getAttribute("value"), "Table title",
     "The title node displays the correct text.");
 
-  is(rows.length, 3, "There should be 3 table chart rows created.");
+  is(rows.length, 4, "There should be 3 table chart rows and a header created.");
 
-  ok(rows[0].querySelector(".table-chart-row-box.chart-colored-blob"),
-    "A colored blob exists for the firt row.");
   is(rows[0].querySelectorAll("label")[0].getAttribute("name"), "label1",
-    "The first column of the first row exists.");
+    "The first column of the header exists.");
   is(rows[0].querySelectorAll("label")[1].getAttribute("name"), "label2",
+    "The second column of the header exists.");
+  is(rows[0].querySelectorAll("span")[0].textContent, "label1header",
+    "The first column of the header displays the correct text.");
+  is(rows[0].querySelectorAll("span")[1].textContent, "label2header",
+    "The second column of the header displays the correct text.");
+
+  ok(rows[1].querySelector(".table-chart-row-box.chart-colored-blob"),
+    "A colored blob exists for the firt row.");
+  is(rows[1].querySelectorAll("span")[0].getAttribute("name"), "label1",
+    "The first column of the first row exists.");
+  is(rows[1].querySelectorAll("span")[1].getAttribute("name"), "label2",
     "The second column of the first row exists.");
-  is(rows[0].querySelectorAll("label")[0].getAttribute("value"), "1",
+  is(rows[1].querySelectorAll("label")[0].getAttribute("value"), "1",
     "The first column of the first row displays the correct text.");
-  is(rows[0].querySelectorAll("label")[1].getAttribute("value"), "11.1foo",
+  is(rows[1].querySelectorAll("label")[1].getAttribute("value"), "11.1foo",
     "The second column of the first row displays the correct text.");
 
-  ok(rows[1].querySelector(".table-chart-row-box.chart-colored-blob"),
+  ok(rows[2].querySelector(".table-chart-row-box.chart-colored-blob"),
     "A colored blob exists for the second row.");
-  is(rows[1].querySelectorAll("label")[0].getAttribute("name"), "label1",
+  is(rows[2].querySelectorAll("label")[0].getAttribute("name"), "label1",
     "The first column of the second row exists.");
-  is(rows[1].querySelectorAll("label")[1].getAttribute("name"), "label2",
+  is(rows[2].querySelectorAll("label")[1].getAttribute("name"), "label2",
     "The second column of the second row exists.");
-  is(rows[1].querySelectorAll("label")[0].getAttribute("value"), "2",
+  is(rows[2].querySelectorAll("label")[0].getAttribute("value"), "2",
     "The first column of the second row displays the correct text.");
-  is(rows[1].querySelectorAll("label")[1].getAttribute("value"), "12.2bar",
+  is(rows[2].querySelectorAll("label")[1].getAttribute("value"), "12.2bar",
     "The second column of the first row displays the correct text.");
 
-  ok(rows[2].querySelector(".table-chart-row-box.chart-colored-blob"),
+  ok(rows[3].querySelector(".table-chart-row-box.chart-colored-blob"),
     "A colored blob exists for the third row.");
-  is(rows[2].querySelectorAll("label")[0].getAttribute("name"), "label1",
+  is(rows[3].querySelectorAll("label")[0].getAttribute("name"), "label1",
     "The first column of the third row exists.");
-  is(rows[2].querySelectorAll("label")[1].getAttribute("name"), "label2",
+  is(rows[3].querySelectorAll("label")[1].getAttribute("name"), "label2",
     "The second column of the third row exists.");
-  is(rows[2].querySelectorAll("label")[0].getAttribute("value"), "3",
+  is(rows[3].querySelectorAll("label")[0].getAttribute("value"), "3",
     "The first column of the third row displays the correct text.");
-  is(rows[2].querySelectorAll("label")[1].getAttribute("value"), "13.3baz",
+  is(rows[3].querySelectorAll("label")[1].getAttribute("value"), "13.3baz",
     "The second column of the third row displays the correct text.");
 
   is(sums.length, 2, "There should be 2 total summaries created.");
diff --git a/devtools/client/netmonitor/test/browser_net_charts-04.js b/devtools/client/netmonitor/test/browser_net_charts-04.js
index 0d150c409..921701ae5 100644
--- a/devtools/client/netmonitor/test/browser_net_charts-04.js
+++ b/devtools/client/netmonitor/test/browser_net_charts-04.js
@@ -22,6 +22,10 @@ add_task(function* () {
     totals: {
       label1: value => "Hello " + L10N.numberWithDecimals(value, 2),
       label2: value => "World " + L10N.numberWithDecimals(value, 2)
+    },
+    header: {
+      label1: "",
+      label2: ""
     }
   });
 
@@ -40,17 +44,17 @@ add_task(function* () {
   is(title.getAttribute("value"), "Table title",
     "The title node displays the correct text.");
 
-  is(rows.length, 1, "There should be 1 table chart row created.");
+  is(rows.length, 2, "There should be 1 table chart row and a 1 header created.");
 
-  ok(rows[0].querySelector(".table-chart-row-box.chart-colored-blob"),
+  ok(rows[1].querySelector(".table-chart-row-box.chart-colored-blob"),
     "A colored blob exists for the firt row.");
-  is(rows[0].querySelectorAll("label")[0].getAttribute("name"), "size",
+  is(rows[1].querySelectorAll("label")[0].getAttribute("name"), "size",
     "The first column of the first row exists.");
-  is(rows[0].querySelectorAll("label")[1].getAttribute("name"), "label",
+  is(rows[1].querySelectorAll("label")[1].getAttribute("name"), "label",
     "The second column of the first row exists.");
-  is(rows[0].querySelectorAll("label")[0].getAttribute("value"), "",
+  is(rows[1].querySelectorAll("label")[0].getAttribute("value"), "",
     "The first column of the first row displays the correct text.");
-  is(rows[0].querySelectorAll("label")[1].getAttribute("value"),
+  is(rows[1].querySelectorAll("label")[1].getAttribute("value"),
     L10N.getStr("tableChart.loading"),
     "The second column of the first row displays the correct text.");
 
diff --git a/devtools/client/netmonitor/test/browser_net_charts-05.js b/devtools/client/netmonitor/test/browser_net_charts-05.js
index 00445b132..c444d2c65 100644
--- a/devtools/client/netmonitor/test/browser_net_charts-05.js
+++ b/devtools/client/netmonitor/test/browser_net_charts-05.js
@@ -33,6 +33,10 @@ add_task(function* () {
     totals: {
       size: value => "Hello " + L10N.numberWithDecimals(value, 2),
       label: value => "World " + L10N.numberWithDecimals(value, 2)
+    },
+    header: {
+      label1: "",
+      label2: ""
     }
   });
 
@@ -53,9 +57,9 @@ add_task(function* () {
   ok(node.querySelector(".table-chart-container"),
     "A table chart was created successfully.");
 
-  is(rows.length, 3, "There should be 3 pie chart slices created.");
-  is(rows.length, 3, "There should be 3 table chart rows created.");
-  is(sums.length, 2, "There should be 2 total summaries created.");
+  is(rows.length, 4, "There should be 3 pie chart slices and 1 header created.");
+  is(rows.length, 4, "There should be 3 table chart rows and 1 header created.");
+  is(sums.length, 2, "There should be 2 total summaries and 1 header created.");
 
   yield teardown(monitor);
 });
diff --git a/devtools/client/netmonitor/test/browser_net_charts-07.js b/devtools/client/netmonitor/test/browser_net_charts-07.js
index bb992e4eb..a655f258c 100644
--- a/devtools/client/netmonitor/test/browser_net_charts-07.js
+++ b/devtools/client/netmonitor/test/browser_net_charts-07.js
@@ -20,6 +20,10 @@ add_task(function* () {
     totals: {
       label1: value => "Hello " + L10N.numberWithDecimals(value, 2),
       label2: value => "World " + L10N.numberWithDecimals(value, 2)
+    },
+    header: {
+      label1: "",
+      label2: ""
     }
   });
 
@@ -29,17 +33,17 @@ add_task(function* () {
   let rows = grid.querySelectorAll(".table-chart-row");
   let sums = node.querySelectorAll(".table-chart-summary-label");
 
-  is(rows.length, 1, "There should be 1 table chart row created.");
+  is(rows.length, 2, "There should be 1 table chart row and 1 header created.");
 
-  ok(rows[0].querySelector(".table-chart-row-box.chart-colored-blob"),
+  ok(rows[1].querySelector(".table-chart-row-box.chart-colored-blob"),
     "A colored blob exists for the firt row.");
-  is(rows[0].querySelectorAll("label")[0].getAttribute("name"), "size",
+  is(rows[1].querySelectorAll("label")[0].getAttribute("name"), "size",
     "The first column of the first row exists.");
-  is(rows[0].querySelectorAll("label")[1].getAttribute("name"), "label",
+  is(rows[1].querySelectorAll("label")[1].getAttribute("name"), "label",
     "The second column of the first row exists.");
-  is(rows[0].querySelectorAll("label")[0].getAttribute("value"), "",
+  is(rows[1].querySelectorAll("label")[0].getAttribute("value"), "",
     "The first column of the first row displays the correct text.");
-  is(rows[0].querySelectorAll("label")[1].getAttribute("value"),
+  is(rows[1].querySelectorAll("label")[1].getAttribute("value"),
     L10N.getStr("tableChart.unavailable"),
     "The second column of the first row displays the correct text.");
 
diff --git a/devtools/client/netmonitor/test/browser_net_footer-summary.js b/devtools/client/netmonitor/test/browser_net_footer-summary.js
index 94bfa604b..8faa8470b 100644
--- a/devtools/client/netmonitor/test/browser_net_footer-summary.js
+++ b/devtools/client/netmonitor/test/browser_net_footer-summary.js
@@ -44,7 +44,7 @@ add_task(function* () {
   yield teardown(monitor);
 
   function testStatus() {
-    const { count, totalBytes, totalMillis } = getSummary(gStore.getState());
+    const { count, contentSize, transferredSize, millis } = getSummary(gStore.getState());
     let value = $("#requests-menu-network-summary-button").textContent;
     info("Current summary: " + value);
 
@@ -57,13 +57,14 @@ add_task(function* () {
       return;
     }
 
-    info("Computed total bytes: " + totalBytes);
-    info("Computed total millis: " + totalMillis);
+    info("Computed total bytes: " + contentSize);
+    info("Computed total millis: " + millis);
 
-    is(value, PluralForm.get(count, L10N.getStr("networkMenu.summary"))
+    is(value, PluralForm.get(count, L10N.getStr("networkMenu.summary2"))
       .replace("#1", count)
-      .replace("#2", L10N.numberWithDecimals((totalBytes || 0) / 1024, 2))
-      .replace("#3", L10N.numberWithDecimals((totalMillis || 0) / 1000, 2))
+      .replace("#2", L10N.numberWithDecimals((contentSize || 0) / 1024, 2))
+      .replace("#3", L10N.numberWithDecimals((transferredSize || 0) / 1024, 2))
+      .replace("#4", L10N.numberWithDecimals((millis || 0) / 1000, 2))
     , "The current summary text is incorrect.");
   }
 });