Error: illegal invocation in or phase (action: element.setColor)

I am using bpmn.js to create diagram flow.I am trying to change the default color of each element, like bpmn:startEvent, bpmn:endEvent, etc.

 modeler.on('shape.added', (e) => {   
 if (e.element.type === 'bpmn:UserTask') {
           var modeling = modeler.get('modeling').setColor(e.element, {
               fill: '#000000',
               stroke: '#e432ee'
           });   
 }   
 ................ more and more and more 
});

when I import one diagram it works, it appears the collors, but when I click on the pallete, they don’t appear and I receive some javascript errors, that does not let me place or select the elements properly. I placed this code after the last line in app.js:

Here is the error I’m receiving is javascript:

bpmn-modeler.production.js:1514 Error: illegal invocation in <execute> or <revert> phase (action: element.setColor)
    at ph._pushAction (bpmn-modeler.production.js:16556)
    at ph.execute (bpmn-modeler.production.js:16478)
    at Od.setColor (bpmn-modeler.production.js:18492)
    at flowchart.component.ts:99
    at bpmn-modeler.production.js:1511
    at Gt._invokeListener (bpmn-modeler.production.js:1512)
    at Gt._invokeListeners (bpmn-modeler.production.js:1505)
    at Gt.fire (bpmn-modeler.production.js:1490)
    at Et._addElement (bpmn-modeler.production.js:1068)
    at Et.addShape (bpmn-modeler.production.js:1073)

Any ideas?