Ensure that context is defined when model type provided to createMachine()

[davidkpiano]

When using a model type in createMachine<typeof someModel>(...), TypeScript will no longer compile machines that are missing the context property in the machine configuration:

const machine = createMachine<typeof someModel>({
  // missing context - will give a TS error!
  // context: someModel.initialContext,
  initial: 'somewhere',
  states: {
    somewhere: {}
  }
});

[changeset-bot]

🦋 Changeset detected

Latest commit: 38e6a5e

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
xstate	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[Andarist]

A question that I feel is somewhat related to this.

There are cases for which the initial context is not known upfront - for example when the machine requires user data but it can only be passed from the parent since it first needs to be acquired from somewhere. With this change, you force a user to provide some dummy data here or you steer them towards casting which loses the type safety. Of course, currently, there is no type safety when you don't provide any context value, and yet you expect context to be of a certain type but that is an orthogonal problem. And it has existed before the model has even been introduced.

So the question is - what the user should do when using modal for cases like the one that I've described. What's the official recommendation?

[davidkpiano]

With this pattern, that's not an issue:

const createUserMachine = user => createMachine({
  context: { user }
});

And with a model:

const createUserMachine = user => {
  const model = createModel({ user });

  return createMachine<typeof model>({
    context: model.initialContext
  });
}

[davidkpiano]

Another idea (from Discord) for reference:

// TENTATIVE API
const machine = createMachine({
  // input is of type Partial<TContext> maybe
  context: (input) => ({
    some: 'default value',
    ...input
  })
});

machine.transition(/* ... */); // throws error; expecting input

machine.withContext({ the: 'input' }).transition(/* ... */);

interpret(machine); // throws error

interpret(machine.withContext({ ... })); // does not throw error