How to handle the side effect from Service(singleton) which is not serializable?

[WendellLiu]

Let's say I have a webRTC client with lifecycle methods(for instance, init, play, close) I want to take into the state machine and it should be a singleton in the web app.

The first thoughts coming up in my mind is invoke. Since I don't want to set the singleton as a global variable, the only way I could invoke some side effect with my Client is by storing it in context. However, This client(third-party SDK) cannot be serialized since it's a circular structure.

Any good practice for this scenario?

[davidkpiano]

You can communicate with a (defined externally) singleton like this:

const machine = createMachine({
  // ...
  invoke: {
    id: 'single',
    src: () => (sendBack, receive) => {
      receive(event => {
        if (event.type === 'INIT') {
          someSingleton.init();
        }
        // ...
      }
    }
  },
  // ...
  on: {
    INIT_SINGLETON: {
      actions: send('INIT', { to: 'single' })
    }
  }
});