feat(snapping): restore center snapping for Gateways and Events

Closes #1079

lib/features/snapping/BpmnConnectSnapping.js

@@ -13,6 +13,8 @@ import { is } from '../../util/ModelUtil';
 
 import { some } from 'min-dash';
 
+import { isAny } from '../modeling/util/ModelingUtil';
+
 var HIGHER_PRIORITY = 1250;
 
 var BOUNDARY_TO_HOST_THRESHOLD = 40;
@@ -66,9 +68,14 @@ export default function BpmnConnectSnapping(eventBus, rules) {
       // snap source
       context.sourcePosition = mid(source);
 
+      if (isAny(target, ['bpmn:Event', 'bpmn:Gateway'])) {
+        snapToPosition(event, mid(target));
+      }
+
       if (is(source, 'bpmn:BoundaryEvent') && target === source.host) {
         snapBoundaryEventLoop(event, source, target);
       }
+
     } else if (isType(connectionAttrs, 'bpmn:MessageFlow')) {
 
       if (is(source, 'bpmn:Event')) {

test/spec/features/snapping/BpmnConnectSnapping.bpmn

@@ -10,6 +10,7 @@
     <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" />
@@ -61,6 +62,9 @@
       <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" />
+      </bpmndi:BPMNShape>
     </bpmndi:BPMNPlane>
   </bpmndi:BPMNDiagram>
 </bpmn:definitions>

test/spec/features/snapping/BpmnConnectSnappingSpec.js

@@ -165,6 +165,57 @@ describe('features/snapping - BpmnConnectSnapping', function() {
           expect(waypoints[3].y).to.eql(280);
         })
       );
+
+
+      it('should snap gateway target mid',
+        inject(function(connect, dragging, elementRegistry) {
+
+          // given
+          var startEvent = elementRegistry.get('StartEvent_1'),
+              gateway = elementRegistry.get('Gateway_1'),
+              gatewayGfx = elementRegistry.getGraphics(gateway);
+
+          // when
+          connect.start(canvasEvent({ x: 210, y: 60 }), startEvent);
+
+          dragging.hover({ element: gateway, gfx: gatewayGfx });
+
+          dragging.move(canvasEvent({ x: 300, y: 80 }));
+
+          dragging.end();
+
+          // then
+          var waypoints = startEvent.outgoing[0].waypoints;
+
+          expect(waypoints[1].y).to.eql(100);
+        })
+      );
+
+
+      it('should snap event target mid',
+        inject(function(connect, dragging, elementRegistry) {
+
+          // given
+          var startEvent = elementRegistry.get('StartEvent_1'),
+              endEvent = elementRegistry.get('EndEvent_1'),
+              endEventGfx = elementRegistry.getGraphics(endEvent);
+
+          // when
+          connect.start(canvasEvent({ x: 210, y: 60 }), startEvent);
+
+          dragging.hover({ element: endEvent, gfx: endEventGfx });
+
+          dragging.move(canvasEvent({ x: 310, y: 275 }));
+
+          dragging.end();
+
+          // then
+          var waypoints = startEvent.outgoing[0].waypoints;
+
+          expect(waypoints[2].y).to.eql(200);
+        })
+      );
+
     });
   });