Bug 1338386 - Make it clear if request comes from the browser cache; r=Honza

MozReview-Commit-ID: zo6Mh0zK7Z

--HG--
extra : rebase_source : 7787967f82d0144e478fe6ccf7c89fd71df6b0e1

devtools/client/netmonitor/components/request-list-content.js

@@ -42,6 +42,7 @@ const RequestListContent = createClass({
     dispatch: PropTypes.func.isRequired,
     displayedRequests: PropTypes.object.isRequired,
     firstRequestStartedMillis: PropTypes.number.isRequired,
+    fromCache: PropTypes.bool.isRequired,
     onItemMouseDown: PropTypes.func.isRequired,
     onSecurityIconClick: PropTypes.func.isRequired,
     onSelectDelta: PropTypes.func.isRequired,
@@ -240,6 +241,7 @@ const RequestListContent = createClass({
       },
         displayedRequests.map((item, index) => RequestListItem({
           firstRequestStartedMillis,
+          fromCache: item.status === "304" || item.fromCache,
           item,
           index,
           isSelected: item.id === selectedRequestId,

devtools/client/netmonitor/components/request-list-item.js

@@ -65,6 +65,7 @@ const RequestListItem = createClass({
     index: PropTypes.number.isRequired,
     isSelected: PropTypes.bool.isRequired,
     firstRequestStartedMillis: PropTypes.number.isRequired,
+    fromCache: PropTypes.bool.isRequired,
     onContextMenu: PropTypes.func.isRequired,
     onFocusedNodeChange: PropTypes.func,
     onMouseDown: PropTypes.func.isRequired,
@@ -97,6 +98,7 @@ const RequestListItem = createClass({
       index,
       isSelected,
       firstRequestStartedMillis,
+      fromCache,
       onContextMenu,
       onMouseDown,
       onSecurityIconClick
@@ -106,6 +108,11 @@ const RequestListItem = createClass({
     if (isSelected) {
       classList.push("selected");
     }
+
+    if (fromCache) {
+      classList.push("fromCache");
+    }
+
     classList.push(index % 2 ? "odd" : "even");
 
     return (
@@ -383,11 +390,11 @@ const TransferredSizeColumn = createFactory(createClass({
   },
 
   render() {
-    const { transferredSize, fromCache, fromServiceWorker } = this.props.item;
+    const { transferredSize, fromCache, fromServiceWorker, status } = this.props.item;
 
     let text;
     let className = "subitem-label";
-    if (fromCache) {
+    if (fromCache || status === "304") {
       text = L10N.getStr("networkMenu.sizeCached");
       className += " theme-comment";
     } else if (fromServiceWorker) {

devtools/client/themes/netmonitor.css

@@ -591,6 +591,10 @@
   background-color: var(--theme-selection-background-semitransparent);
 }
 
+.request-list-item.fromCache > .requests-list-subitem:not(.requests-list-waterfall) {
+    opacity: 0.6;
+}
+
 .theme-firebug .request-list-item:not(.selected):hover {
   background: #EFEFEF;
 }