test(space-tool): rewrite and improve specs

test/spec/features/modeling/SpaceTool.basic.bpmn

@@ -0,0 +1,61 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<bpmn2:definitions xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bpmn2="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" xsi:schemaLocation="http://www.omg.org/spec/BPMN/20100524/MODEL BPMN20.xsd" id="simple" exporter="camunda modeler" exporterVersion="2.6.0" targetNamespace="http://bpmn.io/schema/bpmn">
+  <bpmn2:process id="Process_1" isExecutable="false">
+    <bpmn2:subProcess id="SubProcess_1" name="Sub Process 1">
+      <bpmn2:incoming>SequenceFlow_3</bpmn2:incoming>
+      <bpmn2:outgoing>SequenceFlow_2</bpmn2:outgoing>
+      <bpmn2:startEvent id="StartEvent_1" name="Start Event 1">
+        <bpmn2:outgoing>SequenceFlow_1</bpmn2:outgoing>
+      </bpmn2:startEvent>
+      <bpmn2:task id="Task_1" name="Task">
+        <bpmn2:incoming>SequenceFlow_1</bpmn2:incoming>
+      </bpmn2:task>
+      <bpmn2:sequenceFlow id="SequenceFlow_1" name="" sourceRef="StartEvent_1" targetRef="Task_1"/>
+    </bpmn2:subProcess>
+    <bpmn2:endEvent id="EndEvent_1" name="End Event">
+      <bpmn2:incoming>SequenceFlow_2</bpmn2:incoming>
+    </bpmn2:endEvent>
+    <bpmn2:sequenceFlow id="SequenceFlow_2" name="" sourceRef="SubProcess_1" targetRef="EndEvent_1"/>
+    <bpmn2:startEvent id="StartEvent_2" name="Start">
+      <bpmn2:outgoing>SequenceFlow_3</bpmn2:outgoing>
+    </bpmn2:startEvent>
+    <bpmn2:sequenceFlow id="SequenceFlow_3" name="Flow" sourceRef="StartEvent_2" targetRef="SubProcess_1"/>
+  </bpmn2:process>
+  <bpmndi:BPMNDiagram id="BPMNDiagram_1">
+    <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Process_1">
+      <bpmndi:BPMNShape id="_BPMNShape_SubProcess_2" bpmnElement="SubProcess_1" isExpanded="true">
+        <dc:Bounds height="300.0" width="300.0" x="300.0" y="80.0"/>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="_BPMNShape_StartEvent_2" bpmnElement="StartEvent_1">
+        <dc:Bounds height="36.0" width="36.0" x="352.0" y="242.0"/>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="_BPMNShape_Task_2" bpmnElement="Task_1">
+        <dc:Bounds height="80.0" width="100.0" x="420.0" y="220.0"/>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_1" bpmnElement="SequenceFlow_1" sourceElement="_BPMNShape_StartEvent_2" targetElement="_BPMNShape_Task_2">
+        <di:waypoint xsi:type="dc:Point" x="388.0" y="260.0"/>
+        <di:waypoint xsi:type="dc:Point" x="420.0" y="260.0"/>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="_BPMNShape_EndEvent_2" bpmnElement="EndEvent_1">
+        <dc:Bounds height="36.0" width="36.0" x="650.0" y="212.0"/>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_2" bpmnElement="SequenceFlow_2" sourceElement="_BPMNShape_SubProcess_2" targetElement="_BPMNShape_EndEvent_2">
+        <di:waypoint xsi:type="dc:Point" x="600.0" y="230.0"/>
+        <di:waypoint xsi:type="dc:Point" x="650.0" y="230.0"/>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="_BPMNShape_StartEvent_11" bpmnElement="StartEvent_2">
+        <dc:Bounds height="36.0" width="36.0" x="108.0" y="212.0"/>
+        <bpmndi:BPMNLabel>
+          <dc:Bounds height="0.0" width="0.0" x="126.0" y="253.0"/>
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="BPMNEdge_SequenceFlow_3" bpmnElement="SequenceFlow_3" sourceElement="_BPMNShape_StartEvent_11" targetElement="_BPMNShape_SubProcess_2">
+        <di:waypoint xsi:type="dc:Point" x="144.0" y="230.0"/>
+        <di:waypoint xsi:type="dc:Point" x="300.0" y="230.0"/>
+        <bpmndi:BPMNLabel>
+          <dc:Bounds height="21.0" width="33.0" x="192.0" y="204.0"/>
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+    </bpmndi:BPMNPlane>
+  </bpmndi:BPMNDiagram>
+</bpmn2:definitions>

