Elements are not being added to the canvas

I am new on bpmn.io
I will appreciate your help.

I implemented the library following the default modeler example. I am still doing some tests. I noticed that when I try to add a new element the canvas becomes red and the element is not added. In the image below the element disappears after I click off the canvas :

Is there any missing paramater I should be aware of?

Screen Shot 2020-06-04 at 11.27.12 AM

html, body, #container_1 {
height: 800px;
padding: 0;
margin: 0;

  .diagram-note {
    background-color: rgba(66, 180, 21, 0.7);
    color: White;
    border-radius: 5px;
    font-family: Arial;
    font-size: 12px;
    padding: 5px;
    min-height: 16px;
    width: 50px;
    text-align: center;

  .needs-discussion:not(.djs-connection) .djs-visual > :nth-child(1) {
    stroke: rgba(66, 180, 21, 0.7) !important; /* color elements as red */

  #save-button {
    position: fixed;
    bottom: 20px;
    left: 20px;


Here’s a working example: https://codesandbox.io/s/bpmn-js-sandbox-3zkw0

You can compare your code with this reference code.

If you have any customisations, please put them on this Sandbox and let us know so that we can help you.

1 Like