feat(modeling): support toggle collapse with drilldown

closes #1539

lib/features/modeling/behavior/SubProcessPlaneBehavior.js

@@ -10,6 +10,15 @@ import { getBBox } from 'diagram-js/lib/util/Elements';
 import { asPlaneId, planeId } from '../../../util/DrilldownUtil';
 
 
+var LOW_PRIORITY = 400;
+var HIGH_PRIORITY = 600;
+
+var DEFAULT_POSITION = {
+  x: 180,
+  y: 160
+};
+
+
 /**
  * Creates diPlanes and canvas planes when collapsed subprocesses are created.
  *
@@ -140,27 +149,149 @@ export default function SubProcessPlaneBehavior(
 
     elementRegistry.updateId(planeElement, asPlaneId(oldId));
   }, true);
+
+
+  // create/remove plane for the subprocess
+  this.executed('shape.toggleCollapse', LOW_PRIORITY, function(context) {
+    var shape = context.shape;
+
+    if (!is(shape, 'bpmn:SubProcess')) {
+      return;
+    }
+
+    if (!isExpanded(shape)) {
+      createRoot(context);
+      self._showRecursively(shape.children);
+    } else {
+      removeRoot(context);
+    }
+
+  }, true);
+
+
+  // create/remove plane for the subprocess
+  this.reverted('shape.toggleCollapse', LOW_PRIORITY, function(context) {
+    var shape = context.shape;
+
+    if (!is(shape, 'bpmn:SubProcess')) {
+      return;
+    }
+
+    if (!isExpanded(shape)) {
+      createRoot(context);
+      self._showRecursively(shape.children);
+    } else {
+      removeRoot(context);
+    }
+
+  }, true);
+
+  // move elements between planes
+  this.postExecuted('shape.toggleCollapse', HIGH_PRIORITY, function(context) {
+    var shape = context.shape;
+
+    if (!is(shape, 'bpmn:SubProcess')) {
+      return;
+    }
+
+    var rootElement = context.newRootElement;
+
+    if (!rootElement) {
+      return;
+    }
+
+    if (!isExpanded(shape)) {
+
+      // collapsed
+      self._moveChildrenToShape(shape, rootElement);
+
+    } else {
+      self._moveChildrenToShape(rootElement, shape);
+    }
+  }, true);
+
 }
 
 inherits(SubProcessPlaneBehavior, CommandInterceptor);
 
-
 /**
-* Adds a given diagram to the definitions and returns a .
+ * Moves the child elements from source to target.
-*
+ *
-* @param {Object} planeElement
+ * If the target is a plane, the children are moved to the top left corner.
-*/
+ * Otherwise, the center of the target is used.
-SubProcessPlaneBehavior.prototype._addDiagram = function(planeElement) {
+ *
-  var bpmnjs = this._bpmnjs;
+ * @param {Object|djs.model.Base} source
-  var diagrams = bpmnjs.getDefinitions().diagrams;
+ * @param {Object|djs.model.Base} target
+ */
+SubProcessPlaneBehavior.prototype._moveChildrenToShape = function(source, target) {
+  var modeling = this._modeling;
 
-  if (!planeElement.businessObject) {
+  var children = source.children;
-    planeElement = this._createNewDiagram(planeElement);
+  var offset;
+
+  if (!children) {
+    return;
   }
 
-  diagrams.push(planeElement.di.$parent);
+  // Only change plane if there are no visible children, but don't move them
+  var visibleChildren = children.filter(function(child) {
+    return !child.hidden;
+  });
 
-  return planeElement;
+  if (!visibleChildren.length) {
+    modeling.moveElements(children, { x: 0, y: 0 }, target, { autoResize: false });
+    return;
+  }
+
+  // target is a plane
+  if (!target.x) {
+    offset = {
+      x: DEFAULT_POSITION.x - source.x ,
+      y: DEFAULT_POSITION.y - source.y
+    };
+  }
+
+  // source is a plane
+  else {
+
+    // move relative to the center of the shape
+    var targetMid = getMid(target);
+    var childrenBounds = getBBox(visibleChildren);
+    var childrenMid = getMid(childrenBounds);
+
+    offset = {
+      x: targetMid.x - childrenMid.x,
+      y: targetMid.y - childrenMid.y
+    };
+  }
+
+  modeling.moveElements(children, offset, target, { autoResize: false });
+};
+
+/**
+ * Sets `hidden` property on all children of the given shape.
+ *
+ * @param {Array} elements
+ * @param {Boolean} [hidden]
+ * @returns {Array} all child elements
+ */
+SubProcessPlaneBehavior.prototype._showRecursively = function(elements, hidden) {
+  var self = this;
+
+  var result = [];
+  elements.forEach(function(element) {
+    element.hidden = !!hidden;
+
+    result = result.concat(element);
+
+    if (element.children) {
+      result = result.concat(
+        self._showRecursively(element.children, element.collapsed || hidden)
+      );
+    }
+  });
+
+  return result;
 };
 
 /**

lib/features/ordering/BpmnOrderingProvider.js

@@ -131,7 +131,7 @@ export default function BpmnOrderingProvider(eventBus, canvas, translate) {
     // render labels always on top
     if (element.labelTarget) {
       return {
-        parent: canvas.getRootElement(),
+        parent: canvas.findRoot(element.labelTarget) || canvas.getRootElement(),
         index: -1
       };
     }

test/spec/features/grid-snapping/BpmnGridSnappingSpec.js

@@ -343,7 +343,7 @@ describe('features/grid-snapping', function() {
 
         // then
         expect(expandedSubProcess).to.include({
-          x: 140,
+          x: 150,
           y: 120,
           width: 360,
           height: 210

test/spec/features/modeling/behavior/ToggleElementCollapseBehaviour.bpmn

@@ -77,137 +77,89 @@
   </bpmn2:process>
   <bpmndi:BPMNDiagram id="BPMNDiagram_1">
     <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Process_1">
+      <bpmndi:BPMNEdge id="SequenceFlow_10jatau_di" bpmnElement="SequenceFlow_8">
+        <di:waypoint x="792" y="435" />
+        <di:waypoint x="834" y="435" />
+        <di:waypoint x="834" y="435" />
+        <di:waypoint x="883" y="435" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="804" y="425" width="90" height="20" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="SequenceFlow_1t8nq5v_di" bpmnElement="SequenceFlow_9">
+        <di:waypoint x="323" y="435" />
+        <di:waypoint x="376" y="435" />
+        <di:waypoint x="376" y="435" />
+        <di:waypoint x="407" y="435" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="346" y="425" width="90" height="20" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_1" bpmnElement="SequenceFlow_1" sourceElement="_BPMNShape_StartEvent_26" targetElement="_BPMNShape_SubProcess_8">
+        <di:waypoint x="336" y="194" />
+        <di:waypoint x="532" y="194" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="364" y="194" width="90" height="20" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_4" bpmnElement="SequenceFlow_4" sourceElement="_BPMNShape_SubProcess_8" targetElement="_BPMNShape_EndEvent_59">
+        <di:waypoint x="632" y="194" />
+        <di:waypoint x="813" y="195" />
+        <di:waypoint x="875" y="195" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="677.5" y="176.5" width="90" height="6" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="_BPMNShape_SubProcess_8" bpmnElement="SubProcess_1">
+        <dc:Bounds x="532" y="154" width="100" height="80" />
+      </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="_BPMNShape_StartEvent_26" bpmnElement="StartEvent_1">
         <dc:Bounds x="300" y="176" width="36" height="36" />
         <bpmndi:BPMNLabel>
           <dc:Bounds x="273" y="217" width="90" height="0" />
         </bpmndi:BPMNLabel>
       </bpmndi:BPMNShape>
-      <bpmndi:BPMNShape id="_BPMNShape_SubProcess_8" bpmnElement="SubProcess_1">
-        <dc:Bounds x="532" y="154" width="100" height="80" />
-      </bpmndi:BPMNShape>
-      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_1" bpmnElement="SequenceFlow_1" sourceElement="_BPMNShape_StartEvent_26" targetElement="_BPMNShape_SubProcess_8">
-        <di:waypoint xsi:type="dc:Point" x="336" y="194" />
-        <di:waypoint xsi:type="dc:Point" x="532" y="194" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="364" y="194" width="90" height="20" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNEdge>
-      <bpmndi:BPMNShape id="_BPMNShape_StartEvent_27" bpmnElement="StartEvent_2">
-        <dc:Bounds x="396" y="91" width="36" height="36" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="370" y="132" width="90" height="20" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNShape>
-      <bpmndi:BPMNShape id="_BPMNShape_Task_3" bpmnElement="Task_1">
-        <dc:Bounds x="564" y="79" width="100" height="80" />
-      </bpmndi:BPMNShape>
-      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_2" bpmnElement="SequenceFlow_2" sourceElement="_BPMNShape_StartEvent_27" targetElement="_BPMNShape_ExclusiveGateway_19">
-        <di:waypoint xsi:type="dc:Point" x="432" y="109" />
-        <di:waypoint xsi:type="dc:Point" x="480" y="109" />
-        <di:waypoint xsi:type="dc:Point" x="480" y="145" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="412" y="109" width="90" height="6" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNEdge>
-      <bpmndi:BPMNShape id="_BPMNShape_EndEvent_58" bpmnElement="EndEvent_1">
-        <dc:Bounds x="767" y="91" width="36" height="36" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="740" y="132" width="90" height="20" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNShape>
-      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_3" bpmnElement="SequenceFlow_3" sourceElement="_BPMNShape_Task_3" targetElement="_BPMNShape_EndEvent_58">
-        <di:waypoint xsi:type="dc:Point" x="664" y="119" />
-        <di:waypoint xsi:type="dc:Point" x="704" y="119" />
-        <di:waypoint xsi:type="dc:Point" x="704" y="109" />
-        <di:waypoint xsi:type="dc:Point" x="767" y="109" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="674" y="111" width="90" height="6" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNEdge>
       <bpmndi:BPMNShape id="_BPMNShape_EndEvent_59" bpmnElement="EndEvent_2">
         <dc:Bounds x="875" y="176" width="36" height="36" />
         <bpmndi:BPMNLabel>
           <dc:Bounds x="848" y="217" width="90" height="0" />
         </bpmndi:BPMNLabel>
       </bpmndi:BPMNShape>
-      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_4" bpmnElement="SequenceFlow_4" sourceElement="_BPMNShape_SubProcess_8" targetElement="_BPMNShape_EndEvent_59">
-        <di:waypoint xsi:type="dc:Point" x="632" y="194" />
-        <di:waypoint xsi:type="dc:Point" x="813" y="195" />
-        <di:waypoint xsi:type="dc:Point" x="875" y="195" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="677.5" y="176.5" width="90" height="6" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNEdge>
-      <bpmndi:BPMNShape id="_BPMNShape_ExclusiveGateway_19" bpmnElement="ExclusiveGateway_1" isMarkerVisible="true">
-        <dc:Bounds x="455" y="145" width="50" height="50" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="435" y="200" width="90" height="0" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNShape>
-      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_5" bpmnElement="SequenceFlow_5" sourceElement="_BPMNShape_ExclusiveGateway_19" targetElement="_BPMNShape_Task_3">
-        <di:waypoint xsi:type="dc:Point" x="505" y="170" />
-        <di:waypoint xsi:type="dc:Point" x="541" y="170" />
-        <di:waypoint xsi:type="dc:Point" x="541" y="119" />
-        <di:waypoint xsi:type="dc:Point" x="564" y="119" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="496" y="165" width="90" height="6" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNEdge>
-      <bpmndi:BPMNShape id="_BPMNShape_ScriptTask_2" bpmnElement="ScriptTask_1">
-        <dc:Bounds x="555" y="229" width="100" height="80" />
-      </bpmndi:BPMNShape>
-      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_6" bpmnElement="SequenceFlow_6" sourceElement="_BPMNShape_ExclusiveGateway_19" targetElement="_BPMNShape_ScriptTask_2">
-        <di:waypoint xsi:type="dc:Point" x="480" y="195" />
-        <di:waypoint xsi:type="dc:Point" x="480" y="269" />
-        <di:waypoint xsi:type="dc:Point" x="555" y="269" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="391" y="662" width="90" height="6" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNEdge>
-      <bpmndi:BPMNShape id="_BPMNShape_EndEvent_60" bpmnElement="EndEvent_3">
-        <dc:Bounds x="740" y="272" width="36" height="36" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="668" y="685" width="90" height="20" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNShape>
-      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_7" bpmnElement="SequenceFlow_7" sourceElement="_BPMNShape_ScriptTask_2" targetElement="_BPMNShape_EndEvent_60">
-        <di:waypoint xsi:type="dc:Point" x="655" y="269" />
-        <di:waypoint xsi:type="dc:Point" x="680" y="269" />
-        <di:waypoint xsi:type="dc:Point" x="680" y="290" />
-        <di:waypoint xsi:type="dc:Point" x="740" y="290" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="650" y="276.5" width="90" height="6" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNEdge>
       <bpmndi:BPMNShape id="StartEvent_14sl8b4_di" bpmnElement="StartEvent_4">
         <dc:Bounds x="287" y="417" width="36" height="36" />
         <bpmndi:BPMNLabel>
           <dc:Bounds x="260" y="453" width="90" height="20" />
         </bpmndi:BPMNLabel>
       </bpmndi:BPMNShape>
-      <bpmndi:BPMNEdge id="SequenceFlow_1t8nq5v_di" bpmnElement="SequenceFlow_9">
-        <di:waypoint xsi:type="dc:Point" x="323" y="435" />
-        <di:waypoint xsi:type="dc:Point" x="376" y="435" />
-        <di:waypoint xsi:type="dc:Point" x="376" y="435" />
-        <di:waypoint xsi:type="dc:Point" x="407" y="435" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="346" y="425" width="90" height="20" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNEdge>
       <bpmndi:BPMNShape id="EndEvent_1j9tw48_di" bpmnElement="EndEvent_5">
         <dc:Bounds x="883" y="417" width="36" height="36" />
         <bpmndi:BPMNLabel>
           <dc:Bounds x="856" y="453" width="90" height="20" />
         </bpmndi:BPMNLabel>
       </bpmndi:BPMNShape>
-      <bpmndi:BPMNEdge id="SequenceFlow_10jatau_di" bpmnElement="SequenceFlow_8">
+      <bpmndi:BPMNShape id="SubProcess_081736t_di" bpmnElement="SubProcess_3">
-        <di:waypoint xsi:type="dc:Point" x="792" y="435" />
+        <dc:Bounds x="363" y="652" width="100" height="80" />
-        <di:waypoint xsi:type="dc:Point" x="834" y="435" />
+      </bpmndi:BPMNShape>
-        <di:waypoint xsi:type="dc:Point" x="834" y="435" />
+      <bpmndi:BPMNShape id="AdHocSubProcess_0ojckgh_di" bpmnElement="SubProcess_4" isExpanded="false">
-        <di:waypoint xsi:type="dc:Point" x="883" y="435" />
+        <dc:Bounds x="541" y="652" width="100" height="80" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="AdHocSubProcess_128w1vu_di" bpmnElement="SubProcess_2" isExpanded="true">
+        <dc:Bounds x="407" y="335" width="385" height="200" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="SequenceFlow_1s8bqj4_di" bpmnElement="SequenceFlow_11">
+        <di:waypoint x="625" y="437" />
+        <di:waypoint x="683" y="437" />
         <bpmndi:BPMNLabel>
-          <dc:Bounds x="804" y="425" width="90" height="20" />
+          <dc:Bounds x="609" y="412" width="90" height="20" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="SequenceFlow_0gkhyqw_di" bpmnElement="SequenceFlow_10">
+        <di:waypoint x="468" y="389" />
+        <di:waypoint x="496" y="389" />
+        <di:waypoint x="496" y="437" />
+        <di:waypoint x="525" y="437" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="466" y="403" width="90" height="20" />
         </bpmndi:BPMNLabel>
       </bpmndi:BPMNEdge>
       <bpmndi:BPMNShape id="StartEvent_19uwuw1_di" bpmnElement="StartEvent_3">
@@ -219,55 +171,118 @@
       <bpmndi:BPMNShape id="Task_1y93al0_di" bpmnElement="Task_2">
         <dc:Bounds x="525" y="397" width="100" height="80" />
       </bpmndi:BPMNShape>
-      <bpmndi:BPMNEdge id="SequenceFlow_0gkhyqw_di" bpmnElement="SequenceFlow_10">
-        <di:waypoint xsi:type="dc:Point" x="468" y="389" />
-        <di:waypoint xsi:type="dc:Point" x="496" y="389" />
-        <di:waypoint xsi:type="dc:Point" x="496" y="437" />
-        <di:waypoint xsi:type="dc:Point" x="525" y="437" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="466" y="403" width="90" height="20" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNEdge>
       <bpmndi:BPMNShape id="EndEvent_1bmhzoz_di" bpmnElement="EndEvent_4">
         <dc:Bounds x="683" y="419" width="36" height="36" />
         <bpmndi:BPMNLabel>
           <dc:Bounds x="656" y="455" width="90" height="20" />
         </bpmndi:BPMNLabel>
       </bpmndi:BPMNShape>
-      <bpmndi:BPMNEdge id="SequenceFlow_1s8bqj4_di" bpmnElement="SequenceFlow_11">
-        <di:waypoint xsi:type="dc:Point" x="625" y="437" />
-        <di:waypoint xsi:type="dc:Point" x="683" y="437" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="609" y="412" width="90" height="20" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNEdge>
-      <bpmndi:BPMNShape id="SubProcess_081736t_di" bpmnElement="SubProcess_3">
-        <dc:Bounds x="363" y="652" width="100" height="80" />
-      </bpmndi:BPMNShape>
-      <bpmndi:BPMNShape id="StartEvent_17rfv1e_di" bpmnElement="StartEvent_5">
-        <dc:Bounds x="573" y="674" width="36" height="36" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="546" y="710" width="90" height="20" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNShape>
-      <bpmndi:BPMNShape id="AdHocSubProcess_0ojckgh_di" bpmnElement="SubProcess_4" isExpanded="false">
-        <dc:Bounds x="541" y="652" width="100" height="80" />
-      </bpmndi:BPMNShape>
-      <bpmndi:BPMNShape id="AdHocSubProcess_128w1vu_di" bpmnElement="SubProcess_2" isExpanded="true">
-        <dc:Bounds x="407" y="335" width="385" height="200" />
-      </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="SubProcess_0qs6p1k_di" bpmnElement="SubProcess_5" isExpanded="false">
         <dc:Bounds x="716" y="652" width="100" height="80" />
       </bpmndi:BPMNShape>
-      <bpmndi:BPMNShape id="StartEvent_0076vg5_di" bpmnElement="StartEvent_6">
-        <dc:Bounds x="495" y="537" width="36" height="36" />
-        <bpmndi:BPMNLabel>
-          <dc:Bounds x="468" y="573" width="90" height="20" />
-        </bpmndi:BPMNLabel>
-      </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="SubProcess_15na7ob_di" bpmnElement="SubProcess_6" isExpanded="true">
         <dc:Bounds x="398" y="796" width="385" height="200" />
       </bpmndi:BPMNShape>
     </bpmndi:BPMNPlane>
   </bpmndi:BPMNDiagram>
+  <bpmndi:BPMNDiagram>
+    <bpmndi:BPMNPlane bpmnElement="SubProcess_1">
+      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_3" bpmnElement="SequenceFlow_3" sourceElement="_BPMNShape_Task_3" targetElement="_BPMNShape_EndEvent_58">
+        <di:waypoint x="448" y="200" />
+        <di:waypoint x="488" y="200" />
+        <di:waypoint x="488" y="190" />
+        <di:waypoint x="551" y="190" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="674" y="111" width="90" height="6" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_7" bpmnElement="SequenceFlow_7" sourceElement="_BPMNShape_ScriptTask_2" targetElement="_BPMNShape_EndEvent_60">
+        <di:waypoint x="439" y="350" />
+        <di:waypoint x="464" y="350" />
+        <di:waypoint x="464" y="371" />
+        <di:waypoint x="524" y="371" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="650" y="276.5" width="90" height="6" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_6" bpmnElement="SequenceFlow_6" sourceElement="_BPMNShape_ExclusiveGateway_19" targetElement="_BPMNShape_ScriptTask_2">
+        <di:waypoint x="264" y="276" />
+        <di:waypoint x="264" y="350" />
+        <di:waypoint x="339" y="350" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="391" y="662" width="90" height="6" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_5" bpmnElement="SequenceFlow_5" sourceElement="_BPMNShape_ExclusiveGateway_19" targetElement="_BPMNShape_Task_3">
+        <di:waypoint x="289" y="251" />
+        <di:waypoint x="325" y="251" />
+        <di:waypoint x="325" y="200" />
+        <di:waypoint x="348" y="200" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="496" y="165" width="90" height="6" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_2" bpmnElement="SequenceFlow_2" sourceElement="_BPMNShape_StartEvent_27" targetElement="_BPMNShape_ExclusiveGateway_19">
+        <di:waypoint x="216" y="190" />
+        <di:waypoint x="264" y="190" />
+        <di:waypoint x="264" y="226" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="412" y="109" width="90" height="6" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="_BPMNShape_StartEvent_27" bpmnElement="StartEvent_2">
+        <dc:Bounds x="180" y="172" width="36" height="36" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="370" y="132" width="90" height="20" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="_BPMNShape_ExclusiveGateway_19" bpmnElement="ExclusiveGateway_1" isMarkerVisible="true">
+        <dc:Bounds x="239" y="226" width="50" height="50" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="435" y="200" width="90" height="0" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="_BPMNShape_ScriptTask_2" bpmnElement="ScriptTask_1">
+        <dc:Bounds x="339" y="310" width="100" height="80" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="_BPMNShape_Task_3" bpmnElement="Task_1">
+        <dc:Bounds x="348" y="160" width="100" height="80" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="_BPMNShape_EndEvent_58" bpmnElement="EndEvent_1">
+        <dc:Bounds x="551" y="172" width="36" height="36" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="740" y="132" width="90" height="20" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="_BPMNShape_EndEvent_60" bpmnElement="EndEvent_3">
+        <dc:Bounds x="524" y="353" width="36" height="36" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="668" y="685" width="90" height="20" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+    </bpmndi:BPMNPlane>
+  </bpmndi:BPMNDiagram>
+  <bpmndi:BPMNDiagram>
+    <bpmndi:BPMNPlane bpmnElement="SubProcess_3" />
+  </bpmndi:BPMNDiagram>
+  <bpmndi:BPMNDiagram>
+    <bpmndi:BPMNPlane bpmnElement="SubProcess_4">
+      <bpmndi:BPMNShape id="StartEvent_17rfv1e_di" bpmnElement="StartEvent_5">
+        <dc:Bounds x="180" y="160" width="36" height="36" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="546" y="710" width="90" height="20" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+    </bpmndi:BPMNPlane>
+  </bpmndi:BPMNDiagram>
+  <bpmndi:BPMNDiagram>
+    <bpmndi:BPMNPlane bpmnElement="SubProcess_5">
+      <bpmndi:BPMNShape id="StartEvent_0076vg5_di" bpmnElement="StartEvent_6">
+        <dc:Bounds x="180" y="160" width="36" height="36" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="468" y="573" width="90" height="20" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+    </bpmndi:BPMNPlane>
+  </bpmndi:BPMNDiagram>
 </bpmn2:definitions>

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

@@ -229,7 +229,6 @@ describe('features/modeling - collapse and expand elements', function() {
 
     describe('undo', function() {
 
-
       it('collapsed-marker is placed',
         inject(function(elementRegistry, bpmnReplace, commandStack) {
 
@@ -339,32 +338,6 @@ describe('features/modeling - collapse and expand elements', function() {
     );
 
 
-    it('hide all children',
-      inject(function(elementRegistry, bpmnReplace) {
-
-        // given
-        var expandedSubProcess = elementRegistry.get('SubProcess_2');
-        var originalChildren = expandedSubProcess.children.slice();
-
-        // when
-        var collapsedSubProcess = bpmnReplace.replaceElement(expandedSubProcess,
-          {
-            type: 'bpmn:SubProcess',
-            isExpanded: false
-          }
-        );
-
-        // then keep children
-        originalChildren.forEach(function(c) {
-          expect(collapsedSubProcess.children).to.include(c);
-        });
-
-        // and hide them
-        expect(collapsedSubProcess.children).to.satisfy(allHidden());
-      })
-    );
-
-
     it('keep ad-hoc and multiInstance-marker',
       inject(function(elementRegistry, bpmnReplace) {
 
@@ -640,7 +613,7 @@ function childrenHidden(hidden) {
         return child.hidden;
       }
       else {
-        return child.hidden == hidden;
+        return !!child.hidden == hidden;
       }
     });
   };

test/spec/features/replace/BpmnReplaceSpec.js

@@ -324,7 +324,7 @@ describe('features/replace - bpmn replace', function() {
 
 
     beforeEach(inject(function(canvas) {
-      canvas.setActivePlane('SubProcess_Collapsed');
+      canvas.setRootElement(canvas.findRoot('SubProcess_Collapsed_plane'));
     }));