gold: ByBlame WIP

golden/res/imp/testsummarydetails.html

 <!-- The <test-summary-details-sk> custom element declaration.
 
   Displays the details about all the untriaged digests in one test summary.
 
   Attributes:
     test - The name of the test.
     digest - The digest we are interested in.
     limit - The maximum number of digests to display.
     triage - A boolean, if true, then display the triage controls.
     data-diff - A read-only attribute that is the size of the difference between
         this digest and the closest positive digest. Will be set before the
         'loaded' event. May be set to Infinity if there are no positive digests.
     data-closest - A read-only attribute that is the digest of the closest image.
     data-diffdigests - A read-only attribute of the digest and the closest positive
       image digest, separated by a dash, ala "abbab-12131>". The digests are in
       sorted order, so they can be used in /img/diffs/ URLs.
     images - A boolean, if true the images are displayed.
     failed - A boolean, true if the request to the server for details failed.
+    mailbox - An sk.Mailbox address to subscribe for the data to populate
+      this test-summary-details-sk. If this isn't set then the element will
+      request that data from the server. The data in the mailbox must be a
+      serialized PolyDetailsGUI, which is also the form of the data that's
+      returned from the server.
 
   Events:
     triage - A triage event is generated when the triage button is pressed. The e.detail
        of the event looks like:
 
        {
          digest: ["ba636123..."],
          status: "positive",
          test: "blurs"
        }
@@ skipping 182 matching lines @@
           value: false,
           reflect: true,
         },
         images: {
           value: true,
           reflect: true,
         },
         failed: {
           value: false,
           reflect: true,
+        },
+        mailbox: {
+          value: "",
+          reflect: true,
         }
       },
 
       //, Force the template expansion to be in the Light DOM.
       parseDeclaration: function(elementElement) {
         var template = this.fetchTemplate(elementElement);
         if (template != null) {
           this.lightFromTemplate(template);
         };
       },
@@ skipping 78 matching lines @@
       reloadData: function() {
         // Don't bother reloading if nothing's changed.
         if (this.test == this.reloadParams.test && this.digest == this.reloadParams.digest && this.limit == this.reloadParams.limit) {
           return
         }
         this.reloadParams.test = this.test;
         this.reloadParams.digest = this.digest;
         this.reloadParams.limit = this.limit;
 
         var that = this;
-        var q = '?test=' + this.test + '&top=' + this.digest+ '&left=' + this.digest + '&graphs=true&closest=' + this.triage;
-        sk.get('_/details'+q).then(JSON.parse).then(function(json) {
-          if (that.limit && that.limit < json.traces.length) {
-            json.traces = json.traces.slice(0, that.limit);
-            that.isTruncated = true;
+        if (this.mailbox) {
+          sk.Mailbox.subscribe(this.mailbox, this.dataAvailable.bind(this))
+        } else {
+          var q = '?test=' + this.test + '&top=' + this.digest+ '&left=' + this.digest + '&graphs=true&closest=' + this.triage;
+          sk.get('_/details'+q).then(JSON.parse).then(this.dataAvailable.bind(this)).catch(function() {
+            that.failed = true;
+            that.dispatchEvent(new CustomEvent('details-loaded', {detail: that, bubbles: true}));
+          });
+        }
+      },
+
+      dataAvailable: function(json) {
+        if (this.limit && this.limit < json.traces.length) {
+          json.traces = json.traces.slice(0, this.limit);
+          this.isTruncated = true;
+        }
+        if (this.triage) {
+          json.closest = json.posClosest.diff < json.negClosest.diff ? json.posClosest : json.negClosest;
+          this.negIsClosest = json.negClosest.diff < json.posClosest.diff;
+        }
+        this.details = json;
+        this.$.dots.setValue(this.details);
+        this.$.dots.setCommits(this.details.commits);
+        this.$.blame.value = this.details.blame;
+        this.$.blame.commits = this.details.commits;
+        this.$.dotlegend.digests = this.details.otherDigests;
+
+        if (this.triage) {
+          if (json.closest.digest != "") {
+            this.dataset.diff = json.closest.diff;
+            this.dataset.closest = json.closest.digest;
+            if (json.closest.digest < this.digest) {
+              this.diffDigests = json.closest.digest + "-" + this.digest;
+            } else {
+              this.diffDigests = this.digest + "-" + json.closest.digest;
+            }
+            this.dataset.diffdigests = this.diffDigests;
+          } else {
+            this.dataset.diff = Infinity;
           }
-          if (that.triage) {
-            json.closest = json.posClosest.diff < json.negClosest.diff ? json.posClosest : json.negClosest;
-            that.negIsClosest = json.negClosest.diff < json.posClosest.diff;
-          }
-          that.details = json;
-          that.$.dots.setValue(that.details);
-          that.$.dots.setCommits(that.details.commits);
-          that.$.blame.value = that.details.blame;
-          that.$.blame.commits = that.details.commits;
-          that.$.dotlegend.digests = that.details.otherDigests;
-
-          if (that.triage) {
-            if (json.closest.digest != "") {
-              that.dataset.diff = json.closest.diff;
-              that.dataset.closest = json.closest.digest;
-              if (json.closest.digest < that.digest) {
-                that.diffDigests = json.closest.digest + "-" + that.digest;
-              } else {
-                that.diffDigests = that.digest + "-" + json.closest.digest;
-              }
-              that.dataset.diffdigests = that.diffDigests;
-            } else {
-              that.dataset.diff = Infinity;
-            }
-          }
-          that.dispatchEvent(new CustomEvent('details-loaded', {detail: that, bubbles: true}));
-        }).catch(function() {
-          that.failed = true;
-          that.dispatchEvent(new CustomEvent('details-loaded', {detail: that, bubbles: true}));
-        });
+        }
+        this.dispatchEvent(new CustomEvent('details-loaded', {detail: this, bubbles: true}));
       },
 
       testChanged: function() {
         this.reloadData();
       },
 
       digestChanged: function() {
         this.reloadData();
       },
 
@@ skipping 27 matching lines @@
         if (showImages) {
           return "/img/diffs/"+digest+".png"
         } else {
           return ""
         }
       },
 
     });
   </script>
 </polymer-element>