fix(replace): create new di on replace

lib/features/modeling/BpmnUpdater.js

@@ -410,11 +410,6 @@ BpmnUpdater.prototype.updateDiParent = function(di, parentDi) {
     return;
   }
 
-  // Cover the case where di.$parent === undefined and parentDi === null
-  if (!parentDi && !di.$parent) {
-    return;
-  }
-
   var planeElements = (parentDi || di.$parent).get('planeElement');
 
   if (parentDi) {

lib/features/modeling/ElementFactory.js

@@ -12,6 +12,10 @@ import {
   is
 } from '../../util/ModelUtil';
 
+import {
+  isAny
+} from '../modeling/util/ModelingUtil';
+
 import {
   isExpanded
 } from '../../util/DiUtil';
@@ -68,7 +72,7 @@ ElementFactory.prototype.createBpmnElement = function(elementType, attrs) {
   attrs = attrs || {};
 
   var businessObject = attrs.businessObject,
-      di = attrs.di;
+      di = attrs.di || {};
 
   if (!businessObject) {
     if (!attrs.type) {
@@ -80,7 +84,7 @@ ElementFactory.prototype.createBpmnElement = function(elementType, attrs) {
     ensureCompatDiRef(businessObject);
   }
 
-  if (!di) {
+  if (!isModdleDi(di)) {
     if (elementType === 'root') {
       di = this._bpmnFactory.createDiPlane(businessObject, [], {
         id: businessObject.id + '_di'
@@ -95,6 +99,12 @@ ElementFactory.prototype.createBpmnElement = function(elementType, attrs) {
         id: businessObject.id + '_di'
       });
     }
+
+    if (attrs.di) {
+      assign(di, attrs.di);
+
+      delete attrs.di;
+    }
   }
 
   if (is(businessObject, 'bpmn:Group')) {
@@ -262,3 +272,13 @@ function applyAttribute(element, attrs, attributeName) {
 
   delete attrs[attributeName];
 }
+
+
+function isModdleDi(element) {
+  return isAny(element, [
+    'bpmndi:BPMNShape',
+    'bpmndi:BPMNEdge',
+    'bpmndi:BPMNDiagram',
+    'bpmndi:BPMNPlane',
+  ]);
+}

lib/features/replace/BpmnReplace.js

@@ -2,13 +2,15 @@ import {
   pick,
   assign,
   filter,
+  forEach,
+  isArray,
+  isUndefined,
   has
 } from 'min-dash';
 
 import {
   is,
-  getBusinessObject,
-  getDi
+  getBusinessObject
 } from '../../util/ModelUtil';
 
 import {
@@ -22,6 +24,18 @@ import {
 
 import { getPropertyNames } from '../copy-paste/ModdleCopy';
 
+function copyProperties(source, target, properties) {
+  if (!isArray(properties)) {
+    properties = [ properties ];
+  }
+
+  forEach(properties, function(property) {
+    if (!isUndefined(source[property])) {
+      target[property] = source[property];
+    }
+  });
+}
+
 
 var CUSTOM_PROPERTIES = [
   'cancelActivity',
@@ -109,9 +123,19 @@ export default function BpmnReplace(
     var newElement = {
       type: type,
       businessObject: newBusinessObject,
-      di: getDi(element)
     };
 
+    newElement.di = {};
+
+    // colors will be set to DI
+    copyProperties(element.di, newElement.di, [
+      'fill',
+      'stroke',
+      'background-color',
+      'border-color',
+      'color'
+    ]);
+
     var elementProps = getPropertyNames(oldBusinessObject.$descriptor),
         newElementProps = getPropertyNames(newBusinessObject.$descriptor, true),
         copyProps = intersection(elementProps, newElementProps);

test/spec/features/modeling/behavior/ReplaceElementBehaviourSpec.js

@@ -535,7 +535,7 @@ describe('features/modeling - replace element behavior', function() {
         // then
         var createdEvent = elementRegistry.get(id);
 
-        expect(createdEvent).to.eql(startEvent);
+        expect(createdEvent).to.exist;
         expect(createdEvent.businessObject.eventDefinitions).not.to.exist;
         expect(createdEvent.businessObject.get('isInterrupting')).to.be.true;
       })

test/spec/features/modeling/behavior/SubProcessStartEventBehaviorSpec.js

@@ -7,7 +7,7 @@ import coreModule from 'lib/core';
 import modelingModule from 'lib/features/modeling';
 import replaceModule from 'lib/features/replace';
 
-import { is } from 'lib/util/ModelUtil';
+import { is, getDi } from 'lib/util/ModelUtil';
 
 describe('features/modeling/behavior - subprocess start event', function() {
 
@@ -47,6 +47,30 @@ describe('features/modeling/behavior - subprocess start event', function() {
         }
       ));
 
+
+      it('should wire startEvent di correctly', inject(
+        function(elementRegistry, bpmnReplace) {
+
+          // given
+          var task = elementRegistry.get('Task_1'),
+              expandedSubProcess,
+              startEvent,
+              startEventDi;
+
+          // when
+          expandedSubProcess = bpmnReplace.replaceElement(task, {
+            type: 'bpmn:SubProcess',
+            isExpanded: true
+          });
+
+          // then
+          startEvent = getChildStartEvents(expandedSubProcess)[0];
+          startEventDi = getDi(startEvent);
+
+          expect(startEventDi.$parent).to.exist;
+        }
+      ));
+
     });
 
 

test/spec/features/replace/BpmnReplaceSpec.js

@@ -71,6 +71,24 @@ describe('features/replace - bpmn replace', function() {
     }));
 
 
+    it('Task with new DI', inject(function(elementRegistry, bpmnReplace) {
+
+      // given
+      var task = elementRegistry.get('Task_1');
+      var taskDi = getDi(taskDi);
+      var newElementData = {
+        type: 'bpmn:UserTask'
+      };
+
+      // when
+      var newElement = bpmnReplace.replaceElement(task, newElementData);
+
+      // then
+      expect(newElement).to.exist;
+
+    }));
+
+
     it('gateway', inject(function(elementRegistry, bpmnReplace) {
 
       // given
@@ -1625,6 +1643,24 @@ describe('features/replace - bpmn replace', function() {
 
     beforeEach(bootstrapModeler(diagramXML, { modules: testModules }));
 
+    it('should have new di', inject(function(elementRegistry, bpmnReplace) {
+
+      // given
+      var task = elementRegistry.get('Task_1');
+      var di = getDi(task);
+      var newElementData = {
+        type: 'bpmn:UserTask'
+      };
+
+      // when
+      var newElement = bpmnReplace.replaceElement(task, newElementData);
+
+      // then
+      var newDi = getDi(newElement);
+
+      expect(newDi).to.not.equal(di);
+    }));
+
     it('should maintain colors', inject(function(elementRegistry, bpmnReplace, modeling) {
 
       // given