Add dev import buttons for debugging traces (#8860)

src/panels/config/automation/trace/ha-automation-trace.ts

@@ -86,12 +86,24 @@ export class HaAutomationTrace extends LitElement {
 
     const title = stateObj?.attributes.friendly_name || this._entityId;
 
+    let devButtons: TemplateResult | string = "";
+    if (__DEV__) {
+      devButtons = html`<div style="position: absolute; right: 0;">
+        <button @click=${this._importTrace}>
+          Import trace
+        </button>
+        <button @click=${this._loadLocalStorageTrace}>
+          Load stored trace
+        </button>
+      </div>`;
+    }
+
     const actionButtons = html`
       <mwc-icon-button label="Refresh" @click=${() => this._loadTraces()}>
         <ha-svg-icon .path=${mdiRefresh}></ha-svg-icon>
       </mwc-icon-button>
       <mwc-icon-button
-        .disabled=${!this._runId}
+        .disabled=${!this._trace}
         label="Download Trace"
         @click=${this._downloadTrace}
       >
@@ -100,6 +112,7 @@ export class HaAutomationTrace extends LitElement {
     `;
 
     return html`
+      ${devButtons}
       <hass-tabs-subpage
         .hass=${this.hass}
         .narrow=${this.narrow}
@@ -408,6 +421,27 @@ export class HaAutomationTrace extends LitElement {
     aEl.click();
   }
 
+  private _importTrace() {
+    const traceText = prompt("Enter downloaded trace");
+    if (!traceText) {
+      return;
+    }
+    localStorage.devTrace = traceText;
+    this._loadLocalTrace(traceText);
+  }
+
+  private _loadLocalStorageTrace() {
+    if (localStorage.devTrace) {
+      this._loadLocalTrace(localStorage.devTrace);
+    }
+  }
+
+  private _loadLocalTrace(traceText: string) {
+    const traceInfo = JSON.parse(traceText);
+    this._trace = traceInfo.trace;
+    this._logbookEntries = traceInfo.logbookEntries;
+  }
+
   private _showTab(ev) {
     this._view = (ev.target as any).view;
   }