Request: Documentation for Migrating from javascript-state-machine

[jameschensmith]

I just want to first say thank you for this great library! I'm not sure if I'm the only one going through this, but I'm in the process of migrating an application from javascript-state-machine to XState. The process has been a bit smooth, but I've ran into a few road bumps.

Firstly, javascript-state-machine is very close to XState's FSM, with a few extras. I was not able to stick with FSM because I needed nextEvents, which is only available in XState's core library. Having this in FSM would cover that feature which javascript-state-machine provides, and would allow users such as myself to stick with the smaller library.

Secondly, one of the more difficult portions to migrate has been the callbacks. With javascript-state-machine, these are automatically triggered by adding callbacks to the machine, or (how it was implemented in the code I'm working with) embedded into a target class which is then tied to the machine. This second option allows the use of this inside callbacks to directly affect the class. I'm looking into XState's actions for a potential migration option, but I see that it states that actions are not triggered upon a transition, and are left up to the interpreter. Upon following the documentation, I'm having trouble calling the actions using Typescript's types (I need to pass context, event, and meta; all are required). I do see that FSM provides executeStateActions, but this method is not in the core library. There's no example I've seen so far executing actions using the type-safe implementation. I'm just looking for the recommended way to execute actions with a typescript application.

That's all I have to say so far. I'm hoping this discussion will grow into a potential migration document, as javascript-state-machine is quite old now and the documentation for the migration could probably stay relatively stable. I think this would help anyone else in the same process. 🙂

[jameschensmith]

Checking back in after the weekend. Any insight to action usage directly from core would be appreciated. The only example of using actions in Typescript I have seen so far has been this snippet from the tests. I was hoping there would be a lot more intuitive approach to executing actions (the same code is repeated a few lines below) that would benefit users migrating away from javascript-state-machine. It feels like a lot of boilerplate is required just to execute actions. Maybe this was more aimed towards the UI frameworks, or rather implementations of XState's core package? Any advice here would help so much. Thanks!

[davidkpiano]

Hey @jameschensmith, I'm not too familiar with javascript-state-machine, but I would greatly appreciate a PR with this documentation, if you're keen on writing it.

[jameschensmith]

@davidkpiano, I would definitely be able to contribute documentation once I start wrapping up the migration work.

For the actions, I could potentially go the service route, but I was set on going the pure function route as I don't need the machine running for longer than a single transition execution (the pure function route fits our requirement better). If I could figure out this roadblock, I would be able to wrap up the migration, and contribute the work required for a smaller migration. 🙂