Ask questionsservice.children empty when machine starts

Description I was looking for a way to use a "main" machine to handle the whole workflow of my React application (each screen of the app has its own machine, invoked by the main one).

My <App /> component just:

  • looks at the current state of the main machine
  • retrieves the corresponding invoked machine using service.children Map
  • renders the proper screen with the invoked machine passed as props

Not sure this is the best solution (inputs are welcome!), but I came across something rather unexpected:

Expected Result service.children should return current actors/invoked services.

Actual Result service.children returns an empty Map on start, even if a service is invoked and runs properly.

Reproduction Run the following sample and take a look at the console: CodeSandbox

Starting by a transient state doesn't change anything, but delaying the first state seems to work (really ugly though). You can test this by opening machines/main.js and changing initial state from step1 to:

  • step0WithADelay
  • step0WithATransientState

Additional context XState 4.6.7


Answer questions cybervaldez

Came across this issue myself today, here's a sandbox:

Github User Rank List