I’m migrating Xstate from version 4 to 5, and I ran into this error.

Here is what I have in package.json:

"dependencies": {
  "@xstate/react": "^4.0.1",
  "xstate": "^5.1.0"
}

My chart looks like this:

export default {
  id: 'com',
  initial: 'checkLoginState',
  context: comInitialContext,
  states: {
    [STATES.CHECK_LOGIN_STATE]: {
      ...checkUserStateChart({ target: '' }),
    },
  },
};

Machine looks like this:

import { createMachine } from 'xstate';
import { useMachine } from '@xstate/react';
const comMachine = createMachine(comStateChart);

const useComRegistrationMachine = (siteDefinition: SiteDefinitionTypes) => {
  console.log('useComRegistrationMachine????======', siteDefinition)
  return useMachine(comMachine, {
    context: useSharedContext(siteDefinition),
    actions: {
      'FORWARD_TO_HOMEPAGE': () => {
        console.log('FORWARD_TO_HOMEPAGE========');
        if (typeof window === 'object') {
          window.location.href = '/';
        }
      },
    },
    services: {
      getLoginState: async (ctx: ContextTypes) => {
        console.log('Service GET_LOGIN_STATE invoked======', ctx);
        try {
          const result = await ctx.queryClient.ensureQueryData({
            queryKey: QUERY_KEYS.GET_LOGIN_STATE,
            queryFn: getLoginState,
          });
          return result;
        } catch (error) {
          console.error('Error in GET_LOGIN_STATE', error);
          throw error;
        }
      },
    },
    guards: {
    },
  });
};

export default useComRegistrationMachine;

I noticed that the invoke function is not being called, and I can’t seem to see the logs in my service.