Get Source and Target before connection delete

Developers
1

Hi,

I need a source and target of a sequenceflow before removing the connection. So I have done this by adding the following event into events and executed eventbus.

var events = [           
            'commandStack.connection.delete.execute'
 ];

events.forEach(function(event) {
	eventBus.on(event, function(e) {
		// e.gfx = the graphical element
		if(event == 'commandStack.connection.delete.execute'){
		   if(e.context){
				const context = e.context;
				console.log(context);
				console.log(context.connection);
				console.log(context.parent);
				console.log(context.source);
				console.log(context.target);								
		   }
		}
	}
}

but when I try to print context in console, it is printing as expected but not source and target, any idea how I can get source and target for a connection remove?
image

2

Hi!

You can get this information via the connection directly.

const eventBus = modeler.get("eventBus");

eventBus.on("commandStack.connection.delete.preExecute", function (event) {
  const { context } = event;

  const { connection } = context;

  console.log("Context:", context);
  console.log("Connection:", connection)
  console.log("Parent:", connection.parent);
  console.log("Source:", connection.source);
  console.log("Target:", connection.target);
});

However, I’d be careful when listening to commandStack events via eventBus since you’ll never know when the context will be available. I’d rather go with a CommandInterceptor, the UnsetDefaultFlowBehavior can be a good example.

1 Like
3

Hi Niklas,

Thanks and your suggestion works like a charm.

1 Like
4

Glad to hear that :slight_smile:

5

Hi Niklas.

If I implement commandStack.shape.delete.preExecute for removing gateways, unfortunately its removing all incoming and outgoing connections. Is there a way to get incoming sequence flow for gateways?

6

It’s true that the connections got removed alongside the gateway. However, as I mentioned before, dealing with commands should be done via a CommandInterceptor. With that, you can get those connections before the deletion happens.

this.preExecute("shape.delete", 1001, ({ context }) => {
  const { shape } = context;

  if (!is(shape, "bpmn:Gateway")) {
    return;
  }

  const incomings = shape.incoming;
  const outgoings = shape.outgoing;

  incomings.forEach((c) => console.log(c.id));
  outgoings.forEach((c) => console.log(c.id));
});

One note: console.log might swallow your connections in the logs due to side effects when the connections got removed during the command.

2 Likes