Xstate: `this` has been rewritten to `undefined` and XState Inspect is Waiting for Connection

Created on 23 Oct 2020  路  5Comments  路  Source: davidkpiano/xstate

Description
XState Inspect is Waiting for Connection on Svelte Apps maybe because of the way rollup is rewritting some typescript output to undefined.

(!) `this` has been rewritten to `undefined`
https://rollupjs.org/guide/en/#error-this-is-undefined
node_modules/@xstate/inspect/es/index.js
1: var __assign = (this && this.__assign) || function () {
                   ^
2:     __assign = Object.assign || function(t) {
3:         for (var s, i = 1, n = arguments.length; i < n; i++) {
...and 1 other occurrence

Expected Result
When running locally, I would expect the Svelte SPA after going through its rollup bundle process to connect to https://statecharts.io/inspect.

Actual Result

Waiting for Connection is displayed with no errors in either browser. localhost:5000 -> statecharts.io/inspect. Having said that it's also been verified on a staging domain that it will not connect. So I don't think it's just localhost.

Reproduction

Here is a CodeSandbox where it actually works - https://codesandbox.io/s/xstate-inspect-fork-n4c92 but I think that's because Sandbox isn't going through the rollup process the same.

If you download that sandbox, npm i, then npm run dev you will be able to reproduce the problem.

Additional context
Please see https://github.com/distolma/xstate-svelte/issues/36 as @distolma and I have been working through this some already as I started there since I'm using that package.

~ Clark

馃攷 @xstatinspect

Most helpful comment

Not yet. @davidkpiano this release probably can be done manually unless you want to start releasing this package using changeset flow.

All 5 comments

Experiencing the same issue with locally running NextJS - Xstate is waiting for connection. At first I got window is not defined, but after putting inspect({ iframe: false }) insde useEffect, and enabling pop-up, it's stuck at waiting for connection.

@a-y-u-s-h or @csell5 Do you have a reproducible repository where we can replicate this issue?

If you just download locally to your drive that code sandbox above and run 'npm i', 'npm run dev' it should fail.

I can throw it in a repo too but I wanted to show it working there as I don't think codesandbox is going through the same rollup process.

Is this change published in the latest @xstate/inspect?

Not yet. @davidkpiano this release probably can be done manually unless you want to start releasing this package using changeset flow.

Was this page helpful?
0 / 5 - 0 ratings