'External' transition to sub-state/super-state is rendered as 'internal' with floating arrow

[hefroy]

'External' transitions exit a state and re-enter, and should be rendered as an arrow leaving the outermost state and re-entering. This works when the target state is the same as the source, but when the target is a sub-state or super-state, the arrow is not shown as leaving the outermost state and one of the ends of the arrow is floating.

Expected Behavior

• External transitions should show the arrow leaving the outermost state and re-entering, see here.
• The start and end of the transition arrow should be on the edges of the source and target state rectangles.

Current Behavior

• External transitions to super-states and sub-states are rendered as internal transitions (a.k.a. local transitions): the arrow remains within the outermost state.
• When transitioning to a sub-state, the beginning of the arrow is not on the edge of the source state.
• When transitioning to a super-state, the end of the arrow is not on the edge of the target state.

Steps to Reproduce

a {
  b;
},
c {
  d;
};
a -> b;
d -> c;

The default transition type is external, so there's no need to specify it (but doing so also doesn't work).

Context

Support for internal/external transitions is present, so you'd expect this to work.

Your Environment

https://state-machine-cat.js.org/
Version: 7.0.3

[sverweij]

Hi @hefroy this was indeed not implemented in the graph rendering - and I agree it should. I'll try to make it better and be targeting this (LMK if that's off):

[hefroy]

Hi @sverweij, yep that looks much better. Thanks for the fast response again!