Bug 1116428 - Part 2: Present SSLv3 and RC4 warnings in Network Monitor UI. r=vporof

browser/devtools/netmonitor/netmonitor-view.js

@@ -1683,7 +1683,7 @@ RequestsMenuView.prototype = Heritage.extend(WidgetMethods, {
    */
   _onSecurityIconClick: function(e) {
     let state = this.selectedItem.attachment.securityState;
-    if (state === "broken" || state === "secure") {
+    if (state !== "insecure") {
       // Choose the security tab.
       NetMonitorView.NetworkDetails.widget.selectedIndex = 5;
     }
@@ -2765,10 +2765,22 @@ NetworkDetailsView.prototype = {
     let errorbox = $("#security-error");
     let infobox = $("#security-information");
 
-    if (securityInfo.state === "secure") {
+    if (securityInfo.state === "secure" || securityInfo.state === "weak") {
       infobox.hidden = false;
       errorbox.hidden = true;
 
+      // Warning icons
+      let cipher = $("#security-warning-cipher");
+      let sslv3 = $("#security-warning-sslv3");
+
+      if (securityInfo.state === "weak") {
+        cipher.hidden = securityInfo.weaknessReasons.indexOf("cipher") === -1;
+        sslv3.hidden = securityInfo.weaknessReasons.indexOf("sslv3") === -1;
+      } else {
+        cipher.hidden = true;
+        sslv3.hidden = true;
+      }
+
       let enabledLabel = L10N.getStr("netmonitor.security.enabled");
       let disabledLabel = L10N.getStr("netmonitor.security.disabled");
 

browser/devtools/netmonitor/netmonitor.xul

@@ -506,6 +506,9 @@
                                  class="plain tabpanel-summary-value devtools-monospace"
                                  crop="end"
                                  flex="1"/>
+                          <image class="security-warning-icon"
+                                 id="security-warning-sslv3"
+                                 tooltiptext="&netmonitorUI.security.warning.sslv3;" />
                         </hbox>
                         <hbox id="security-ciphersuite"
                               class="tabpanel-summary-container"
@@ -516,6 +519,9 @@
                                  class="plain tabpanel-summary-value devtools-monospace"
                                  crop="end"
                                  flex="1"/>
+                          <image class="security-warning-icon"
+                                 id="security-warning-cipher"
+                                 tooltiptext="&netmonitorUI.security.warning.cipher;" />
                         </hbox>
                       </vbox>
                     </vbox>

browser/devtools/netmonitor/test/browser.ini

@@ -92,6 +92,7 @@ skip-if = e10s # Bug 1091612
 [browser_net_security-state.js]
 [browser_net_security-tab-deselect.js]
 [browser_net_security-tab-visibility.js]
+[browser_net_security-warnings.js]
 [browser_net_simple-init.js]
 [browser_net_simple-request-data.js]
 [browser_net_simple-request-details.js]

browser/devtools/netmonitor/test/browser_net_security-state.js

@@ -13,6 +13,7 @@ add_task(function* () {
     "test1.example.com": "security-state-insecure",
     "example.com": "security-state-secure",
     "nocert.example.com": "security-state-broken",
+    "rc4.example.com": "security-state-weak",
   };
 
   let [tab, debuggee, monitor] = yield initNetMonitor(CUSTOM_GET_URL);
@@ -70,7 +71,12 @@ add_task(function* () {
     debuggee.performRequests(1, "https://example.com" + CORS_SJS_PATH);
     yield done;
 
-    is(RequestsMenu.itemCount, 3, "Three events logged.");
+    done = waitForNetworkEvents(monitor, 1);
+    info("Requesting a resource over HTTPS with RC4.");
+    debuggee.performRequests(1, "https://rc4.example.com" + CORS_SJS_PATH);
+    yield done;
+
+    is(RequestsMenu.itemCount, 4, "Four events logged.");
   }
 
   /**

browser/devtools/netmonitor/test/browser_net_security-warnings.js

@@ -0,0 +1,81 @@
+/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+"use strict";
+
+/**
+ * Test that warning indicators are shown when appropriate.
+ */
+
+const TEST_CASES = [
+  {
+    desc: "no warnings",
+    uri: "https://example.com" + CORS_SJS_PATH,
+    warnCipher: false,
+    warnSSLv3: false,
+  },
+  {
+    desc: "sslv3 warning",
+    uri: "https://ssl3.example.com" + CORS_SJS_PATH,
+    warnCipher: false,
+    warnSSLv3: true,
+  },
+  {
+    desc: "cipher warning",
+    uri: "https://rc4.example.com" + CORS_SJS_PATH,
+    warnCipher: true,
+    warnSSLv3: false,
+  },
+  {
+    desc: "cipher and sslv3 warning",
+    uri: "https://ssl3rc4.example.com" + CORS_SJS_PATH,
+    warnCipher: true,
+    warnSSLv3: true,
+  },
+];
+
+add_task(function* () {
+  let [tab, debuggee, monitor] = yield initNetMonitor(CUSTOM_GET_URL);
+  let { $, EVENTS, NetMonitorView } = monitor.panelWin;
+  let { RequestsMenu, NetworkDetails } = NetMonitorView;
+  RequestsMenu.lazyUpdate = false;
+
+  info("Enabling SSLv3 for the test.");
+  yield new promise(resolve => {
+    SpecialPowers.pushPrefEnv({"set": [["security.tls.version.min", 0]]}, resolve);
+  });
+
+  let cipher = $("#security-warning-cipher");
+  let sslv3 = $("#security-warning-sslv3");
+
+  for (let test of TEST_CASES) {
+    info("Testing site with " + test.desc);
+
+    info("Performing request to " + test.uri);
+    debuggee.performRequests(1, test.uri);
+    yield waitForNetworkEvents(monitor, 1);
+
+    info("Selecting the request.");
+    RequestsMenu.selectedIndex = 0;
+
+    info("Waiting for details pane to be updated.");
+    yield monitor.panelWin.once(EVENTS.TAB_UPDATED);
+
+    if (NetworkDetails.widget.selectedIndex !== 5) {
+      info("Selecting security tab.");
+      NetworkDetails.widget.selectedIndex = 5;
+
+      info("Waiting for details pane to be updated.");
+      yield monitor.panelWin.once(EVENTS.TAB_UPDATED);
+    }
+
+    is(cipher.hidden, !test.warnCipher, "Cipher suite warning is hidden.");
+    is(sslv3.hidden, !test.warnSSLv3, "SSLv3 warning is hidden.");
+
+    RequestsMenu.clear();
+
+  }
+
+  yield teardown(monitor);
+
+});

browser/locales/en-US/chrome/browser/devtools/netmonitor.dtd

@@ -202,6 +202,14 @@
   -  in a "receive" state. -->
 <!ENTITY netmonitorUI.timings.receive     "Receiving:">
 
+<!-- LOCALIZATION NOTE (netmonitorUI.security.warning.protocol): A tooltip
+  -  for warning icon that indicates a connection uses insecure protocol. -->
+<!ENTITY netmonitorUI.security.warning.sslv3      "The protocol SSL 3.0 is deprecated and insecure.">
+
+<!-- LOCALIZATION NOTE (netmonitorUI.security.warning.cipher): A tooltip
+  -  for warning icon that indicates a connection uses insecure cipher suite. -->
+<!ENTITY netmonitorUI.security.warning.cipher     "The cipher used for encryption is deprecated and insecure.">
+
 <!-- LOCALIZATION NOTE (netmonitorUI.security.error): This is the label displayed
   -  in the security tab if a security error prevented the connection. -->
 <!ENTITY netmonitorUI.security.error      "An error occured:">

browser/locales/en-US/chrome/browser/devtools/netmonitor.properties

@@ -44,6 +44,10 @@ netmonitor.security.state.insecure=The connection used to fetch this resource wa
 # issues.
 netmonitor.security.state.broken=A security error prevented the resource from being loaded.
 
+# LOCALIZATION NOTE (netmonitor.security.state.weak)
+# This string is used as an tooltip for request that had minor security issues
+netmonitor.security.state.weak=This resource was transferred over a connection that used weak encryption.
+
 # LOCALIZATION NOTE (netmonitor.security.enabled):
 # This string is used to indicate that a specific security feature is used by
 # a connection in the security details tab.

browser/themes/shared/devtools/netmonitor.inc.css

@@ -178,6 +178,11 @@
   list-style-image: url(chrome://browser/skin/identity-icons-https.png);
 }
 
+.security-state-weak {
+  cursor: pointer;
+  list-style-image: url(chrome://browser/skin/identity-icons-https-mixed-display.png);
+}
+
 .security-state-broken {
   cursor: pointer;
   list-style-image: url(chrome://browser/skin/identity-icons-https-mixed-active.png);
@@ -578,6 +583,21 @@ label.requests-menu-status-code {
   white-space: pre-wrap;
 }
 
+.security-warning-icon {
+  background-image: url(alerticon-warning.png);
+  background-size: 13px 12px;
+  -moz-margin-start: 5px;
+  vertical-align: top;
+  width: 13px;
+  height: 12px;
+}
+
+@media (min-resolution: 2dppx) {
+  .security-warning-icon {
+    background-image: url(alerticon-warning@2x.png);
+  }
+}
+
 /* Custom request form */
 
 #custom-pane {