Xstate: Regression with xstate/[email protected]

[BenoitDel]

Description

userService throws an exception complaining about the fact that the service argument is undefined

Uncaught TypeError: Cannot read property 'initialState' of undefined

Expected Result
Since the service is defined. It should not throw error

This is a regression specific to xstate/[email protected].
With xstate/[email protected], everything was ok.

Reproduction

https://codesandbox.io/s/unruffled-wescoff-6yq1d?file=/src/index.tsx

Additional context
tested with 4.11.0 ans 4.10

[davidkpiano]

Can you fix the CodeSandbox? There are typos, e.g., refMchine and some TS errors.

[BenoitDel]

@davidkpiano Sorry for that, the CodeSandbox should work now.

[Andarist]

I've reproduced your problem with the previous version of your codesandbox and:

1. you should avoid using useService and prefer using useActor
2. it still wouldn't quite fix your problem though (yet) because you are using spawn and it is implemented differently than invoke which we have missed while working on this
3. spawn doesn't schedule spawning children like invoke does, it's eager - which is part of the problem - and doesn't use our internal createInvocableActor at all

I don't have a good answer for this yet - we'll have to refactor some stuff to accommodate spawn use case.

[BenoitDel]

@Andarist I decide to useuseService to get access to the context child machine, but maybe this is an anti-pattern or not the best way to do it.
I try to import useActor with xstate/[email protected] but it seems that the hook is not exported in this version
the problem is shown here:
CodeSandbox

When you say eager what do you mean? That the child machine is spawn even if i don't acces to the spawer state?

I thought that invoke should be used only with machine with a final state?

[Andarist]

I try to import useActor with xstate/[email protected] but it seems that the hook is not exported in this version

Yeah, I've fixed this here: https://github.com/davidkpiano/xstate/pull/1283 . Haven't mentioned it as there are still other problems with the current xstate/[email protected] and spawned children.

When you say eager what do you mean?

Most actions are just objects which get returned by the machine and later interpreted (executed) by the interpreter. However, spawn is executed right away: https://github.com/davidkpiano/xstate/blob/ca8841a5da6560f2956b0dfa08eb05252ad1eca5/packages/core/src/interpreter.ts#L1316
and that's what I have meant by eager execution - in contrast to other actions that are executed "lazily".

I thought that invoke should be used only with machine with a final state?

Not really - the only real difference is that invoked services have their lifetime bound to the invoking state (so they are automatically cancelled when you leave that state) whereas spawned services have to be stopped manually at the desired time.

[davidkpiano]

@Andarist I think the simple fix here would be to add that .deferred = true tag to spawned actors that are spawned before the service starts as well. But yes, this should be using useActor(...).

[BenoitDel]

This issue has been closed but the bug is still there in version 1.0.0-rc.6

[Andarist]

The fix requires a new XState release - we'll probably do one in the upcoming week. Thanks for reminding us to do so.