Bug 736882 - Request/response details should indicate whether SPDY was used. r?Honza draft
authorVangelis Katsikaros <vkatsikaros@gmail.com>
Thu, 25 May 2017 10:59:42 +0300
changeset 584580 fe362039ff4a158d47f1dee947fe85d662105da4
parent 583701 d93182f36b3c134a3b1c6718f09eb87c2913e364
child 630453 06ce66291b2d246d08bd71101bc54b9848aa9eca
push id60815
push uservkatsikaros@gmail.com
push dateThu, 25 May 2017 19:43:56 +0000
reviewersHonza
bugs736882
milestone55.0a1
Bug 736882 - Request/response details should indicate whether SPDY was used. r?Honza MozReview-Commit-ID: HjzDT76m6Ix
devtools/client/netmonitor/src/components/request-list-column-protocol.js
devtools/client/netmonitor/src/utils/request-utils.js
devtools/client/netmonitor/test/head.js
--- a/devtools/client/netmonitor/src/components/request-list-column-protocol.js
+++ b/devtools/client/netmonitor/src/components/request-list-column-protocol.js
@@ -4,36 +4,39 @@
 
 "use strict";
 
 const {
   createClass,
   DOM,
   PropTypes,
 } = require("devtools/client/shared/vendor/react");
+const { getFormattedProtocol } = require("../utils/request-utils");
 
 const { div } = DOM;
 
 const RequestListColumnProtocol = createClass({
   displayName: "RequestListColumnProtocol",
 
   propTypes: {
     item: PropTypes.object.isRequired,
   },
 
   shouldComponentUpdate(nextProps) {
-    return this.props.item.httpVersion !== nextProps.item.httpVersion;
+    return getFormattedProtocol(this.props.item) !==
+      getFormattedProtocol(nextProps.item);
   },
 
   render() {
-    let { httpVersion = "" } = this.props.item;
+    let protocol = getFormattedProtocol(this.props.item);
+
     return (
       div({
         className: "requests-list-column requests-list-protocol",
-        title: httpVersion,
+        title: protocol,
       },
-        httpVersion
+        protocol
       )
     );
   }
 });
 
 module.exports = RequestListColumnProtocol;
--- a/devtools/client/netmonitor/src/utils/request-utils.js
+++ b/devtools/client/netmonitor/src/utils/request-utils.js
@@ -335,24 +335,41 @@ function getEndTime(item, firstRequestSt
  * a firstRequestStartedMillis.
  */
 function getResponseTime(item, firstRequestStartedMillis = 0) {
   let { startedMillis, totalTime, eventTimings = { timings: {} } } = item;
   return startedMillis + totalTime - firstRequestStartedMillis -
     eventTimings.timings.receive;
 }
 
+/**
+ * Format the protocols used by the request.
+ */
+function getFormattedProtocol(item) {
+  let { httpVersion = "", responseHeaders = { headers: [] } } = item;
+  let protocol = [httpVersion];
+  responseHeaders.headers.some(h => {
+    if (h.hasOwnProperty("name") && h.name.toLowerCase() === "x-firefox-spdy") {
+      protocol.push(h.value);
+      return true;
+    }
+    return false;
+  });
+  return protocol.join("+");
+}
+
 module.exports = {
   getFormDataSections,
   fetchHeaders,
   formDataURI,
   writeHeaderText,
   decodeUnicodeUrl,
   getAbbreviatedMimeType,
   getEndTime,
+  getFormattedProtocol,
   getResponseTime,
   getStartTime,
   getUrlBaseName,
   getUrlBaseNameWithQuery,
   getUrlDetails,
   getUrlHost,
   getUrlHostName,
   getUrlQuery,
--- a/devtools/client/netmonitor/test/head.js
+++ b/devtools/client/netmonitor/test/head.js
@@ -15,16 +15,17 @@ Services.scriptloader.loadSubScript(
 
 const { EVENTS } = require("devtools/client/netmonitor/src/constants");
 const {
   getFormattedIPAndPort,
   getFormattedTime,
 } = require("devtools/client/netmonitor/src/utils/format-utils");
 const {
   decodeUnicodeUrl,
+  getFormattedProtocol,
   getUrlBaseName,
   getUrlHost,
   getUrlQuery,
   getUrlScheme,
 } = require("devtools/client/netmonitor/src/utils/request-utils");
 
 /* eslint-disable no-unused-vars, max-len */
 const EXAMPLE_URL = "http://example.com/browser/devtools/client/netmonitor/test/";
@@ -381,26 +382,26 @@ function verifyRequestItemTarget(documen
 
   let target = document.querySelectorAll(".request-list-item")[visibleIndex];
   let unicodeUrl = decodeUnicodeUrl(url);
   let name = getUrlBaseName(url);
   let query = getUrlQuery(url);
   let host = getUrlHost(url);
   let scheme = getUrlScheme(url);
   let {
-    httpVersion = "",
     remoteAddress,
     remotePort,
     totalTime,
     eventTimings = { timings: {} },
   } = requestItem;
   let formattedIPPort = getFormattedIPAndPort(remoteAddress, remotePort);
   let remoteIP = remoteAddress ? `${formattedIPPort}` : "unknown";
   let duration = getFormattedTime(totalTime);
   let latency = getFormattedTime(eventTimings.timings.wait);
+  let protocol = getFormattedProtocol(requestItem);
 
   if (fuzzyUrl) {
     ok(requestItem.method.startsWith(method), "The attached method is correct.");
     ok(requestItem.url.startsWith(url), "The attached url is correct.");
   } else {
     is(requestItem.method, method, "The attached method is correct.");
     is(requestItem.url, url, "The attached url is correct.");
   }
@@ -418,20 +419,20 @@ function verifyRequestItemTarget(documen
     is(target.querySelector(".requests-list-file").textContent,
       decodeURIComponent(name + (query ? "?" + query : "")),
       "The displayed file is correct.");
     is(target.querySelector(".requests-list-file").getAttribute("title"),
       unicodeUrl, "The tooltip file is correct.");
   }
 
   is(target.querySelector(".requests-list-protocol").textContent,
-    httpVersion, "The displayed protocol is correct.");
+    protocol, "The displayed protocol is correct.");
 
   is(target.querySelector(".requests-list-protocol").getAttribute("title"),
-    httpVersion, "The tooltip protocol is correct.");
+    protocol, "The tooltip protocol is correct.");
 
   is(target.querySelector(".requests-list-domain").textContent,
     host, "The displayed domain is correct.");
 
   let domainTooltip = host + (remoteAddress ? " (" + formattedIPPort + ")" : "");
   is(target.querySelector(".requests-list-domain").getAttribute("title"),
     domainTooltip, "The tooltip domain is correct.");