Surface SCT (Signed Certificate Timestamp) counts in the Security panel.

third_party/WebKit/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()
@@ skipping 160 matching lines @@
             }
         } else {
             // TODO(lgarron): Store a (deduplicated) list of different security details we have seen. https://crbug.com/503170
             var originState = {};
             originState.securityState = securityState;
 
             var securityDetails = request.securityDetails();
             if (securityDetails) {
                 originState.securityDetails = securityDetails;
                 originState.certificateDetailsPromise = request.target().networkManager.certificateDetailsPromise(securityDetails.certificateId);
+
+                if (securityDetails.certificateValidationDetails)
+                    originState.certificateTransparencySummaryPromise = request.target().networkManager.certificateTransparencySummaryPromise(securityDetails.certificateValidationDetails);
             }
 
             this._origins.set(origin, originState);
 
             this._sidebarTree.addOrigin(origin, securityState);
 
             // Don't construct the origin view yet (let it happen lazily).
         }
     },
 
@@ skipping 600 matching lines @@
             var validFromString = new Date(1000 * certificateDetails.validFrom).toUTCString();
             var validUntilString = new Date(1000 * certificateDetails.validTo).toUTCString();
 
             var table = new WebInspector.SecurityDetailsTable();
             certificateSection.appendChild(table.element());
             table.addRow("Subject", certificateDetails.subject.name);
             table.addRow("SAN", sanDiv);
             table.addRow("Valid From", validFromString);
             table.addRow("Valid Until", validUntilString);
             table.addRow("Issuer", certificateDetails.issuer);
+            var sctValueDiv = table.addRow("SCTs", WebInspector.UIString("-"));
             table.addRow("", WebInspector.SecurityPanel.createCertificateViewerButton(WebInspector.UIString("Open full certificate details"), originState.securityDetails.certificateId));
-            // TODO(lgarron): Make SCT status available in certificate details and show it here.
+
+            var sctValue = WebInspector.UIString("-");
+            var validationDetails = originState.securityDetails.certificateValidationDetails;
+            if (validationDetails) {
+
+                var sctTypeList = [];
+
+                if (validationDetails.numValidScts)
+                    sctTypeList.push(WebInspector.UIString("%d valid SCT%s", validationDetails.numValidScts, (validationDetails.numValidScts > 1) ? "s" : ""));
+                if (validationDetails.numInvalidScts)
+                    sctTypeList.push(WebInspector.UIString("%d invalid SCT%s", validationDetails.numInvalidScts, (validationDetails.numInvalidScts > 1) ? "s" : ""));
+                if (validationDetails.numUnknownScts)
+                    sctTypeList.push(WebInspector.UIString("%d SCT%s from unknown logs", validationDetails.numUnknownScts, (validationDetails.numUnknownScts > 1) ? "s" : ""));
+
+                var sctTypeCounts = (sctTypeList.length == 0) ? WebInspector.UIString("0 SCTs") : sctTypeList.join(", ");
+
+                if (originState.certificateTransparencySummaryPromise) {
+                    /**
+                     * @param {function(string)} summary
+                     */
+                    function resolve(summary)
+                    {
+                        sctValueDiv.textContent = WebInspector.UIString("%s (%s)", summary, sctTypeCounts);
+                    }
+                    function reject()
+                    {
+                        sctValueDiv.textContent = sctTypeCounts;
+                    }
+                    originState.certificateTransparencySummaryPromise.then(resolve, reject);
+
+                } else {
+                    // Fall back and just display the counts.
+                    sctValueDiv.textContent = sctTypeCounts;
+                }
+            }
+
         }
 
         function displayCertificateDetailsUnavailable ()
         {
             certificateSection.createChild("div").textContent = WebInspector.UIString("Certificate details unavailable.");
         }
 
         originState.certificateDetailsPromise.then(displayCertificateDetails.bind(this), displayCertificateDetailsUnavailable);
 
         var noteSection = this.element.createChild("div", "origin-view-section");
@@ skipping 84 matching lines @@
      * @return: {!Element}
      */
     element: function()
     {
         return this._element;
     },
 
     /**
      * @param {string} key
      * @param {string|!Node} value
+     * @return: {!Element} -- the div containing the value.
      */
     addRow: function(key, value)

[lgarron, 2016/01/22 22:51:28]

Although I added a return value, I decided to keep the name addRow() to avoid
unnecessary line changes above.

pfeldman@: If you're happy with this approach but would prefer a different name
like `addEntry()`, I'm happy to change it. (Alternatively, I can just return the
`div` and rely on the caller to add its contents.)

     {
         var row = this._element.createChild("div", "details-table-row");
         row.createChild("div").textContent = key;
 
         var valueDiv = row.createChild("div");
         if (typeof value === "string") {
             valueDiv.textContent = value;
         } else {
             valueDiv.appendChild(value);
         }
+        return valueDiv;
     }
 }