Multiple “when”-conditions for a State

Question

Say I have following states:

State
{
    name: "red_state"
    when: color === "red"
},
State
{
    name: "blue_state"
    when: color === "blue"
},
State
{
    name: "square_state"
    when: shape === "square"
},
State
{
    name: "circle_state"
    when: shape === "circle"
},
State
{
   name: "blue_circle_state"
   when: color === "blue" && shape === "circle"
}

The “blue_circle_state” is never triggered, why is this? Is there a better way to have several conditions for a State?

Answer 1

There is nothing wrong about having multiple conditions for a State in a when, the problem here is having blue_state, circle_state and blue_circle_state all evaluating to true at the same time. The documentation about the when property of a State says :

If multiple states in a group have when clauses that evaluate to true at the same time, the first matching state will be applied.

So when the color is blue and the shape is a circle, here only the blue_state will be active.

In your situation moving the more specific blue_circle_state at the beginning will solve your problem, but you still can't have multiple states active at the same time.

If you want to have a more advanced State Machine you can take a look at The Declarative State Machine Framework.