[perf] Add hash and human date to commit-detail-sk.

Bug:skia:10844
Change-Id: I939975047d2d8122bec5530478d5c16417b03d72
Reviewed-on: https://skia-review.googlesource.com/c/buildbot/+/324631
Reviewed-by: Joe Gregorio <jcgregorio@google.com>
Commit-Queue: Joe Gregorio <jcgregorio@google.com>
diff --git a/perf/modules/cluster-summary2-sk/cluster-summary2-sk-demo.ts b/perf/modules/cluster-summary2-sk/cluster-summary2-sk-demo.ts
index c1805db..4d536b3 100644
--- a/perf/modules/cluster-summary2-sk/cluster-summary2-sk-demo.ts
+++ b/perf/modules/cluster-summary2-sk/cluster-summary2-sk-demo.ts
@@ -2,6 +2,8 @@
 import { ClusterSummary2Sk } from './cluster-summary2-sk';
 import { FullSummary, ClusterSummary, TriageStatus } from '../json';
 
+Date.now = () => Date.parse('2020-03-22T00:00:00.000Z');
+
 // Handle the sk namespace attached to window.
 declare global {
   interface Window {
@@ -20,7 +22,7 @@
       hash: '566ac1e41bd7953a7179da9832bc883e1c758fac',
       offset: 24748,
       author: 'msarett@google.com',
-      message: '313c463 - Safely handle unsupported color xforms in SkCodec',
+      message: 'Safely handle unsupported color xforms in SkCodec',
       url:
           'https://skia.googlesource.com/skia/+show/313c4635e3f1005e6807f5b0ad52805f30902d66',
       ts: 1476984695,
diff --git a/perf/modules/commit-detail-panel-sk/commit-detail-panel-sk-demo.ts b/perf/modules/commit-detail-panel-sk/commit-detail-panel-sk-demo.ts
index 61977c5..bd4a6c1 100644
--- a/perf/modules/commit-detail-panel-sk/commit-detail-panel-sk-demo.ts
+++ b/perf/modules/commit-detail-panel-sk/commit-detail-panel-sk-demo.ts
@@ -1,6 +1,8 @@
 import './index';
 import { CommitDetailPanelSk } from './commit-detail-panel-sk';
 
+Date.now = () => Date.parse('2020-03-22T00:00:00.000Z');
+
 const commitinfo = [
   {
     ts: 1439649751,
diff --git a/perf/modules/commit-detail-sk/commit-detail-sk-demo.ts b/perf/modules/commit-detail-sk/commit-detail-sk-demo.ts
index b00a058..ec48f21 100644
--- a/perf/modules/commit-detail-sk/commit-detail-sk-demo.ts
+++ b/perf/modules/commit-detail-sk/commit-detail-sk-demo.ts
@@ -1,13 +1,13 @@
 import './index';
 import { CommitDetailSk } from './commit-detail-sk';
 
+Date.now = () => Date.parse('2020-03-22T00:00:00.000Z');
+
 document.querySelectorAll<CommitDetailSk>('commit-detail-sk').forEach((ele) => {
   ele.cid = {
     hash: 'e699a3a2373bc4c2a4bfa93c7af8602cb15f2d1d',
-    url:
-      'https://skia.googlesource.com/skia/+show/e699a3a2373bc4c2a4bfa93c7af8602cb15f2d1d',
-    message:
-      'e699a3a - 19h 59m - Roll third_party/externals/swiftshader 522d5121905',
+    url: 'https://skia.googlesource.com/skia/+show/e699a3a2373bc4c2a4bfa93c7af8602cb15f2d1d',
+    message: 'Roll third_party/externals/swiftshader 522d5121905',
     author: '',
     ts: 0,
     offset: 0,
diff --git a/perf/modules/commit-detail-sk/commit-detail-sk.ts b/perf/modules/commit-detail-sk/commit-detail-sk.ts
index 1f2c87e..febed53 100644
--- a/perf/modules/commit-detail-sk/commit-detail-sk.ts
+++ b/perf/modules/commit-detail-sk/commit-detail-sk.ts
@@ -9,6 +9,7 @@
 import { html } from 'lit-html';
 import { $$ } from 'common-sk/modules/dom';
 import { upgradeProperty } from 'elements-sk/upgradeProperty';
+import { diffDate } from 'common-sk/modules/human';
 import { ElementSk } from '../../../infra-sk/modules/ElementSk';
 import { Commit } from '../json';
 
@@ -29,7 +30,7 @@
 
   private static template = (ele: CommitDetailSk) => html`
     <div @click=${() => ele._click()} class="linkish">
-      <pre>${ele.cid.message}</pre>
+      <pre>${ele.cid.hash.slice(0, 8)} - ${diffDate(ele.cid.ts * 1000)} - ${ele.cid.message}</pre>
     </div>
     <div class="tip hidden">
       <a href="/g/e/${ele.cid.hash}">Explore</a>