test/spec/features/modeling/SpaceToolSpec.js

@@ -1,249 +1,229 @@
 import {
   bootstrapModeler,
+  getBpmnJS,
   inject
 } from 'test/TestHelper';
 
+import {
+  createCanvasEvent as canvasEvent
+} from '../../../util/MockEvents';
+
+import {
+  pick
+} from 'min-dash';
+
 import modelingModule from 'lib/features/modeling';
 import coreModule from 'lib/core';
 
+import { isMac } from 'diagram-js/lib/util/Platform';
+
+var invertModifier = isMac() ? { metaKey: true } : { ctrlKey: true };
+
 
 describe('features/modeling - create/remove space', function() {
 
-  var diagramXML = require('../../../fixtures/bpmn/simple.bpmn');
-
-  var testModules = [ coreModule, modelingModule ];
-
-  beforeEach(bootstrapModeler(diagramXML, { modules: testModules }));
-
-
   describe('create space', function() {
 
+    var diagramXML = require('./SpaceTool.basic.bpmn');
 
-    it('should create space to the right', inject(function(elementRegistry, modeling, bpmnFactory) {
+    var testModules = [ coreModule, modelingModule ];
+
+    beforeEach(bootstrapModeler(diagramXML, { modules: testModules }));
+
+
+    it('should create space to the right', inject(function(elementRegistry, spaceTool) {
 
       // given
-      var sequenceFlowElement = elementRegistry.get('SequenceFlow_3'),
+      var sequenceFlow = elementRegistry.get('SequenceFlow_3'),
-          sequenceFlow = sequenceFlowElement.businessObject;
+          subProcess = elementRegistry.get('SubProcess_1'),
+          endEvent = elementRegistry.get('EndEvent_1');
 
-      var subProcessElement = elementRegistry.get('SubProcess_1'),
+      var subProcessPosition_old = getPosition(subProcess),
-          subProcess = subProcessElement.businessObject;
+          endEventPosition_old = getPosition(endEvent);
-
-      var endEventElement = elementRegistry.get('EndEvent_1'),
-          endEvent = endEventElement.businessObject;
-
-
-      var subProcOldPos = {
-        x: subProcessElement.x,
-        y: subProcessElement.y
-      };
-
-      var endEventOldPos = {
-        x: endEventElement.x,
-        y: endEventElement.y
-      };
-
-      var delta = { x: 50, y: 0 },
-          direction = 'e';
 
       // when
-      modeling.createSpace([subProcessElement, endEventElement], [], delta, direction);
+      makeSpace({ x: 270, y: 80 }, { dx: 50 });
 
       // then
-      expect(subProcess.di).to.have.position({
+      expect(subProcess).to.have.diPosition({
-        x: subProcOldPos.x + 50,
+        x: subProcessPosition_old.x + 50,
-        y: subProcOldPos.y
+        y: subProcessPosition_old.y
       });
 
-      expect(endEvent.di).to.have.position({
+      expect(endEvent).to.have.diPosition({
-        x: endEventOldPos.x + 50,
+        x: endEventPosition_old.x + 50,
-        y: endEventOldPos.y
+        y: endEventPosition_old.y
       });
 
-      var diWaypoints = bpmnFactory.createDiWaypoints([
+      expect(sequenceFlow).to.have.diWaypoints([
         { x: 144, y: 230 },
         { x: 350, y: 230 }
       ]);
-
-      expect(sequenceFlow.di.waypoint).eql(diWaypoints);
     }));
 
 
     it('should create space downwards', inject(function(elementRegistry, modeling, bpmnFactory) {
 
       // given
-      var startEventElement = elementRegistry.get('StartEvent_2'),
+      var startEvent = elementRegistry.get('StartEvent_2'),
-          startEvent = startEventElement.businessObject;
+          sequenceFlow = elementRegistry.get('SequenceFlow_3'),
+          subProcess = elementRegistry.get('SubProcess_1'),
+          endEvent = elementRegistry.get('EndEvent_1');
 
-      var sequenceFlowElement = elementRegistry.get('SequenceFlow_3'),
+      var startEventPosition_old = getPosition(startEvent),
-          sequenceFlow = sequenceFlowElement.businessObject;
+          subProcessPosition_old = getPosition(subProcess),
-
+          endEventPosition_old = getPosition(endEvent);
-      var subProcessElement = elementRegistry.get('SubProcess_1'),
-          subProcess = subProcessElement.businessObject;
-
-      var endEventElement = elementRegistry.get('EndEvent_1'),
-          endEvent = endEventElement.businessObject;
-
-      var startEventOldPos = {
-        x: startEventElement.x,
-        y: startEventElement.y
-      };
-
-      var subProcOldPos = {
-        x: subProcessElement.x,
-        y: subProcessElement.y
-      };
-
-      var endEventOldPos = {
-        x: endEventElement.x,
-        y: endEventElement.y
-      };
-
-      var delta = { x: 0, y: 50 },
-          direction = 's';
 
       // when
-      modeling.createSpace([startEventElement ,subProcessElement, endEventElement], [], delta, direction);
+      makeSpace({ x: 330, y: 50 }, { dy: 50 });
 
       // then
-      expect(startEvent.di).to.have.position({
+      expect(startEvent).to.have.diPosition({
-        x: startEventOldPos.x,
+        x: startEventPosition_old.x,
-        y: startEventOldPos.y + 50
+        y: startEventPosition_old.y + 50
       });
 
-      expect(subProcess.di).to.have.position({
+      expect(subProcess).to.have.diPosition({
-        x: subProcOldPos.x,
+        x: subProcessPosition_old.x,
-        y: subProcOldPos.y + 50
+        y: subProcessPosition_old.y + 50
       });
 
-      expect(endEvent.di).to.have.position({
+      expect(endEvent).to.have.diPosition({
-        x: endEventOldPos.x,
+        x: endEventPosition_old.x,
-        y: endEventOldPos.y + 50
+        y: endEventPosition_old.y + 50
       });
 
-      var diWaypoints = bpmnFactory.createDiWaypoints([
+      expect(sequenceFlow).to.have.diWaypoints([
         { x: 144, y: 280 },
         { x: 300, y: 280 }
       ]);
-
-      expect(sequenceFlow.di.waypoint).eql(diWaypoints);
     }));
 
 
     it('should remove space to the left', inject(function(elementRegistry, modeling, bpmnFactory) {
 
       // given
-      var sequenceFlowElement = elementRegistry.get('SequenceFlow_3'),
+      var sequenceFlow = elementRegistry.get('SequenceFlow_3'),
-          sequenceFlow = sequenceFlowElement.businessObject;
+          subProcess = elementRegistry.get('SubProcess_1'),
+          endEvent = elementRegistry.get('EndEvent_1');
 
-      var subProcessElement = elementRegistry.get('SubProcess_1'),
+      var subProcessPosition_old = getPosition(subProcess),
-          subProcess = subProcessElement.businessObject;
+          endEventPosition_old = getPosition(endEvent);
-
-      var endEventElement = elementRegistry.get('EndEvent_1'),
-          endEvent = endEventElement.businessObject;
-
-      var subProcOldPos = {
-        x: subProcessElement.x,
-        y: subProcessElement.y
-      };
-
-      var endEventOldPos = {
-        x: endEventElement.x,
-        y: endEventElement.y
-      };
-
-      var delta = { x: -50, y: 0 },
-          direction = 'w';
 
       // when
-      modeling.createSpace([subProcessElement, endEventElement], [], delta, direction);
+      makeSpace({ x: 280, y: 100 }, { dx: -50 });
 
       // then
-      expect(subProcess.di).to.have.position({
+      expect(subProcess).to.have.diPosition({
-        x: subProcOldPos.x - 50,
+        x: subProcessPosition_old.x - 50,
-        y: subProcOldPos.y
+        y: subProcessPosition_old.y
       });
 
-      expect(endEvent.di).to.have.position({
+      expect(endEvent).to.have.diPosition({
-        x: endEventOldPos.x - 50,
+        x: endEventPosition_old.x - 50,
-        y: endEventOldPos.y
+        y: endEventPosition_old.y
       });
 
-      var diWaypoints = bpmnFactory.createDiWaypoints([
+      expect(sequenceFlow).to.have.diWaypoints([
         { x: 144, y: 230 },
         { x: 250, y: 230 }
       ]);
-
-      expect(sequenceFlow.di.waypoint).eql(diWaypoints);
     }));
 
 
     it('should resize to the right', inject(function(elementRegistry, modeling) {
 
       // given
-      var taskElement = elementRegistry.get('Task_1'),
+      var task = elementRegistry.get('Task_1'),
-          task = taskElement.businessObject;
+          subProcess = elementRegistry.get('SubProcess_1'),
+          endEvent = elementRegistry.get('EndEvent_1');
 
-      var subProcessElement = elementRegistry.get('SubProcess_1'),
+      var subProcessBounds_old = getBounds(subProcess),
-          subProcess = subProcessElement.businessObject;
+          endEventPosition_old = getPosition(endEvent),
-
+          taskPosition_old = getPosition(task);
-      var startEventElement = elementRegistry.get('StartEvent_1'),
-          startEvent = startEventElement.businessObject;
-
-      var startEventElement2 = elementRegistry.get('StartEvent_2'),
-          startEvent2 = startEventElement2.businessObject;
-
-      var subProcOldPos = {
-        x: subProcessElement.x,
-        y: subProcessElement.y,
-        width: subProcessElement.width,
-        height: subProcessElement.height
-      };
-
-      var startEventOldPos2 = {
-        x: startEventElement2.x,
-        y: startEventElement2.y
-      };
-
-      var startEventOldPos = {
-        x: startEventElement.x,
-        y: startEventElement.y
-      };
-
-      var taskOldPos = {
-        x: taskElement.x,
-        y: taskElement.y
-      };
-
-      var delta = { x: 50, y: 0 },
-          direction = 'w';
 
       // when
-      modeling.createSpace([startEventElement, startEventElement2, taskElement], [subProcessElement], delta, direction);
+      makeSpace({ x: 450, y: 100 }, { dx: 50 });
 
       // then
-      expect(subProcess.di).to.have.bounds({
+      expect(subProcess).to.have.diBounds({
-        x: subProcOldPos.x + 50,
+        x: subProcessBounds_old.x,
-        y: subProcOldPos.y,
+        y: subProcessBounds_old.y,
-        width: subProcOldPos.width - 50,
+        width: subProcessBounds_old.width + 50,
-        height: subProcOldPos.height
+        height: subProcessBounds_old.height
       });
 
-      expect(startEvent.di).to.have.position({
+      expect(endEvent).to.have.diPosition({
-        x: startEventOldPos.x + 50,
+        x: endEventPosition_old.x + 50,
-        y: startEventOldPos.y
+        y: endEventPosition_old.y
       });
 
-      expect(startEvent2.di).to.have.position({
+      expect(task).to.have.diPosition(taskPosition_old);
-        x: startEventOldPos2.x + 50,
+    }));
-        y: startEventOldPos2.y
+
+
+    it('should create space to the left', inject(function(elementRegistry, modeling) {
+
+      // given
+      var startEvent = elementRegistry.get('StartEvent_2'),
+          sequenceFlow = elementRegistry.get('SequenceFlow_3'),
+          sequenceFlowLabel = sequenceFlow.label;
+
+      var startEventBounds_old = getBounds(startEvent),
+          sequenceFlowLabelBounds_old = getPosition(sequenceFlowLabel);
+
+      // when
+      makeSpace({ x: 250, y: 100 }, { dx: -50 }, true);
+
+      // then
+      expect(startEvent).to.have.diBounds({
+        x: startEventBounds_old.x - 50,
+        y: startEventBounds_old.y,
+        width: startEventBounds_old.width,
+        height: startEventBounds_old.height
       });
 
-      expect(task.di).to.have.position({
+      expect(sequenceFlowLabel).to.have.position({
-        x: taskOldPos.x + 50,
+        x: sequenceFlowLabelBounds_old.x - 50,
-        y: taskOldPos.y
+        y: sequenceFlowLabelBounds_old.y
       });
     }));
 
   });
 
 });
+
+
+
+// helpers ////////////////
+
+function makeSpace(start, delta, invert) {
+
+  if (delta.dx && delta.dy) {
+    throw new Error('must define either <dx> or <dy>');
+  }
+
+  var modifier = invert ? invertModifier : {};
+
+  var end = {
+    x: start.x + (delta.dx || 0),
+    y: start.y + (delta.dy || 0)
+  };
+
+  return getBpmnJS().invoke(function(spaceTool, dragging) {
+    spaceTool.activateMakeSpace(canvasEvent(start));
+
+    dragging.move(canvasEvent(end, modifier));
+
+    dragging.end();
+  });
+
+}
+
+function getPosition(element) {
+  return pick(element, [ 'x', 'y' ]);
+}
+
+function getBounds(element) {
+  return pick(element, [ 'x', 'y', 'width', 'height' ]);
+}