Add event details on close (#106)

Author: balloob

README.md

@@ -52,6 +52,13 @@ It is possible to customize the button and the message. You do this by putting y
 </improv-wifi-serial-launch-button>
 ```
 
+### Events
+
+When the dialog is closed, a `closed` event will be fired on both `<improv-wifi-serial-launch-button>` and `<improv-wifi-serial-provision-dialog>`. This event will have a `detail` property with the following properties:
+
+ - `improv`: Boolean indicating if we connected to a device running Improv.
+ - `provisioned`: Boolean indicating if the device is connected to Wi-Fi.
+
 ## Browser Support
 
 This SDK requires a browser with support for WebSerial. Currently this is supported by Google Chrome, Microsoft Edge and other browsers based on the Blink engine.

src/provision.ts

@@ -1,4 +1,5 @@
 import { SerialLaunchButton } from "./serial-launch-button.js";
+import { fireEvent } from "./util/fire-event.js";
 
 export const startProvisioning = async (button: SerialLaunchButton) => {
   import("./serial-provision-dialog.js");
@@ -23,8 +24,9 @@ export const startProvisioning = async (button: SerialLaunchButton) => {
   el.port = port;
   el.addEventListener(
     "closed",
-    () => {
-      port!.close();
+    async (ev: any) => {
+      await port!.close();
+      fireEvent(button, "closed" as any, ev.detail);
     },
     { once: true }
   );

src/serial-provision-dialog.ts

@@ -437,9 +437,18 @@ class SerialProvisionDialog extends LitElement {
   }
 
   private async _handleClose() {
-    await this._client?.close();
-    this._client = undefined;
-    fireEvent(this, "closed" as any);
+    const eventData = {
+      improv: false,
+      provisioned: false,
+    };
+    if (this._client) {
+      eventData.improv = true;
+      eventData.provisioned =
+        this._client.state === ImprovSerialCurrentState.PROVISIONED;
+      await this._client?.close();
+      this._client = undefined;
+    }
+    fireEvent(this, "closed" as any, eventData);
     this.parentNode!.removeChild(this);
   }