Keep track of per-origin security details in the Security panel.

Source/devtools/front_end/security/SecurityPanel.js

 // Copyright 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @constructor
  * @extends {WebInspector.PanelWithSidebar}
  * @implements {WebInspector.TargetManager.Observer}
  */
 WebInspector.SecurityPanel = function() {
     WebInspector.PanelWithSidebar.call(this, "security");
     this.registerRequiredCSS("security/securityPanel.css");
     this.registerRequiredCSS("security/lockIcon.css");
 
     var sidebarTree = new TreeOutlineInShadow();
     sidebarTree.element.classList.add("sidebar-tree");
     this.panelSidebarElement().appendChild(sidebarTree.element);
     sidebarTree.registerRequiredCSS("security/lockIcon.css");
     this.setDefaultFocusedElement(sidebarTree.element);
 
     this._sidebarMainViewElement = new WebInspector.SecurityMainViewSidebarTreeElement(this);
     sidebarTree.appendChild(this._sidebarMainViewElement);
 
     this._mainView = new WebInspector.SecurityMainView();
     this.showMainView();
 
+    this._origins = {};

[dgozman, 2015/08/19 01:51:35]

Use Map.

[lgarron, 2015/08/19 02:24:24]

Oooh, shiny. My first time using Map in Javascript. :-D

(Done.)

+    WebInspector.targetManager.addEventListener(WebInspector.TargetManager.Events.WillReloadPage, this._onWillReloadPage, this);
+    WebInspector.targetManager.addEventListener(WebInspector.TargetManager.Events.Load, this._onLoadEventFired, this);
+
     WebInspector.targetManager.observeTargets(this);
 }
 
 WebInspector.SecurityPanel.prototype = {
 
     /**
      * @param {!SecurityAgent.SecurityState} newSecurityState
      * @param {!Array<!SecurityAgent.SecurityStateExplanation>} explanations
      */
     _updateSecurityState: function(newSecurityState, explanations)
@@ skipping 28 matching lines @@
         if (this._visibleView)
             this._visibleView.detach();
 
         this._visibleView = view;
 
         if (view)
             this.splitWidget().setMainWidget(view);
     },
 
     /**
+     * @param {!WebInspector.Event} event
+     */
+    _onResponseReceivedSecurityDetails: function(event)
+    {
+        var data = event.data;
+        var origin = data.origin;
+        var securityState = data.securityState;
+
+        if (origin in this._origins) {
+            this._origins[origin].securityState = this._securityStateMin(this._origins[origin].securityState, securityState);
+        } else {
+            // TODO(lgarron): Store a list of deduplicated different security details we have seen.
+            this._origins[origin] = {
+                securityState: securityState,
+                securityDetails: data.securityDetails
+            }
+        }
+    },
+
+    /**
+     * @param {!SecurityAgent.SecurityState} stateA
+     * @param {!SecurityAgent.SecurityState} stateB
+     * @return {!SecurityAgent.SecurityState}
+     */
+    _securityStateMin: function(stateA, stateB)
+    {
+        var ordering = ["unknown", "insecure", "http", "warning", "secure"];
+        return (ordering.indexOf(stateA) < ordering.indexOf(stateB)) ? stateA : stateB;
+    },
+
+    /**
      * @override
      * @param {!WebInspector.Target} target
      */
     targetAdded: function(target)
     {
         if (!this._target) {
             this._target = target;
             this._securityModel = WebInspector.SecurityModel.fromTarget(target);
             this._securityModel.addEventListener(WebInspector.SecurityModel.EventTypes.SecurityStateChanged, this._onSecurityStateChanged, this);
             this._updateSecurityState(this._securityModel.securityState(), []);
+
+            this._origins = {};
+            this._networkManager = target.networkManager;
+            this._networkManager.addEventListener(WebInspector.NetworkManager.EventTypes.ResponseReceivedSecurityDetails, this._onResponseReceivedSecurityDetails, this);
         }
     },
 
     /**
      * @override
      * @param {!WebInspector.Target} target
      */
     targetRemoved: function(target)
     {
         if (target === this._target) {
             this._securityModel.removeEventListener(WebInspector.SecurityModel.EventTypes.SecurityStateChanged, this._onSecurityStateChanged, this);
             delete this._securityModel;
+            this._networkManager.removeEventListener(WebInspector.NetworkManager.EventTypes.ResponseReceivedSecurityDetails, this._onResponseReceivedSecurityDetails, this);
+            delete this._networkManager;
             delete this._target;
+            this._origins = {};
             this._updateSecurityState(SecurityAgent.SecurityState.Unknown, []);
         }
     },
 
+    _onWillReloadPage: function() {

[dgozman, 2015/08/19 01:51:35]

{ on new line everywhere.

[lgarron, 2015/08/19 02:24:24]

I try to avoid it, but I still do this out of habit (from my personal Javascript
style). Is there a way for me to force this check for my CLs? The presubmit
check just seems to ignore it.

(Fixed this one, though.)

+        this._origins = {};
+    },
+
+    _onLoadEventFired: function() {

[dgozman, 2015/08/19 01:51:35]

You can call this |clear| and merge with previous function.

[lgarron, 2015/08/19 02:24:24]

Done. Always happy to keep things DRY. :-)

+        this._origins = {};
+    },
+
     __proto__: WebInspector.PanelWithSidebar.prototype
 }
 
 /**
  * @return {!WebInspector.SecurityPanel}
  */
 WebInspector.SecurityPanel._instance = function()
 {
     if (!WebInspector.SecurityPanel._instanceObject)
         WebInspector.SecurityPanel._instanceObject = new WebInspector.SecurityPanel();
@@ skipping 112 matching lines @@
         this._lockIcon.classList.add("lock-icon-" + this._securityState);
         this._securityStateText.textContent = WebInspector.UIString("Page security state: %s", this._securityState);
 
         this._securityExplanations.removeChildren();
         for (var explanation of explanations)
             this._addExplanation(explanation);
     },
 
     __proto__: WebInspector.VBox.prototype
 }