Allow downloading logs (#165)

src/components/ewt-console.ts

@@ -11,6 +11,10 @@ export class EwtConsole extends HTMLElement {
   private _console?: ColoredConsole;
   private _cancelConnection?: () => Promise<void>;
 
+  public logs(): string {
+    return this._console?.logs() || "";
+  }
+
   public connectedCallback() {
     if (this._console) {
       return;

src/install-dialog.ts

@@ -19,6 +19,7 @@ import {
   PortNotReady,
 } from "improv-wifi-serial-sdk/dist/const";
 import { flash } from "./flash";
+import { textDownload } from "./util/file-download";
 import { fireEvent } from "./util/fire-event";
 import { sleep } from "./util/sleep";
 import { downloadManifest } from "./util/manifest";
@@ -587,6 +588,18 @@ class EwtInstallDialog extends LitElement {
           this._initialize();
         }}
       ></ewt-button>
+      <ewt-button
+        slot="secondaryAction"
+        label="Download Logs"
+        @click=${() => {
+          textDownload(
+            this.shadowRoot!.querySelector("ewt-console")!.logs(),
+            `esp-web-tools-logs.txt`
+          );
+
+          this.shadowRoot!.querySelector("ewt-console")!.reset();
+        }}
+      ></ewt-button>
       <ewt-button
         slot="secondaryAction"
         label="Reset Device"

src/util/console-color.ts

@@ -23,6 +23,10 @@ export class ColoredConsole {
 
   constructor(public targetElement: HTMLElement) {}
 
+  logs(): string {
+    return this.targetElement.innerText;
+  }
+
   addLine(line: string) {
     const re = /(?:\033|\\033)(?:\[(.*?)[@-~]|\].*?(?:\007|\033\\))/g;
     let i = 0;

src/util/file-download.ts

@@ -0,0 +1,17 @@
+export const fileDownload = (href: string, filename = ""): void => {
+  const a = document.createElement("a");
+  a.target = "_blank";
+  a.href = href;
+  a.download = filename;
+
+  document.body.appendChild(a);
+  a.dispatchEvent(new MouseEvent("click"));
+  document.body.removeChild(a);
+};
+
+export const textDownload = (text: string, filename = ""): void => {
+  const blob = new Blob([text], { type: "text/plain" });
+  const url = URL.createObjectURL(blob);
+  fileDownload(url, filename);
+  setTimeout(() => URL.revokeObjectURL(url), 0);
+};