@kokimoki/app 1.4.2 → 1.4.4

package/dist/kokimoki-client.d.ts

@@ -34,6 +34,7 @@ export declare class KokimokiClient<ClientContextT = any> extends KokimokiClient
     private _autoReconnect;
     private _reconnectTimeout;
     private _pingInterval;
+    private _devMode;
     private _clientTokenKey;
     constructor(host: string, appId: string, code?: string);
     get id(): string;

package/dist/kokimoki-client.js

@@ -34,6 +34,7 @@ export class KokimokiClient extends EventEmitter {
     _autoReconnect = true;
     _reconnectTimeout = 0;
     _pingInterval;
+    _devMode = false;
     _clientTokenKey = "KM_TOKEN";
     constructor(host, appId, code = "") {
         super();
@@ -53,12 +54,10 @@ export class KokimokiClient extends EventEmitter {
                 this.ws.send(pingBuffer);
             }
         }, 5000);
-        // Detect devtools
-        console.log(`[KM]`, window.top, frameElement?.id);
-        if (window.top && frameElement) {
-            this._clientTokenKey = `KM_TOKEN/${frameElement.id}`;
+        // Listen for devtools messages
+        if (window.top && window.self !== window.top) {
             window.addEventListener("message", (e) => {
-                console.log(`[KM ${frameElement?.id}] ${e.data}`);
+                console.log(`[KM TOOLS] ${e.data}`);
                 if (e.data === "km:clearStorage") {
                     localStorage.removeItem(this._clientTokenKey);
                     window.location.reload();
@@ -118,6 +117,27 @@ export class KokimokiClient extends EventEmitter {
         if (this._connectPromise) {
             return await this._connectPromise;
         }
+        // Detect devtools
+        if (window.top && window.self !== window.top) {
+            await new Promise((resolve) => {
+                /* // Wait up to 500ms for parent to respond
+                const timeout = setTimeout(() => {
+                  window.removeEventListener("message", onMessage);
+                  resolve();
+                }, 500); */
+                // Listen for parent response
+                const onMessage = (e) => {
+                    // clearTimeout(timeout);
+                    window.removeEventListener("message", onMessage);
+                    if (e.data.clientKey) {
+                        this._clientTokenKey = `KM_TOKEN/${e.data.clientKey}`;
+                    }
+                    resolve();
+                };
+                window.addEventListener("message", onMessage);
+                window.top.postMessage({ appId: this.appId }, "*");
+            });
+        }
         // Set up the WebSocket connection
         this._ws = new WebSocket(`${this._wsUrl}/apps/${this.appId}?clientVersion=${KOKIMOKI_APP_VERSION}`);
         this._ws.binaryType = "arraybuffer";

package/dist/kokimoki.min.d.ts

@@ -343,6 +343,7 @@ declare class KokimokiClient<ClientContextT = any> extends KokimokiClient_base {
     private _autoReconnect;
     private _reconnectTimeout;
     private _pingInterval;
+    private _devMode;
     private _clientTokenKey;
     constructor(host: string, appId: string, code?: string);
     get id(): string;

package/dist/kokimoki.min.js

@@ -634,7 +634,7 @@ function eventTargetAgnosticAddListener(emitter, name, listener, flags) {
 var eventsExports = events.exports;
 var EventEmitter$1 = /*@__PURE__*/getDefaultExportFromCjs(eventsExports);
 
-const KOKIMOKI_APP_VERSION = "1.4.2";
+const KOKIMOKI_APP_VERSION = "1.4.4";
 
 /**
  * Utility module to work with key-value stores.
@@ -12247,6 +12247,7 @@ class KokimokiClient extends EventEmitter$1 {
     _autoReconnect = true;
     _reconnectTimeout = 0;
     _pingInterval;
+    _devMode = false;
     _clientTokenKey = "KM_TOKEN";
     constructor(host, appId, code = "") {
         super();
@@ -12266,12 +12267,10 @@ class KokimokiClient extends EventEmitter$1 {
                 this.ws.send(pingBuffer);
             }
         }, 5000);
-        // Detect devtools
-        console.log(`[KM]`, window.top, frameElement?.id);
-        if (window.top && frameElement) {
-            this._clientTokenKey = `KM_TOKEN/${frameElement.id}`;
+        // Listen for devtools messages
+        if (window.top && window.self !== window.top) {
             window.addEventListener("message", (e) => {
-                console.log(`[KM ${frameElement?.id}] ${e.data}`);
+                console.log(`[KM TOOLS] ${e.data}`);
                 if (e.data === "km:clearStorage") {
                     localStorage.removeItem(this._clientTokenKey);
                     window.location.reload();
@@ -12331,6 +12330,27 @@ class KokimokiClient extends EventEmitter$1 {
         if (this._connectPromise) {
             return await this._connectPromise;
         }
+        // Detect devtools
+        if (window.top && window.self !== window.top) {
+            await new Promise((resolve) => {
+                /* // Wait up to 500ms for parent to respond
+                const timeout = setTimeout(() => {
+                  window.removeEventListener("message", onMessage);
+                  resolve();
+                }, 500); */
+                // Listen for parent response
+                const onMessage = (e) => {
+                    // clearTimeout(timeout);
+                    window.removeEventListener("message", onMessage);
+                    if (e.data.clientKey) {
+                        this._clientTokenKey = `KM_TOKEN/${e.data.clientKey}`;
+                    }
+                    resolve();
+                };
+                window.addEventListener("message", onMessage);
+                window.top.postMessage({ appId: this.appId }, "*");
+            });
+        }
         // Set up the WebSocket connection
         this._ws = new WebSocket(`${this._wsUrl}/apps/${this.appId}?clientVersion=${KOKIMOKI_APP_VERSION}`);
         this._ws.binaryType = "arraybuffer";