Migrate to esptool.js 0.5.3 (#701)

Author: balloob

package-lock.json

@@ -46,7 +46,7 @@
     "@mdi/js": "^7.4.47",
     "@polymer/paper-tooltip": "^3.0.1",
     "@types/w3c-web-serial": "^1.0.7",
-    "esptool-js": "^0.4.1",
+    "esptool-js": "^0.5.3",
     "improv-wifi-serial-sdk": "^2.5.0",
     "lit": "^2.8.0",
     "tslib": "^2.8.1",

package.json

@@ -2,14 +2,14 @@ import { openNoPortPickedDialog } from "../no-port-picked";
 import { createESPLoader } from "../web-serial/create-esploader";
 import type { ESPHomeInstallWebDialog } from "./install-web-dialog";
 
-const preload = () => import("./install-web-dialog");
+export const preloadInstallWebDialog = () => import("./install-web-dialog");
 
 export const openInstallWebDialog = async (
   params: ESPHomeInstallWebDialog["params"],
   // Called if a port has been picked and the dialog will be opened.
   onDialogOpen?: () => void,
 ): Promise<void> => {
-  preload();
+  preloadInstallWebDialog();
 
   let port = params.port;
 

src/install-web/index.ts

@@ -18,7 +18,6 @@ import { openCompileDialog } from "../compile";
 import { openInstallWebDialog } from ".";
 import { chipFamilyToPlatform } from "../const";
 import { esphomeDialogStyles } from "../styles";
-import { resetSerialDevice } from "../web-serial/reset-serial-device";
 
 const OK_ICON = "🎉";
 const WARNING_ICON = "👀";
@@ -239,16 +238,21 @@ export class ESPHomeInstallWebDialog extends LitElement {
         return;
       }
 
-      await resetSerialDevice(esploader.transport);
+      await esploader.hardReset();
       this._state = "done";
     } finally {
-      if (!this.params.port) {
-        console.log("Closing port");
-        try {
-          await esploader.transport.disconnect();
-        } catch (err) {
-          // can happen if we already closed in disconnect
+      console.log("Closing port");
+      try {
+        await esploader.transport.disconnect();
+        // If a port was passed in, we open it again
+        if (this.params.port) {
+          console.log("Reopening port");
+          await this.params.port.open({
+            baudRate: esploader.transport.baudrate,
+          });
         }
+      } catch (err) {
+        // can happen if we already closed in disconnect
       }
     }
   }

src/install-web/install-web-dialog.ts

@@ -1,8 +1,11 @@
-import { LitElement, html } from "lit";
-import { customElement } from "lit/decorators.js";
+import { LitElement, PropertyValues, html } from "lit";
+import { customElement, state } from "lit/decorators.js";
 import "@material/mwc-dialog";
 import "@material/mwc-button";
-import { openInstallWebDialog } from "../../../src/install-web";
+import {
+  openInstallWebDialog,
+  preloadInstallWebDialog,
+} from "../../../src/install-web";
 import { FileToFlash } from "../../../src/web-serial/flash";
 import { esphomeDialogStyles } from "../../../src/styles";
 
@@ -18,6 +21,14 @@ const SUPPORTED_PLATFORMS = [
 class ESPHomeInstallAdoptableDialog extends LitElement {
   public port!: SerialPort;
 
+  @state()
+  private _installRequested = false;
+
+  protected firstUpdated(changedProperties: PropertyValues): void {
+    super.firstUpdated(changedProperties);
+    preloadInstallWebDialog();
+  }
+
   protected render() {
     return html`
       <mwc-dialog
@@ -40,18 +51,21 @@ class ESPHomeInstallAdoptableDialog extends LitElement {
           slot="primaryAction"
           label="Install"
           @click=${this._handleInstall}
+          .disabled=${this._installRequested}
         ></mwc-button>
         <mwc-button
           no-attention
           slot="secondaryAction"
           dialogAction="close"
           label="Close"
+          .disabled=${this._installRequested}
         ></mwc-button>
       </mwc-dialog>
     `;
   }
 
   private async _handleInstall() {
+    this._installRequested = true;
     openInstallWebDialog(
       {
         port: this.port,
@@ -96,7 +110,7 @@ class ESPHomeInstallAdoptableDialog extends LitElement {
 
           return [{ data, address: 0 }];
         },
-        onClose(success) {
+        async onClose(success) {
           if (!success) {
             return;
           }

web.esphome.io/src/install-adoptable/install-adoptable-dialog.ts

@@ -1,17 +1,28 @@
-import { LitElement, html, css } from "lit";
-import { customElement, query } from "lit/decorators.js";
+import { LitElement, html, css, PropertyValues } from "lit";
+import { customElement, query, state } from "lit/decorators.js";
 import "@material/mwc-dialog";
 import "@material/mwc-button";
 import "@material/mwc-icon";
-import { openInstallWebDialog } from "../../../src/install-web";
+import {
+  openInstallWebDialog,
+  preloadInstallWebDialog,
+} from "../../../src/install-web";
 import { esphomeDialogStyles } from "../../../src/styles";
 
 @customElement("esphome-install-upload-dialog")
 class ESPHomeInstallUploadDialog extends LitElement {
   public port!: SerialPort;
 
+  @state()
+  private _installRequested = false;
+
   @query("input") private _input!: HTMLInputElement;
 
+  protected firstUpdated(changedProperties: PropertyValues): void {
+    super.firstUpdated(changedProperties);
+    preloadInstallWebDialog();
+  }
+
   protected render() {
     return html`
       <mwc-dialog
@@ -22,7 +33,12 @@ class ESPHomeInstallUploadDialog extends LitElement {
       >
         <div>Select the project that you want to install on your device.</div>
         <div>
-          <input type="file" accept=".bin" @change=${this._fileChanged} />
+          <input
+            type="file"
+            accept=".bin"
+            @change=${this._fileChanged}
+            .disabled=${this._installRequested}
+          />
         </div>
         <div>To get the factory file of your ESPHome project:</div>
         <ol>
@@ -38,12 +54,14 @@ class ESPHomeInstallUploadDialog extends LitElement {
           slot="primaryAction"
           label="Install"
           @click=${this._handleInstall}
+          .disabled=${this._installRequested}
         ></mwc-button>
         <mwc-button
           no-attention
           slot="secondaryAction"
           dialogAction="close"
           label="Close"
+          .disabled=${this._installRequested}
         ></mwc-button>
       </mwc-dialog>
     `;
@@ -54,6 +72,7 @@ class ESPHomeInstallUploadDialog extends LitElement {
   }
 
   private async _handleInstall() {
+    this._installRequested = true;
     const input = this._input;
 
     if (!input.files || input.files.length === 0) {