Modeler createShape() not working in case of a drop event

Developers Modeler
1

Hi,
in this sandbox I’m trying to handle the drop event of a html element (in this ex. a button) into a container.
If the button is clicked, the Task shape is drawn in the container, if it is dropped nothing happens.
Could anyone help me understand?
Thank you in advance.
EDIT 1: first time I use SandBox, I did not save my coding :expressionless:
new sandbox

2

What do you mean by this? In the Sandbox you shared I can only see a button that can be clicked. Nothing to be dropped.

3

Did you press Cmd/Ctrl+S? It looks like the codesandbox I shared recently, so maybe your code changes weren’t saved.

4

I did not save my code in a new SandBox, I linked @barmac original Sandbox. Sorry for that.
Now, in EDIT 1, you find my Sandbox

5

You are right. In the first post now I’ve shared the link to the sandbox with my work in it :slight_smile:

6

In the drop event handler, you are calling createNewDiagram which imports XML. Notice that the actions is asynchronous (BpmnJS.importXML returns a Promise). So the canvas that you get on the next line refers to an old diagram. The task is drawn on the old canvas/diagram and then you create a new diagram. Notice how it works in this codesandbox.

1 Like
7

Still, I don’t see a use case for re-creating the diagram each time you drop something on it :wink:

8

Thank you, that is why I could not see diagramXML on the container.
Actually, I commented out the createNewDiagram in handleDroppedModule because I’ve realised that I need to draw different shapes on the same canvas and not to create a new canvas at each drop event.
New sandbox

9

Yes, rigth I don’t see the point too :smiley: