Adding new elements to businessObject

Currently working on finding a mechanism for adding new elements to the businessObject directly. These are not modelling elements so i cannot add or remove them via the modeller itself.

Having issues with finding details on how i can programmatically update the businessObject.

I have created a complex element which i am trying to append onto the businessObject, but cannot seem to find out how this is done.

Here is the code for creating the element.

    const extElement = elementHelper.createElement("bpmn:ExtensionElements", {}, businessObject, bpmnFactory)
    const root = elementHelper.createElement("bpsim:BPSimData", {}, extElement, bpmnFactory)
    const scenario = elementHelper.createElement("bpsim:Scenario", attributes, root, bpmnFactory)
    elementHelper.createElement("bpsim:ScenarioParameters", {}, scenario, bpmnFactory)
    elementHelper.createElement("bpsim:ElementParameters", {}, scenario, bpmnFactory)

As you can see i am using the elementHelper from bpmn-js-properties-panel/ElementHelper.js at master · bpmn-io/bpmn-js-properties-panel · GitHub

From this i would suspect that setting the parent attribute would be a mechanism for adding the element to the businessObject, but apparently not?

Any and all pointers are always appreciated!

Thanks

Herman

Edit:
found some useful references, will have a look at these.
1 - Can't create nested tags in Timer Event ExtensionElements
2 - Add extensionElements to process - #8 by orentoga
3 - Walkthrough | bpmn.io (this should be mandatory reading for all bpmn-js novices. Cleared up a lot of the the questions that i had)

and could someone also clarify what the purpose and use of the CmdHelper is?

The response object returned CmdHelper can be passed where?

The properties panel executes commands to apply the changes registered by the entries. So entries do not execute those on their own but retrieving them as descriptors, so the properties panel can execute them in an orderly manner.

  • cmd: the command to be executed
  • context: the parameters to be executed with the command.

The command helper is a friendly helper to create such command descriptors for you, especially for commands which are common for the entries inside the properties panel. Most commands are part of diagram-js and bpmn-js, but the properties panel is also defining a couple of them.

Aha! This makes a lot more sense now.

Slowly getting a hang of this…

However, i have run into another issue which you could perhaps also address here?

I am adding support for editing a deeply nested element via the properties panel, but in the event where the element does not exist then i have to create it and also all of its parent elements.

I have yet to stumble over an example that details how one can initialize deeply nested structures.

Could you perhaps steer me in the right direction ?

As always, any help at all is very appreciate!

We have some examples of creating/maintaining nested properties inside the properties panel. This example shows the creation of an input parameter in the following order, given an element A.

  • ensure bpmn:extensionElements exist for A
  • ensure camunda:inputOutput exists inside the extension elements
  • create the bpmn:inputParameter inside the input output

Perfect. Thanks again!

Where can i find an overview of the available commands that the commandstack accepts?

Assuming this is defined as an enum somewhere

Unfortunately, it’s not an enum.

Many commands get registered via modeling, so you could some available commits via modeling#getHandlers. The commandStack itself has a map containing all handlers, but that’s internal API, so you should be careful when using it.

const modeling = modeler.get('modeling');

// get modeling commands
console.log(modeling.getHandlers());

const commandStack = modeler.get('commandStack');

// dangerous: internal API
console.log(commandStack._handlerMap);

Source: commands list - CodeSandbox

1 Like

I’m sure you already know it, but let’s open new threads if you have any further questions :slight_smile:

1 Like