Do Camunda extensions only work for bpmn-js modeler and not viewer?

Developers
1

Hi,

I am using the following code to allow editing Camunda-base workflows. It works fine with a modeler, but NOT with a viewer:

import * as BpmnJS from 'bpmn-js/dist/bpmn-modeler.production.min.js';
import camundaExtensionModule from 'camunda-bpmn-moddle/lib'
import camundaModdle from 'camunda-bpmn-moddle/resources/camunda.json'

[...]

bpmnJS = new BpmnJS({
  additionalModules: [
    customRenderer,
    camundaExtensionModule,
  ],
  moddleExtensions: {
    camunda: camundaModdle
  }
});

When I replace ‘modeler’ with ‘viewer’ in the 1st import, I get the following 2 errors:

Error: No provider for "moddleCopy"! (Resolving: camundaCopyPasteRootElementBehavior -> moddleCopy)

ERROR Error: Uncaught (in promise): Error: No provider for "moddleCopy"! (Resolving: camundaCopyPasteRootElementBehavior -> moddleCopy)
Error: No provider for "moddleCopy"! (Resolving: camundaCopyPasteRootElementBehavior -> moddleCopy)

Is there anything I can do to make Camunda extensions work with the viewer and not the modeler?

My goal is to have a web page of my application where a workflow can only be viewed. It should not be editable, and there should be no palette, among other restrictions.

Any suggestion will be welcome! Thank you!

2

For which scenario do you need to use the moddle extensions with the viewer?

The camundaExtensionModule is for modeler only and does not work with the viewer.

2 Likes
3

Thanks Beatriz.
I have developed a custom renderer which is based (amonth other stuff) on the camunda:topic attribute for Service Tasks. I would like to let some users visualize the wokrlfows, in a way where the custom renderer is used to customize the drawing, but they should not be able to modify anything in the workflow.

Any other way to achieve this? (maybe by using the modeler instead of the view, but with some settings which de-activate all editing capabilities?)

Best regards

4

You can use the camundaModdle in moddleExtensions with the viewer, just not the camundaExtensionModule in the additionalModules.

For further assistance, please share a CodeSandbox that reproduces your issue in a way that we can inspect it.

1 Like
5

@bfredo123 as you’ve asked on certain ways to activate / deactivate editing capabilities, let me try to elaborate.

To sum it up bpmn-js Extensions work well for both, modeler and viewer as long as they do not use modeler specifics.

In your case an extension uses the moddleCopy service which is a modeler only feature. To build extensions compatible for viewer and modeler you’d need to do any of the two things:

Provide Viewer Only Distribution

Add a viewer only distribution and exclude parts of your extension that require modeler features.

Gracefully Handle Missing Components

Use the injector to load services you depend on in a graceful manner:

function MyBpmnJSExtension(injector) {
  
  const moddleCopy = injector.get('moddleCopy', false);

  if (!moddleCopy) {
    // oops, I'm not in the modeler context,
    // what shall I do?
   }

   ...
}

Hope that provides a little more background.

1 Like
6

Many thanks Beatriz, I will try that.

Many thanks Nikku, interesting to have further background. I don’t get what is a “distribution” in this case (distribution of what?). Does it mean that I would have to clone the camunda extensions to make them work in the restricted world of the viewer? (maybe it’s not worth it that you answer right now as Beatriz’s suggestion should make me happy, however, I am still interested, just out of curiosity)

Best regards

7

No. It means that Camunda extensions shall be clear about whether these exensions are Viewer or Modeler extensions.

If you create your own extensions, you shall also be clear about that and, if needed, simply provide two separate distributions of your extension, one for the viewer and one for the editor. Checkout an example.

2 Likes
8

Thank you Nikku, all clear now!

9

Hi,
I could just test Beatriz proposal, it just works! thank you so much.