not able to update properties of multiple components in bpmn-js reactjs

Question

I am using this library bpmn-js in my reactjs project to create a flow. I have different type of element like subprocess and task.

I am updating attributes for multiple elements (el.businessObject.<property>).

my el.businessObject has properties like

there is voiceFileInfo attribute that has string json, and i am updating the this voiceFileInfo using this

const attrInfo = {};
attrInfo[key] = value;
modeling.updateProperties(el, attrInfo);

this code works, if i am running this outside the loop, like running this once. But i have list of attributes to update, so the same code m running in for loop. but in that case if there are 3 attributes to update, it will just update the last attribute value.

even i tried this

const extensionParent = bo.extensionElements || moddle.create('bpmn:ExtensionElements');
const property = moddle.create(type, { name: attrName, value: value });
extensionParent.get('values').push(property);

even this

const property = moddle.create("VoiceFilePlayerTask", { name: "voiceFileInfo", value: value });
const modeling = modeler.get('modeling');
modeling.updateProperties(el, property);

this is my descriptor file

"prefix": "voice",
  "types": [
    {
      "name": "VoiceFilePlayerTask",
      "extends": [
        "bpmn:Task"
      ],
      "properties": [
        {
          "name": "voiceFileInfo",
          "isAttr": true,
          "type": "String"
        }
      ]
    }
  ],

and if the task is under same subprocess then it works fine, if i try to update element from 2 different subprocess then it just update for the last subprocess element.

Any help on this?

Answer 1

Issue was strange, I had list of elements in array, so in loop i had to get fresh element from element registry

const modeler = MyService.getModeler();
const elementRegistry = modeler.get("elementRegistry");
elementRegistry.get(ID);