Xstate: Chosen actions are not applied if it's pure or assign

[saadshahd]

Description
I'm trying to use the new choose action creator but the chosen actions don't get applied if they are pure or assign.

Only log and send work with me.

Expected Result
The child assign action of the choose to be invoked

Actual Result
The child assign action of the choose didn't get invoked.

Reproduction

• CodeSandbox (JavaScript)

Additional context
XState Version: 4.9.1

[davidkpiano]

Given your current code, you shouldn't be using choose(...) at all. What is your use-case for using choose(...)?

[saadshahd]

Given your current code, you shouldn't be using choose(...) at all. What is your use-case for using choose(...)?

@davidkpiano Thanks for the awesome library.

The code is just a simple example of using the choose(...). in the real world example, I am trying to trigger a different set of actions based on the state of a parallel machine.

[saadshahd]

But however, even if semantically my use-case doesn't make sense. Based on the docs I think my snippet of code should work differently. Am I right?

[Andarist]

@saadshahd yes, it should work - I've located the problem, gonna prepare a PR with the fix soon.

[Andarist]

Here you go: https://github.com/davidkpiano/xstate/pull/1153

[saadshahd]

@Andarist Thanks, you are awesome.

@davidkpiano below is a chunk of my real-world use case, I would really appreciate if you looked and suggested some refactoring.

const machine = Machine({
  id: 'collection-room',
  type: 'parallel',
  context: {
    loopInterval: null,
    video: {
      url: '',
      timestamp: 0
    }
  },

  on: {
    SET_VIDEO_TIME_WITH_MODE: {
      actions: ['setVideoTimestampWithMode']
    },
  },

  states: {
    videoMode: {
      id: 'videoMode',
      initial: 'manual',

      states: {
        manual: {
          on: {
            ENTER_LOOP: 'loop'
          }
        },

        loop: {
          exit: 'clearLoopInterval',
          on: {
            ENTER_MANUAL: 'manual'
          }
        }
      }
    },

    activating: {
      id: 'activating',
      initial: 'empty',

      on: {
        CHANGE: [
          { target: 'activating.empty', cond: 'isActiveBaseEmpty' },
          { target: 'activating.start', cond: 'isActiveBaseStart' },
          { target: 'activating.end', cond: 'isActiveBaseEnd' },
          { target: 'activating.full' }
        ]
      },

      entry: [
        ...
        'setLoopIntervalFromActiveWithMode'
      ],

      states: {
        empty: {},
        full: {
          entry: [...]
        },
        start: {
          entry: [...]
        },
        end: {
          entry: [...]
        }
      }
    }
  }
}, {
  actions: {
    setVideoTimestampWithMode: choose([
      {
        cond: 'isManual',
        actions: ['setVideoTimestamp', 'checkActive', 'redirect']
      },
      {
        cond: 'isLoop',
        actions: ['setVideoTimestamp']
      }
    ]),

    setLoopIntervalFromActiveWithMode: choose([
      {
        cond: 'isManual',
        actions: ['clearLoopInterval']
      },
      {
        cond: 'isLoop',
        actions: ['setLoopIntervalFromActive']
      }
    ])
  }
});

I see now that I could easily get rid of setVideoTimestampWithMode by declaring the SET_VIDEO_TIME_WITH_MODE event on the video mode StateNodes instead of the rool level.

But I still can't figure out what could I do better to get rid of setLoopIntervalFromActiveWithMode.

Thanks in advance.