Merge branch 'master' into develop

lib/Viewer.js

@@ -479,6 +479,11 @@ Viewer.prototype.getModules = function() {
  * @method Viewer#clear
  */
 Viewer.prototype.clear = function() {
+  if (!this.getDefinitions()) {
+
+    // no diagram to clear
+    return;
+  }
 
   // remove businessObject#di binding
   //

lib/features/auto-place/AutoPlace.js

@@ -25,6 +25,11 @@ export default function AutoPlace(eventBus, modeling) {
    */
   this.append = function(source, shape) {
 
+    emit('autoPlace.start', {
+      source: source,
+      shape: shape
+    });
+
     // allow others to provide the position
     var position = emit('autoPlace', {
       source: source,
@@ -37,8 +42,8 @@ export default function AutoPlace(eventBus, modeling) {
 
     var newShape = modeling.appendShape(source, shape, position, source.parent);
 
-    // notify interested parties on new shape placed
     emit('autoPlace.end', {
+      source: source,
       shape: newShape
     });
 

lib/features/label-editing/LabelEditingProvider.js

@@ -44,10 +44,10 @@ export default function LabelEditingProvider(
 
   // complete on followup canvas operation
   eventBus.on([
-    'element.mousedown',
+    'autoPlace.start',
-    'drag.init',
     'canvas.viewbox.changing',
-    'autoPlace',
+    'drag.init',
+    'element.mousedown',
     'popupMenu.open'
   ], function(event) {
 

lib/features/snapping/BpmnConnectSnapping.js

@@ -74,11 +74,11 @@ export default function BpmnConnectSnapping(eventBus, rules) {
       // snap source
       context.sourcePosition = mid(source);
 
-      if (isAny(target, ['bpmn:Event', 'bpmn:Gateway'])) {
+      if (isAny(target, [ 'bpmn:Event', 'bpmn:Gateway' ])) {
         snapToPosition(event, mid(target));
       }
 
-      if (is(target, 'bpmn:Task')) {
+      if (isAny(target, [ 'bpmn:Task', 'bpmn:SubProcess' ])) {
         snapToTaskMid(event, target);
       }
 

test/spec/ViewerSpec.js

@@ -1614,6 +1614,25 @@ describe('Viewer', function() {
 
   describe('#clear', function() {
 
+    it('should NOT clear if no diagram', function() {
+
+      // given
+      var viewer = new Viewer({ container: container });
+
+      var eventBus = viewer.get('eventBus');
+
+      var spy = sinon.spy();
+
+      eventBus.on('diagram.clear', spy);
+
+      // when
+      viewer.clear();
+
+      // then
+      expect(spy).not.to.have.been.called;
+    });
+
+
     it('should not throw if diagram is already empty', function() {
 
       // given

test/spec/features/auto-place/AutoPlaceSpec.js

@@ -1,13 +1,19 @@
+/* global sinon */
+
 import {
   bootstrapModeler,
   inject
 } from 'test/TestHelper';
 
 import autoPlaceModule from 'lib/features/auto-place';
+import coreModule from 'lib/core';
+import labelEditingModule from 'lib/features/label-editing';
 import modelingModule from 'lib/features/modeling';
 import selectionModule from 'diagram-js/lib/features/selection';
-import labelEditingModule from 'lib/features/label-editing';
+
-import coreModule from 'lib/core';
+import { getBusinessObject } from '../../../../lib/util/ModelUtil';
+
+import { getMid } from 'diagram-js/lib/layout/LayoutUtil';
 
 
 describe('features/auto-place', function() {
@@ -110,31 +116,52 @@ describe('features/auto-place', function() {
   });
 
 
-  describe('modeling flow', function() {
+  describe('integration', function() {
 
     var diagramXML = require('./AutoPlace.bpmn');
 
     before(bootstrapModeler(diagramXML, {
       modules: [
-        coreModule,
-        modelingModule,
         autoPlaceModule,
-        selectionModule,
+        coreModule,
-        labelEditingModule
+        labelEditingModule,
+        modelingModule,
+        selectionModule
       ]
     }));
 
 
+    it('should complete direct edit on autoPlace', inject(
+      function(autoPlace, directEditing, elementFactory, elementRegistry) {
+
+        // given
+        var element = elementFactory.createShape({ type: 'bpmn:Task' });
+
+        var source = elementRegistry.get('TASK_2');
+
+        directEditing.activate(source);
+
+        directEditing._textbox.content.textContent = 'foo';
+
+        // when
+        autoPlace.append(source, element);
+
+        // then
+        expect(getBusinessObject(source).name).to.equal('foo');
+      }
+    ));
+
+
     it('should select + direct edit on autoPlace', inject(
       function(autoPlace, elementRegistry, elementFactory, selection, directEditing) {
 
         // given
-        var el = elementFactory.createShape({ type: 'bpmn:Task' });
+        var element = elementFactory.createShape({ type: 'bpmn:Task' });
 
         var source = elementRegistry.get('TASK_2');
 
         // when
-        var newShape = autoPlace.append(source, el);
+        var newShape = autoPlace.append(source, element);
 
         // then
         expect(selection.get()).to.eql([ newShape ]);
@@ -230,6 +257,108 @@ describe('features/auto-place', function() {
 
   });
 
+
+  describe('eventbus integration', function() {
+
+    var diagramXML = require('./AutoPlace.bpmn');
+
+    beforeEach(bootstrapModeler(diagramXML, {
+      modules: [
+        autoPlaceModule,
+        coreModule,
+        labelEditingModule,
+        modelingModule,
+        selectionModule
+      ]
+    }));
+
+
+    it('<autoPlace.start>', inject(
+      function(autoPlace, elementFactory, elementRegistry, eventBus) {
+
+        // given
+        var element = elementFactory.createShape({ type: 'bpmn:Task' });
+
+        var source = elementRegistry.get('TASK_2');
+
+        var listener = sinon.spy(function(event) {
+
+          // then
+          expect(event.shape).to.equal(element);
+          expect(event.source).to.equal(source);
+        });
+
+        eventBus.on('autoPlace.start', listener);
+
+        // when
+        autoPlace.append(source, element);
+
+        expect(listener).to.have.been.called;
+      }
+    ));
+
+
+    it('<autoPlace>', inject(
+      function(autoPlace, elementFactory, elementRegistry, eventBus) {
+
+        // given
+        var element = elementFactory.createShape({ type: 'bpmn:Task' });
+
+        var source = elementRegistry.get('TASK_2');
+
+        var listener = sinon.spy(function(event) {
+
+          // then
+          expect(event.shape).to.equal(element);
+          expect(event.source).to.equal(source);
+
+          return {
+            x: 0,
+            y: 0
+          };
+        });
+
+        eventBus.on('autoPlace', listener);
+
+        // when
+        autoPlace.append(source, element);
+
+        expect(listener).to.have.been.called;
+
+        expect(getMid(element)).to.eql({
+          x: 0,
+          y: 0
+        });
+      }
+    ));
+
+
+    it('<autoPlace.end>', inject(
+      function(autoPlace, elementFactory, elementRegistry, eventBus) {
+
+        // given
+        var element = elementFactory.createShape({ type: 'bpmn:Task' });
+
+        var source = elementRegistry.get('TASK_2');
+
+        var listener = sinon.spy(function(event) {
+
+          // then
+          expect(event.shape).to.equal(element);
+          expect(event.source).to.equal(source);
+        });
+
+        eventBus.on('autoPlace.end', listener);
+
+        // when
+        autoPlace.append(source, element);
+
+        expect(listener).to.have.been.called;
+      }
+    ));
+
+  });
+
 });
 
 

test/spec/features/snapping/BpmnConnectSnapping.bpmn

@@ -6,78 +6,86 @@
     <bpmn:participant id="Participant_3" processRef="Process_3" />
   </bpmn:collaboration>
   <bpmn:process id="Process_1" isExecutable="true">
+    <bpmn:subProcess id="SubProcess" />
+    <bpmn:boundaryEvent id="BoundaryEvent_Right" attachedToRef="SubProcess" />
+    <bpmn:boundaryEvent id="BoundaryEvent_Bottom" attachedToRef="SubProcess" />
+    <bpmn:startEvent id="StartEvent_1" />
+    <bpmn:exclusiveGateway id="Gateway_1" />
     <bpmn:endEvent id="EndEvent_1" />
+    <bpmn:task id="Task_1" />
     <bpmn:dataObjectReference id="DataObjectReference_1" dataObjectRef="DataObject_16xfc7e" />
     <bpmn:dataObject id="DataObject_16xfc7e" />
-    <bpmn:exclusiveGateway id="Gateway_1" />
-    <bpmn:subProcess id="SubProcess" />
-    <bpmn:boundaryEvent id="BoundaryEvent" attachedToRef="SubProcess" />
-    <bpmn:boundaryEvent id="BoundaryEventRight" attachedToRef="SubProcess" />
-    <bpmn:startEvent id="StartEvent_1" />
-    <bpmn:task id="Task_1" />
   </bpmn:process>
   <bpmn:process id="Process_2" isExecutable="false">
-    <bpmn:task id="Task_2" />
-    <bpmn:intermediateCatchEvent id="IntermediateCatchEvent_1">
-      <bpmn:messageEventDefinition />
-    </bpmn:intermediateCatchEvent>
     <bpmn:intermediateThrowEvent id="IntermediateThrowEvent_1">
       <bpmn:messageEventDefinition />
     </bpmn:intermediateThrowEvent>
+    <bpmn:intermediateCatchEvent id="IntermediateCatchEvent_1">
+      <bpmn:messageEventDefinition />
+    </bpmn:intermediateCatchEvent>
+    <bpmn:task id="Task_2" />
   </bpmn:process>
   <bpmn:process id="Process_3" isExecutable="false">
     <bpmn:startEvent id="StartEvent_2" />
+    <bpmn:startEvent id="StartEvent_3" />
     <bpmn:task id="Task_3" />
+    <bpmn:subProcess id="SubProcess_1" />
   </bpmn:process>
   <bpmndi:BPMNDiagram id="BPMNDiagram_1">
     <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Collaboration_1">
       <bpmndi:BPMNShape id="Participant_03743bx_di" bpmnElement="Participant_1" isHorizontal="true">
-        <dc:Bounds x="32" y="61.5" width="800" height="383" />
+        <dc:Bounds x="0" y="0" width="800" height="383" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="_BPMNShape_StartEvent_2" bpmnElement="StartEvent_1">
-        <dc:Bounds x="82" y="82" width="36" height="36" />
+        <dc:Bounds x="62" y="32" width="36" height="36" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="EndEvent_1fetlei_di" bpmnElement="EndEvent_1">
-        <dc:Bounds x="182" y="182" width="36" height="36" />
+        <dc:Bounds x="62" y="222" width="36" height="36" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="Task_0ed1rn5_di" bpmnElement="Task_1">
-        <dc:Bounds x="250" y="260" width="100" height="80" />
+        <dc:Bounds x="200" y="200" width="100" height="80" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="DataObjectReference_0pf2ezq_di" bpmnElement="DataObjectReference_1">
-        <dc:Bounds x="382" y="375" width="36" height="50" />
+        <dc:Bounds x="562" y="285" width="36" height="50" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="Participant_1ooemal_di" bpmnElement="Participant_2" isHorizontal="true">
-        <dc:Bounds x="32" y="479" width="600" height="250" />
+        <dc:Bounds x="0" y="420" width="600" height="250" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="Task_0iwlfts_di" bpmnElement="Task_2">
-        <dc:Bounds x="350" y="560" width="100" height="80" />
+        <dc:Bounds x="370" y="510" width="100" height="80" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="IntermediateCatchEvent_08covmw_di" bpmnElement="IntermediateCatchEvent_1">
-        <dc:Bounds x="182" y="582" width="36" height="36" />
+        <dc:Bounds x="162" y="532" width="36" height="36" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="IntermediateThrowEvent_1jsmhky_di" bpmnElement="IntermediateThrowEvent_1">
-        <dc:Bounds x="82" y="582" width="36" height="36" />
+        <dc:Bounds x="52" y="532" width="36" height="36" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="SubProcess_di" bpmnElement="SubProcess" isExpanded="true">
-        <dc:Bounds x="411" y="100" width="350" height="200" />
+        <dc:Bounds x="400" y="30" width="360" height="170" />
       </bpmndi:BPMNShape>
-      <bpmndi:BPMNShape id="BoundaryEvent_di" bpmnElement="BoundaryEvent">
+      <bpmndi:BPMNShape id="BoundaryEvent_di" bpmnElement="BoundaryEvent_Bottom">
-        <dc:Bounds x="582" y="282" width="36" height="36" />
+        <dc:Bounds x="572" y="182" width="36" height="36" />
-      </bpmndi:BPMNShape>
-      <bpmndi:BPMNShape id="BoundaryEventRight_di" bpmnElement="BoundaryEventRight">
-        <dc:Bounds x="743" y="200" width="36" height="36" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="ExclusiveGateway_1nir8te_di" bpmnElement="Gateway_1" isMarkerVisible="true">
-        <dc:Bounds x="299" y="75" width="50" height="50" />
+        <dc:Bounds x="225" y="25" width="50" height="50" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="Participant_0echqt5_di" bpmnElement="Participant_3" isHorizontal="true">
-        <dc:Bounds x="32" y="760" width="600" height="250" />
+        <dc:Bounds x="0" y="710" width="600" height="430" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="StartEvent_0dv3wii_di" bpmnElement="StartEvent_2">
-        <dc:Bounds x="82" y="877" width="36" height="36" />
+        <dc:Bounds x="62" y="827" width="36" height="36" />
       </bpmndi:BPMNShape>
       <bpmndi:BPMNShape id="Task_04e4734_di" bpmnElement="Task_3">
-        <dc:Bounds x="170" y="855" width="100" height="80" />
+        <dc:Bounds x="150" y="805" width="100" height="80" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="StartEvent_0wio031_di" bpmnElement="StartEvent_3">
+        <dc:Bounds x="62" y="1007" width="36" height="36" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="SubProcess_0c0l60x_di" bpmnElement="SubProcess_1" isExpanded="true">
+        <dc:Bounds x="150" y="925" width="350" height="200" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="BoundaryEventRight_di" bpmnElement="BoundaryEvent_Right">
+        <dc:Bounds x="742" y="112" width="36" height="36" />
       </bpmndi:BPMNShape>
     </bpmndi:BPMNPlane>
   </bpmndi:BPMNDiagram>

test/spec/features/snapping/BpmnConnectSnappingSpec.js

@@ -34,115 +34,134 @@ describe('features/snapping - BpmnConnectSnapping', function() {
     dragging.setOptions({ manual: true });
   }));
 
+
   describe('sequence flow', function() {
 
-    describe('connect', function() {
+    describe('boundary event loop', function() {
 
-      describe('Boundary Event loop', function() {
+      it('should snap left',
-
-        it('should snap to the left',
         inject(function(connect, dragging, elementRegistry) {
 
           // given
-            var boundaryEvent = elementRegistry.get('BoundaryEvent'),
+          var boundaryEvent = elementRegistry.get('BoundaryEvent_Bottom'),
               subProcess = elementRegistry.get('SubProcess'),
               subProcessGfx = elementRegistry.getGraphics(subProcess);
 
           // when
-            connect.start(canvasEvent({ x: 600, y: 300 }), boundaryEvent);
+          connect.start(canvasEvent({ x: 590, y: 200 }), boundaryEvent);
 
           dragging.hover({ element: subProcess, gfx: subProcessGfx });
 
-            dragging.move(canvasEvent({ x: 582, y: 300 }));
+          dragging.move(canvasEvent({ x: 400, y: 115 }));
 
           dragging.end();
 
           // then
           var waypoints = boundaryEvent.outgoing[0].waypoints;
 
-            expect(waypoints[3].x).to.eql(560);
+          expect(waypoints).to.have.length(5);
+
+          expect(waypoints[ 4 ].original).to.eql({
+            x: 420,
+            y: 115
+          });
         })
       );
 
 
-        it('should snap to the right',
+      it('should snap bottom',
         inject(function(connect, dragging, elementRegistry) {
 
           // given
-            var boundaryEvent = elementRegistry.get('BoundaryEvent'),
+          var boundaryEvent = elementRegistry.get('BoundaryEvent_Bottom'),
               subProcess = elementRegistry.get('SubProcess'),
               subProcessGfx = elementRegistry.getGraphics(subProcess);
 
           // when
-            connect.start(canvasEvent({ x: 600, y: 300 }), boundaryEvent);
+          connect.start(canvasEvent({ x: 630, y: 200 }), boundaryEvent);
 
           dragging.hover({ element: subProcess, gfx: subProcessGfx });
 
-            dragging.move(canvasEvent({ x: 618, y: 300 }));
+          dragging.move(canvasEvent({ x: 580, y: 115 }));
 
           dragging.end();
 
           // then
           var waypoints = boundaryEvent.outgoing[0].waypoints;
 
-            expect(waypoints[3].x).to.eql(640);
+          expect(waypoints).to.have.length(4);
+
+          expect(waypoints[ 3 ].original).to.eql({
+            x: 550,
+            y: 115
+          });
         })
       );
 
 
-        it('should snap above',
+      it('should snap right',
         inject(function(connect, dragging, elementRegistry) {
 
           // given
-            var boundaryEvent = elementRegistry.get('BoundaryEventRight'),
+          var boundaryEvent = elementRegistry.get('BoundaryEvent_Right'),
               subProcess = elementRegistry.get('SubProcess'),
               subProcessGfx = elementRegistry.getGraphics(subProcess);
 
           // when
-            connect.start(canvasEvent({ x: 761, y: 218 }), boundaryEvent);
+          connect.start(canvasEvent({ x: 760, y: 130 }), boundaryEvent);
 
           dragging.hover({ element: subProcess, gfx: subProcessGfx });
 
-            dragging.move(canvasEvent({ x: 761, y: 200 }));
+          dragging.move(canvasEvent({ x: 580, y: 115 }));
 
           dragging.end();
 
           // then
           var waypoints = boundaryEvent.outgoing[0].waypoints;
 
-            expect(waypoints[3].y).to.eql(178);
+          expect(waypoints).to.have.length(4);
+
+          expect(waypoints[ 3 ].original).to.eql({
+            x: 580,
+            y: 90
+          });
         })
       );
 
 
-        it('should snap below',
+      it('should snap bottom',
         inject(function(connect, dragging, elementRegistry) {
 
           // given
-            var boundaryEvent = elementRegistry.get('BoundaryEventRight'),
+          var boundaryEvent = elementRegistry.get('BoundaryEvent_Right'),
               subProcess = elementRegistry.get('SubProcess'),
               subProcessGfx = elementRegistry.getGraphics(subProcess);
 
           // when
-            connect.start(canvasEvent({ x: 761, y: 218 }), boundaryEvent);
+          connect.start(canvasEvent({ x: 760, y: 130 }), boundaryEvent);
 
           dragging.hover({ element: subProcess, gfx: subProcessGfx });
 
-            dragging.move(canvasEvent({ x: 761, y: 230 }));
+          dragging.move(canvasEvent({ x: 580, y: 200 }));
 
           dragging.end();
 
           // then
           var waypoints = boundaryEvent.outgoing[0].waypoints;
 
-            expect(waypoints[3].y).to.eql(258);
+          expect(waypoints).to.have.length(5);
+
+          expect(waypoints[ 4 ].original).to.eql({
+            x: 580,
+            y: 180
+          });
         })
       );
 
     });
 
 
-      describe('Task target', function() {
+    describe('activity target', function() {
 
       it('should snap to task mid',
         inject(function(connect, dragging, elementRegistry) {
@@ -153,74 +172,60 @@ describe('features/snapping - BpmnConnectSnapping', function() {
               taskGfx = elementRegistry.getGraphics(task);
 
           // when
-            connect.start(canvasEvent({ x: 130, y: 850 }), startEvent);
+          connect.start(canvasEvent({ x: 80, y: 845 }), startEvent);
 
           dragging.hover({ element: task, gfx: taskGfx });
 
-            dragging.move(canvasEvent({ x: 171, y: 893 }));
+          dragging.move(canvasEvent({ x: 200, y: 850 }));
 
           dragging.end();
 
           // then
           var waypoints = startEvent.outgoing[0].waypoints;
 
-            expect(waypoints[waypoints.length-1].y).to.eql(895);
+          expect(waypoints).to.have.length(2);
-          })
-        );
 
-
+          expect(waypoints[ 1 ].original).to.eql({
-        it('should snap to grid point',
+            x: 200,
-          inject(function(connect, dragging, elementRegistry) {
+            y: 845
-
-            // given
-            var startEvent = elementRegistry.get('StartEvent_1'),
-                task = elementRegistry.get('Task_1'),
-                taskGfx = elementRegistry.getGraphics(task);
-
-            // when
-            connect.start(canvasEvent({ x: 210, y: 60 }), startEvent);
-
-            dragging.hover({ element: task, gfx: taskGfx });
-
-            dragging.move(canvasEvent({ x: 300, y: 260 }));
-
-            dragging.end();
-
-            // then
-            var waypoints = startEvent.outgoing[0].waypoints;
-
-            expect(waypoints[3].y).to.eql(270);
-          })
-        );
           });
+        })
+      );
 
 
-      it('should snap event if close to target bounds',
+      it('should snap to sub-process mid',
         inject(function(connect, dragging, elementRegistry) {
 
           // given
-          var boundaryEvent = elementRegistry.get('BoundaryEvent'),
+          var startEvent = elementRegistry.get('StartEvent_3'),
-              subProcess = elementRegistry.get('SubProcess'),
+              subProcess = elementRegistry.get('SubProcess_1'),
               subProcessGfx = elementRegistry.getGraphics(subProcess);
 
           // when
-          connect.start(canvasEvent({ x: 600, y: 300 }), boundaryEvent);
+          connect.start(canvasEvent({ x: 80, y: 1025 }), startEvent);
 
           dragging.hover({ element: subProcess, gfx: subProcessGfx });
 
-          dragging.move(canvasEvent({ x: 400, y: 305 }));
+          dragging.move(canvasEvent({ x: 325, y: 1030 }));
 
           dragging.end();
 
           // then
-          var waypoints = boundaryEvent.outgoing[0].waypoints;
+          var waypoints = startEvent.outgoing[0].waypoints;
 
-          expect(waypoints[3].y).to.eql(280);
+          expect(waypoints).to.have.length(2);
+
+          expect(waypoints[ 1 ].original).to.eql({
+            x: 325,
+            y: 1025
+          });
         })
       );
 
+    });
 
-      it('should snap gateway target mid',
+
+    it('should to snap gateway target mid',
       inject(function(connect, dragging, elementRegistry) {
 
         // given
@@ -229,23 +234,28 @@ describe('features/snapping - BpmnConnectSnapping', function() {
             gatewayGfx = elementRegistry.getGraphics(gateway);
 
         // when
-          connect.start(canvasEvent({ x: 210, y: 60 }), startEvent);
+        connect.start(canvasEvent({ x: 80, y: 50 }), startEvent);
 
         dragging.hover({ element: gateway, gfx: gatewayGfx });
 
-          dragging.move(canvasEvent({ x: 300, y: 80 }));
+        dragging.move(canvasEvent({ x: 255, y: 55 }));
 
         dragging.end();
 
         // then
         var waypoints = startEvent.outgoing[0].waypoints;
 
-          expect(waypoints[1].y).to.eql(100);
+        expect(waypoints).to.have.length(2);
+
+        expect(waypoints[ 1 ].original).to.eql({
+          x: 250,
+          y: 50
+        });
       })
     );
 
 
-      it('should snap event target mid',
+    it('should snap to event target mid',
       inject(function(connect, dragging, elementRegistry) {
 
         // given
@@ -254,23 +264,27 @@ describe('features/snapping - BpmnConnectSnapping', function() {
             endEventGfx = elementRegistry.getGraphics(endEvent);
 
         // when
-          connect.start(canvasEvent({ x: 210, y: 60 }), startEvent);
+        connect.start(canvasEvent({ x: 80, y: 50 }), startEvent);
 
         dragging.hover({ element: endEvent, gfx: endEventGfx });
 
-          dragging.move(canvasEvent({ x: 310, y: 275 }));
+        dragging.move(canvasEvent({ x: 85, y: 245 }));
 
         dragging.end();
 
         // then
         var waypoints = startEvent.outgoing[0].waypoints;
 
-          expect(waypoints[2].y).to.eql(200);
+        expect(waypoints).to.have.length(2);
+
+        expect(waypoints[ 1 ].original).to.eql({
+          x: 80,
+          y: 240
+        });
       })
     );
 
   });
-  });
 
 
   describe('message flow', function() {
@@ -285,18 +299,23 @@ describe('features/snapping - BpmnConnectSnapping', function() {
             intermediateCatchEventGfx = elementRegistry.getGraphics(intermediateCatchEvent);
 
         // when
-        connect.start(canvasEvent({ x: 300, y: 300 }), task);
+        connect.start(canvasEvent({ x: 250, y: 240 }), task);
 
         dragging.hover({ element: intermediateCatchEvent, gfx: intermediateCatchEventGfx });
 
-        dragging.move(canvasEvent({ x: 210, y: 610 }));
+        dragging.move(canvasEvent({ x: 185, y: 555 }));
 
         dragging.end();
 
         // then
         var waypoints = task.outgoing[0].waypoints;
 
-        expect(waypoints[3].original).to.eql({ x: 200, y: 600 });
+        expect(waypoints).to.have.length(4);
+
+        expect(waypoints[ 3 ].original).to.eql({
+          x: 180,
+          y: 550
+        });
       }));
 
     });
@@ -312,19 +331,29 @@ describe('features/snapping - BpmnConnectSnapping', function() {
             taskGfx = elementRegistry.getGraphics(task);
 
         // when
-        connect.start(null, intermediateThrowEvent, { x: 110, y: 610 });
+        connect.start(null, intermediateThrowEvent, { x: 75, y: 555 });
 
         dragging.hover({ element: task, gfx: taskGfx });
 
-        dragging.move(canvasEvent({ x: 310, y: 310 }));
+        dragging.move(canvasEvent({ x: 290, y: 240 }));
 
         dragging.end();
 
         // then
         var waypoints = intermediateThrowEvent.outgoing[0].waypoints;
 
-        expect(waypoints[0].original).to.eql({ x: 100, y: 600 });
+        expect(waypoints).to.have.length(4);
-        expect(waypoints[3].original).to.eql({ x: 310, y: 310 }); // NOT snapped
+
+        expect(waypoints[ 0 ].original).to.eql({
+          x: 70,
+          y: 550
+        });
+
+        // NOT snapped
+        expect(waypoints[ 3 ].original).to.eql({
+          x: 290,
+          y: 240
+        });
       }));
 
 
@@ -336,19 +365,29 @@ describe('features/snapping - BpmnConnectSnapping', function() {
             intermediateCatchEventGfx = elementRegistry.getGraphics(intermediateCatchEvent);
 
         // when
-        connect.start(null, task, { x: 310, y: 310 });
+        connect.start(null, task, { x: 255, y: 245 });
 
         dragging.hover({ element: intermediateCatchEvent, gfx: intermediateCatchEventGfx });
 
-        dragging.move(canvasEvent({ x: 210, y: 610 }));
+        dragging.move(canvasEvent({ x: 185, y: 555 }));
 
         dragging.end();
 
         // then
         var waypoints = task.outgoing[0].waypoints;
 
-        expect(waypoints[0].original).to.eql({ x: 310, y: 310 }); // NOT snapped
+        expect(waypoints).to.have.length(4);
-        expect(waypoints[3].original).to.eql({ x: 200, y: 600 });
+
+        // NOT snapped
+        expect(waypoints[ 0 ].original).to.eql({
+          x: 255,
+          y: 245
+        });
+
+        expect(waypoints[ 3 ].original).to.eql({
+          x: 180,
+          y: 550
+        });
       }));
 
     });