[react] config from web console leaves out actions

[alita-moore]

For example, see the following: https://codesandbox.io/p/sandbox/amazing-joji-pm32mh?file=%2Fsrc%2FApp.tsx%3A34%2C7

If you look at the console output, then go output[2].machine.config in the console, then copy the console output and then paste into xcode it will lose information.

What I receive:

{
  "id": "auth",
  "initial": "loggedOut",
  "states": {
    "loggedOut": {
      "on": {
        "LOGIN": {
          "target": "loggedIn"
        }
      }
    },
    "loggedIn": {
      "invoke": {
        "src": "someService",
        "onDone": [
          {
            "target": "loggedIn",
            "actions": "{\n              \"type\": \"xstate.assign\",\n              \"assignment\": {}\n            }",
            "internal": false
          },
          {
            "target": "loggedIn",
            "actions": "{\n              \"type\": \"xstate.assign\",\n              \"assignment\": {\n                \"error\": \"error\"\n              }\n            }",
            "internal": false
          }
        ]
      },
      "on": {
        "LOGOUT": {
          "target": "loggedOut"
        },
        "action": {}
      },
      "onDone": {
        "target": "loggedOut"
      }
    }
  }
}

The interesting piece is in the first onDone action

 {
            "target": "loggedIn",
            "actions": "{\n              \"type\": \"xstate.assign\",\n              \"assignment\": {}\n            }",
            "internal": false
          },

But I expected something closer to this: To be precise, I expected it to contain a conditional. Because it does not it's difficult to simulate the machine.

For my use case the built in inspect tool doesn't seem to be working as I'd expect, but I'm not sure how to find a better config object to visualize / simulate. Is there a workaround for this?

---

Studio version: 0.47.4

[alita-moore]

I tried with JSON.stringify but got the following (same problem):

{
  "id": "auth",
  "initial": "loggedOut",
  "states": {
    "loggedOut": {
      "on": {
        "LOGIN": {
          "target": "loggedIn"
        }
      }
    },
    "loggedIn": {
      "invoke": {
        "src": "someService",
        "onDone": [
          {
            "target": "loggedIn",
            "actions": "{\"type\":\"xstate.assign\",\"assignment\":{}}",
            "internal": false
          },
          {
            "target": "loggedIn",
            "actions": "{\"type\":\"xstate.assign\",\"assignment\":{\"error\":\"error\"}}",
            "internal": false
          }
        ]
      },
      "on": {
        "LOGOUT": {
          "target": "loggedOut"
        },
        "action": {}
      },
      "onDone": {
        "target": "loggedOut"
      }
    }
  }
}

[alita-moore]

by the way I'm still new to this, is there a way to develop directly with the stately.ai tool? i.e. can I set it up to adjust the JSON directly?

[davidkpiano]

We have since updated the studio; can you please clarify the issue and/or try it again?

Can you clearly list the reproduction and expected/actual values?