Illegal invocation in <execute> or <revert> phase (action: element.updateProperties)

Hey all,

I get the following error stack in my code for which I can’t figure out the root cause:

image

This happens when adding a new element to the canvas. When loading a diagram in the canvas everything is fine.

This is the code where the errors occur:

// When adding a shape change the ID to the type of the element
window.subscribe = function() {
	bpmnModeler.get('eventBus').on('shape.added', function(event) {
		var type = event.element.type;
		
		if (type === 'label') {
			return;
		}
		
		var oldID = event.element.id;
		var newID = type.substring(type.indexOf(':') + 1) + '_' + oldID.substring(oldID.indexOf('_') + 1);
		
		if (oldID === newID) {
			return;
		}

		modeling.updateProperties(event.element, {
			id: newID
		});
	});
}

Any clues on what might be the issue? Can’t I update the ID in the added event listener? Or might it have something to do with the fact that I bound some elements to the window?

shape.added is called whenever a shape was added to the Canvas. When you create a shape using Modeling.createShape or through interaction (which will use Modeling.createShape too) the shape will be added to the Canvas during the execute phase of CreateShapeHandler. Executing commands during the execute phase of a command is not possible. Therefore you’re getting this error.

You can either listen for commandStack.shape.create.postExecute or create a CommandInterceptor thereby ensuring that you won’t end up with an additional command when changing the ID right after you created a shape.

1 Like

Hi,
i have a similar issue, i’m creating a custom CommandHandler which should create few elements at once .
the command stack is triggered on a custom event that i created via eventBus class.
i call the commandStack(on the my custom event) to invoke my custom handler, but i get this error illegal invocation in <execute> or <revert> phase (action: shape.create)

if its can’t be don’t this way, how should i do it ?