Angular 17 Camunda 8 modeler issue

Hi all,

I have added few questions earlier to get the help to load camunda 8 modeler using angular 9. It was successful with your help.

Now I need to change my angular version from 9 to 17. When I changed, the modeler is not loading to the UI. I haven’t changed a single code of line except the angular version. I got below console error.

image (7)

Dependencies I have used are;
“bpmn-js”: “12.0.0”,
“bpmn-js-create-append-anything”: “0.2.1”,
“bpmn-js-properties-panel”: “1.3.0”,
“camunda-bpmn-moddle”: “6.1.1”,
@bpmn-io/properties-panel”: “0.18.0”,
“zeebe-bpmn-moddle”: “0.19.0”,
“diagram-js”: “^12.2.0”

initBpmn() {
  this.bpmnJS = new BpmnJS({
    propertiesPanel: {
      parent: '#properties'
    },
    additionalModules: [
      BpmnPropertiesPanelModule,
      BpmnPropertiesProviderModule,
      ZeebePropertiesProviderModule,
      CloudElementTemplatesPropertiesProviderModule,
      CreateAppendAnythingModule,
      CreateAppendElementTemplatesModule,
      ElementTemplateChooserModule,
    ],
    moddleExtensions: {
      zeebe: zeebeModdleDescriptor
    },
    elementTemplates: this.jsonData,
  });

  this.bpmnJS.on('import.done', ({ error }: { error: any }) => {
    if (!error) {
      this.bpmnJS.get('canvas').zoom('fit-viewport');
    }
  });

  // tslint:disable-next-line:only-arrow-functions
  this.bpmnJS.on('elementTemplates.errors', function (event) {
    console.log('template load errors', event.errors);
  });
  this.bpmnJS.get('elementTemplatesLoader').reload();

  this.bpmnJS.attachTo(this.el.nativeElement);
}

Please share if there is any sandbox example work with angular 17. Also the dependencies I have used are old when compared with the current available versions. I couldn’t able to find any camunda 8 modeler example with latest versions of dependencies. Please be kind enough to share anything that matches my requirement.

Thank you

Hi @Martin ,
I have tried below code that supports angular 17.
https://github.com/bpmn-io/bpmn-js-example-angular
Was able to load the canvas but couldn’t load the properties-panel. Do you have any sample code that I can try?

Hi @Thamali_Sathsara - I am just starting Camunda 8 modeler in my Angular application. Could you please help me where I have to start. If you have any reference or any docs it would be great help for me.

Hi @vinoth_Kumar

I have posted code samples in this forum in multiple questions that I asked. I have used angular 9. I started trying codesandbox camunda modeler examples and eneded up with the base. Then for the rest of the things, I got the help from this forum. If you need any help, let me know.

Hi @Thamali_Sathsara ,
Thanks for your reply.
I see lot of history from your name in this forum. Can you please share the exact github link which I need to follow up to setup my angular with bpmn ?

Hi @vinoth_Kumar
I have sent you some public repo links. Tryout those