Support deno?

[tom-sherman]

It would be great if xstate could support deno out of the box. core should be a relatively easy starting point because of it's lack of dependencies.

What do you think?

[Andarist]

What does it mean to support deno?

[tomByrer]

@davidkpiano

[Andarist]

@tomByrer please do not ping maintainers like this. We literally try to read everything that happens in this repository and you have pinged David after only 5h from the latest post in this thread.

I can't see what module to import and requesting that with curl gives me a maximum redirect limit.

This seems like a denoland issue - @ is a valid git tag character and it seems to be tripping when encountering it.

[tom-sherman]

Oh I see, I wasn't aware that react@1.0.3 is a tag. It's definitely plausible that it's a denoland issue, could also be an issue with webhook setup?

[Andarist]

It's unlikely - the webhook only contains the repository (?) name and the subdirectory. I'm therefore also not sure if this is supposed to work with monorepos.

[tomByrer]

https://deno.land/x/xstate is 404 - Not Found :(

I am starting to use deno for local file running.

[tomByrer]

@tom-sherman have you tried another service, like jsDelivr or unpkg?

[tomByrer]

Thanks Tom! Seems the better solutions start at this comment, but there are more following:

denoland/deno#3196 (comment)

[tom-sherman]

Interesting solution! I've also been thinking about a babel plugin for just compiling the imports, this would be helpful for dependency-less libraries like xstate to build a Deno-compatible library.

[tomByrer]

If there are ESM packages in the repo, then seems one can use esm.run to use that code in Deno.

https://www.jsdelivr.com/esm

[virtuoushub]

FWIW I got this to work:

// xstate-deno-demo.ts
import { Machine, interpret } from "https://cdn.skypack.dev/xstate";

// Stateless machine definition
// machine.transition(...) is a pure function used by the interpreter.
const toggleMachine = Machine({
  id: "toggle",
  initial: "inactive",
  states: {
    inactive: { on: { TOGGLE: "active" } },
    active: { on: { TOGGLE: "inactive" } },
  },
});

// Machine instance with internal state
const toggleService = interpret(toggleMachine)
  .onTransition((state: any) => console.log(state.value))
  .start();
// => 'inactive'

toggleService.send("TOGGLE");
// => 'active'

toggleService.send("TOGGLE");
// => 'inactive'

$ deno run xstate-deno-demo.ts 
inactive
active
inactive

[edit] add deno version info:

deno --version
deno 1.6.0 (release, x86_64-apple-darwin)
v8 8.8.278.2
typescript 4.1.2

[tomByrer]

3rd try: Works for me also, forgot choose is imported via actions.choose

https://jsfiddle.net/tomByrer/sg7tkwqb/9/

Deno runtime online:
https://www.mycompiler.io/view/B8EgR64

[tomByrer]

Should this be moved into Issues to track as a bug-request, or is deno out-of-scope?

[davidkpiano]

It's a nice-to-have; let's keep it here (under "Ideas"). I'd gladly accept a PR for someone to work on this, because I haven't used Deno yet.

[tom-sherman]

Update: With Deno 1.25's npm support you can run xstate (I've only tried fsm right now but I'm sure the xstate package is the same) directly from npm in Deno:

// script.js
import { createMachine } from "npm:@xstate/fsm";

const machine = createMachine({
  initial: "idle",
  states: {
    idle: {
      on: {
        foo: "done",
      },
    },
    done: {
      type: "final",
    },
  },
});

console.log(machine.transition("idle", "foo").value); // "done"

> deno run --unstable --allow-env script.js
done

🙌

Few issues right now:

• It's unstable
• It requires permissions to read process.env.NODE_ENV. Bit of a bummer but I think there has been some discussions to remove this from the library?
• I have no idea how to get type definitions to load in vs code

The first two problems make it unsuitable to use in libraries right now (my current use case) and the third problem makes it unsuitable to use in your deno app if you're using TypeScript.

Good progress though!

[Andarist]

It requires permissions to read process.env.NODE_ENV. Bit of a bummer but I think there has been some discussions to remove this from the library?

It will be removed in the next major version.

[tom-sherman]

I honestly don't think XState needs to do anything apart from that except wait for Deno's support to progress and mature.

[nik-kita]

I use import by this url:

https://esm.sh/xstate@5.6.0/dist/xstate.esm.js

---

why?

• npm:xstate@5.6.0 - also works (except case below)
• deno-deploy + fresh + tailwindcss => on build step have Directory not empty (os error 39): ... (to deep for me to understand)
• https://deno.land/x/xstate@xstate%405.6.0 error and also when I try to open these files on denoland - access error .. (suppose it's relates to discussion above)

[nik-kita]

my deno.json for xstate:

{
  "imports": {
    "xstate": "https://esm.sh/xstate@latest?types=npm:xstate"
  }
}