Fix communication and title

.gitignore

@@ -1,2 +1,3 @@
 /node_modules
 /public/*.js
+/public/test.*

src/trace.ts

@@ -1,24 +1,5 @@
 const REPORT_WINDOW_URL = "https://ababik.github.io/trace/viewer.html"
 
-type TraceOptions = {
-    skip?: number
-    take?: number
-}
-
-type ReportRecord = {
-    label: string
-    child: number
-    count: number
-    total: number
-    percent: number
-    first: number
-    max: number
-    min: number
-    mean: number
-    stddev: number
-    inner: ReportRecord[]
-}
-
 class Trace {
     private root: Context = null
     private current: Context = null
@@ -64,14 +45,19 @@ class Trace {
             }
         }
         walk(this.root, records)
-        console.log(records)
-        this.showReportWindow(records)
+        let report: ReportSummary = {
+            timestamp: Date.now(),
+            grandTotal: this.grandTotal,
+            records: records
+        }
+        console.log("trace", report)
+        this.showReportWindow(report)
     }
 
-    private showReportWindow(records: ReportRecord[]) {
+    private showReportWindow(report: ReportSummary) {
         let reportWindow = window.open(REPORT_WINDOW_URL, "_blank")
         window.addEventListener("message", () => {
-            reportWindow.postMessage(records)
+            reportWindow.postMessage(report, "*")
         })
     }
 }
@@ -133,4 +119,4 @@ class Context {
     }
 }
 
-window['trace'] = new Trace()
+window["trace"] = new Trace()

src/types.ts

@@ -0,0 +1,24 @@
+type TraceOptions = {
+    skip?: number
+    take?: number
+}
+
+type ReportSummary = {
+    timestamp: number
+    grandTotal: number
+    records: ReportRecord[]
+}
+
+type ReportRecord = {
+    label: string
+    child: number
+    count: number
+    total: number
+    percent: number
+    first: number
+    max: number
+    min: number
+    mean: number
+    stddev: number
+    inner: ReportRecord[]
+}

src/viewer.ts

@@ -1,4 +1,6 @@
-function generate(records: ReportRecord[]) {
+function generate(report: ReportSummary) {
+    let { records, timestamp, grandTotal } = report
+    setTitle(timestamp, grandTotal)
     let table = document.querySelector(".table-body")
     function appendCell(row: HTMLElement, value: string) {
         let cell = document.createElement("div")
@@ -77,8 +79,16 @@ function toggle(row: HTMLElement, expand = false) {
     }
 }
 
-window.addEventListener("message", (event: MessageEvent<ReportRecord[]>) => {
+function setTitle(timestamp: number, grandTotal: number) {
+    let date = new Date(timestamp)
+    let hours = date.getHours().toString().padStart(2, "0")
+    let minutes = date.getMinutes().toString().padStart(2, "0")
+    let seconds = date.getSeconds().toString().padStart(2, "0")
+    window.document.title = `${hours}:${minutes}:${seconds} - ${grandTotal}ms`;
+}
+
+window.addEventListener("message", (event: MessageEvent<ReportSummary>) => {
     generate(event.data)
 })
 
-window.opener.postMessage("ready")
+window.opener.postMessage("ready", "*")