@xstate/inspect - npm Package Compare versions

Comparing version 0.0.4 to 0.0.5

es/index.d.ts

@@ -6,3 +6,3 @@ import { Interpreter } from 'xstate';
     url: string;
-    iframe: MaybeLazy<HTMLIFrameElement | null>;
+    iframe: MaybeLazy<HTMLIFrameElement | null | false>;
 }
@@ -13,3 +13,5 @@ declare global {
             register: (service: Interpreter<any>) => void;
-            onRegister: (listener: ServiceListener) => void;
+            onRegister: (listener: ServiceListener) => {
+                unsubscribe: () => void;
+            };
             services: Set<Interpreter<any>>;
@@ -16,0 +18,0 @@ };

es/index.js

@@ -23,2 +23,7 @@ var __assign = (this && this.__assign) || function () {
         services.forEach(function (service) { return listener(service); });
+        return {
+            unsubscribe: function () {
+                serviceListeners.delete(listener);
+            }
+        };
     }
@@ -35,4 +40,5 @@ };
     var targetWindow;
+    var isDeferred = true;
     var postMessage = function (event) {
-        if (!targetWindow) {
+        if (isDeferred) {
             deferredEvents.push(event);
@@ -44,6 +50,23 @@ }
     };
-    if (!resolvedIframe) {
+    if (resolvedIframe === null) {
         console.warn('No suitable <iframe> found to embed the inspector. Please pass an <iframe> element to `inspect(iframe)` or create an <iframe data-xstate></iframe> element.');
         return;
     }
+    window.addEventListener('message', function (event) {
+        if (typeof event.data === 'object' &&
+            event.data !== null &&
+            'type' in event.data &&
+            event.data.type === 'xstate.inspecting') {
+            isDeferred = false;
+            // TODO: use a state machine...
+            setTimeout(function () {
+                while (deferredEvents.length > 0) {
+                    targetWindow.postMessage(deferredEvents.shift(), url);
+                }
+            }, 1000);
+        }
+    });
+    if (resolvedIframe === false) {
+        targetWindow = window.open(url, 'xstateinspector');
+    }
     window.__xstate__.onRegister(function (service) {
@@ -64,19 +87,8 @@ postMessage({
     });
-    window.addEventListener('message', function (event) {
-        if (typeof event.data === 'object' &&
-            event.data !== null &&
-            'type' in event.data &&
-            event.data.type === 'xstate.inspecting') {
-            // TODO: use a state machine...
-            setTimeout(function () {
-                while (deferredEvents.length > 0) {
-                    targetWindow.postMessage(deferredEvents.shift(), url);
-                }
-            }, 1000);
-        }
-    });
-    resolvedIframe.addEventListener('load', function () {
-        targetWindow = resolvedIframe.contentWindow;
-    });
-    resolvedIframe.setAttribute('src', url);
+    if (resolvedIframe) {
+        resolvedIframe.addEventListener('load', function () {
+            targetWindow = resolvedIframe.contentWindow;
+        });
+        resolvedIframe.setAttribute('src', url);
+    }
 }

lib/index.d.ts

@@ -6,3 +6,3 @@ import { Interpreter } from 'xstate';
     url: string;
-    iframe: MaybeLazy<HTMLIFrameElement | null>;
+    iframe: MaybeLazy<HTMLIFrameElement | null | false>;
 }
@@ -13,3 +13,5 @@ declare global {
             register: (service: Interpreter<any>) => void;
-            onRegister: (listener: ServiceListener) => void;
+            onRegister: (listener: ServiceListener) => {
+                unsubscribe: () => void;
+            };
             services: Set<Interpreter<any>>;
@@ -16,0 +18,0 @@ };

lib/index.js

@@ -25,2 +25,7 @@ "use strict";
         services.forEach(function (service) { return listener(service); });
+        return {
+            unsubscribe: function () {
+                serviceListeners.delete(listener);
+            }
+        };
     }
@@ -37,4 +42,5 @@ };
     var targetWindow;
+    var isDeferred = true;
     var postMessage = function (event) {
-        if (!targetWindow) {
+        if (isDeferred) {
             deferredEvents.push(event);
@@ -46,6 +52,23 @@ }
     };
-    if (!resolvedIframe) {
+    if (resolvedIframe === null) {
         console.warn('No suitable <iframe> found to embed the inspector. Please pass an <iframe> element to `inspect(iframe)` or create an <iframe data-xstate></iframe> element.');
         return;
     }
+    window.addEventListener('message', function (event) {
+        if (typeof event.data === 'object' &&
+            event.data !== null &&
+            'type' in event.data &&
+            event.data.type === 'xstate.inspecting') {
+            isDeferred = false;
+            // TODO: use a state machine...
+            setTimeout(function () {
+                while (deferredEvents.length > 0) {
+                    targetWindow.postMessage(deferredEvents.shift(), url);
+                }
+            }, 1000);
+        }
+    });
+    if (resolvedIframe === false) {
+        targetWindow = window.open(url, 'xstateinspector');
+    }
     window.__xstate__.onRegister(function (service) {
@@ -66,20 +89,9 @@ postMessage({
     });
-    window.addEventListener('message', function (event) {
-        if (typeof event.data === 'object' &&
-            event.data !== null &&
-            'type' in event.data &&
-            event.data.type === 'xstate.inspecting') {
-            // TODO: use a state machine...
-            setTimeout(function () {
-                while (deferredEvents.length > 0) {
-                    targetWindow.postMessage(deferredEvents.shift(), url);
-                }
-            }, 1000);
-        }
-    });
-    resolvedIframe.addEventListener('load', function () {
-        targetWindow = resolvedIframe.contentWindow;
-    });
-    resolvedIframe.setAttribute('src', url);
+    if (resolvedIframe) {
+        resolvedIframe.addEventListener('load', function () {
+            targetWindow = resolvedIframe.contentWindow;
+        });
+        resolvedIframe.setAttribute('src', url);
+    }
 }
 exports.inspect = inspect;

package.json

 {
   "name": "@xstate/inspect",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "description": "XState inspection utilities",
@@ -5,0 +5,0 @@ "keywords": [

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

8877

increased by10.07%

Lines of code

223

increased by14.36%

No dependency changes