bpmn-js 0.20.7 → 0.21.0

package/test/spec/features/modeling/behavior/DropOnFlowBehaviorSpec.js

@@ -13,7 +13,6 @@ var coreModule = require('../../../../../lib/core'),
 
 var canvasEvent = require('../../../../util/MockEvents').createCanvasEvent;
 
-
 describe('modeling/behavior - drop on connection', function() {
 
   var diagramXML = require('./DropOnFlowBehavior.bpmn');
@@ -150,6 +149,54 @@ describe('modeling/behavior - drop on connection', function() {
         ]));
       }));
 
+
+      it('should connect start -> target -> end (with bendpointBefore inside bbox)',
+        inject(function(modeling, elementRegistry, elementFactory) {
+          // given
+          var taskShape = elementFactory.createShape({ type: 'bpmn:Task' }),
+              sequenceFlow = elementRegistry.get('SequenceFlow_1'),
+              originalWaypoints = sequenceFlow.waypoints,
+              dropPosition = { x: 340, y: 145 }; // 25 pixels below bendpoint
+
+          // when
+          modeling.createShape(taskShape, dropPosition, sequenceFlow);
+
+          // then
+          // split target but don't keep insertion point
+          expect(sequenceFlow).to.have.waypoints(flatten([
+            originalWaypoints.slice(0, 1),
+            { x: 290, y: 120 }
+          ]));
+
+          expect(sequenceFlow).to.have.endDocking({ x: 340, y: 120 });
+        }
+      ));
+
+
+      it('should connect start -> target -> end (with bendpointAfter inside bbox)',
+        inject(function(modeling, elementRegistry, elementFactory) {
+
+           // given
+          var taskShape = elementFactory.createShape({ type: 'bpmn:Task' }),
+              sequenceFlow = elementRegistry.get('SequenceFlow_1'),
+              originalWaypoints = sequenceFlow.waypoints,
+              dropPosition = { x: 340, y: 280 }; // 25 pixels above bendpoint
+
+          // when
+          var newShape = modeling.createShape(taskShape, dropPosition, sequenceFlow),
+              targetConnection = newShape.outgoing[0];
+
+          // then
+          // split target but don't keep insertion point
+          expect(targetConnection).to.have.waypoints(flatten([
+            { x: 390, y: 299 },
+            originalWaypoints.slice(3)
+          ]));
+
+          expect(targetConnection).to.have.startDocking({ x: 340, y: 299 });
+        }
+      ));
+
     });
 
     describe('move', function() {
@@ -216,6 +263,132 @@ describe('modeling/behavior - drop on connection', function() {
       }));
 
 
+      it('should connect start -> target -> end (hovering parent)',
+        inject(function(dragging, move, elementRegistry, selection, canvas) {
+
+          // given
+          var intermediateThrowEvent = elementRegistry.get('IntermediateThrowEvent_foo');
+
+          var startEvent = elementRegistry.get('StartEvent'),
+              sequenceFlow = elementRegistry.get('SequenceFlow_1'),
+              task = elementRegistry.get('Task_1'),
+              rootElement = canvas.getRootElement(),
+              rootElementGfx = elementRegistry.getGraphics(rootElement);
+
+          var originalWaypoints = sequenceFlow.waypoints;
+
+          // when
+          selection.select(intermediateThrowEvent);
+
+          move.start(canvasEvent({ x: 0, y: 0 }), intermediateThrowEvent);
+
+          dragging.hover({
+            element: rootElement,
+            gfx: rootElementGfx
+          });
+
+          dragging.move(canvasEvent({ x: 150, y: 0 }));
+          dragging.end();
+
+          // then
+          var targetConnection = intermediateThrowEvent.outgoing[0];
+
+          // new incoming connection
+          expect(intermediateThrowEvent.incoming.length).to.equal(1);
+          expect(intermediateThrowEvent.incoming[0]).to.eql(sequenceFlow);
+
+          // new outgoing connection
+          expect(intermediateThrowEvent.outgoing.length).to.equal(1);
+          expect(targetConnection).to.be.ok;
+          expect(targetConnection.type).to.equal('bpmn:SequenceFlow');
+
+          expect(startEvent.outgoing[0]).to.equal(intermediateThrowEvent.incoming[0]);
+          expect(task.incoming[0]).to.equal(intermediateThrowEvent.outgoing[0]);
+
+          // split target at insertion point
+          expect(sequenceFlow).to.have.waypoints(flatten([
+            originalWaypoints.slice(0, 2),
+            { x: 341, y: 192 }
+          ]));
+
+          expect(sequenceFlow).to.have.endDocking({ x: 341, y: 210 });
+
+          expect(targetConnection).to.have.waypoints(flatten([
+            { x: 341, y: 228 },
+            originalWaypoints.slice(2)
+          ]));
+
+          expect(targetConnection).to.have.startDocking({ x: 341, y: 210 });
+        }
+      ));
+
+
+      it('should connect start -> target -> end (with bendpointBefore inside bbox)',
+        inject(function(elementRegistry, selection, move, dragging) {
+          // given
+          var task3 = elementRegistry.get('Task_3'),
+              sequenceFlow = elementRegistry.get('SequenceFlow_1'),
+              sequenceFlowGfx = elementRegistry.getGraphics(sequenceFlow),
+              originalWaypoints = sequenceFlow.waypoints;
+
+          // when
+          selection.select(task3);
+
+          move.start(canvasEvent({ x: 0, y: 0 }), task3);
+
+          dragging.hover({
+            element: sequenceFlow,
+            gfx: sequenceFlowGfx
+          });
+
+          dragging.move(canvasEvent({ x: 150, y: -130 }));
+          dragging.end();
+
+          // then
+          // split target but don't keep insertion point
+          expect(sequenceFlow).to.have.waypoints(flatten([
+            originalWaypoints.slice(0, 2),
+            { x: 341, y: 241 }
+          ]));
+
+          expect(sequenceFlow).to.have.endDocking({ x: 341, y: 281 });
+        }
+      ));
+
+
+      it('should connect start -> target -> end (with bendpointAfter inside bbox)',
+        inject(function(elementRegistry, selection, move, dragging) {
+          // given
+          var task3 = elementRegistry.get('Task_3'),
+              sequenceFlow = elementRegistry.get('SequenceFlow_1'),
+              sequenceFlowGfx = elementRegistry.getGraphics(sequenceFlow),
+              originalWaypoints = sequenceFlow.waypoints;
+
+          // when
+          selection.select(task3);
+
+          move.start(canvasEvent({ x: 0, y: 0 }), task3);
+
+          dragging.hover({
+            element: sequenceFlow,
+            gfx: sequenceFlowGfx
+          });
+
+          dragging.move(canvasEvent({ x: 170, y: -110 }));
+          dragging.end();
+
+          // then
+          // split target but don't keep insertion point
+          expect(sequenceFlow).to.have.waypoints(flatten([
+            originalWaypoints.slice(0, 2),
+            { x: 340, y: 261 }
+          ]));
+
+          expect(sequenceFlow).to.have.endDocking({ x: 340, y: 299 });
+        }
+      ));
+
+
       it('should connect start -> target', inject(function(modeling, elementRegistry, selection, move, dragging) {
 
         // given

package/test/spec/features/snapping/BpmnSnapping.sequenceFlow.bpmn

@@ -0,0 +1,41 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<bpmn:definitions xmlns:bpmn="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" id="Definitions_1" targetNamespace="http://bpmn.io/schema/bpmn" exporter="Camunda Modeler" exporterVersion="1.9.0-dev">
+  <bpmn:process id="Process_1" isExecutable="false">
+    <bpmn:startEvent id="StartEvent_1">
+      <bpmn:outgoing>SequenceFlow_1</bpmn:outgoing>
+    </bpmn:startEvent>
+    <bpmn:task id="Task_1">
+      <bpmn:incoming>SequenceFlow_1</bpmn:incoming>
+    </bpmn:task>
+    <bpmn:sequenceFlow id="SequenceFlow_1" sourceRef="StartEvent_1" targetRef="Task_1" />
+    <bpmn:task id="Task_099t40a" />
+  </bpmn:process>
+  <bpmndi:BPMNDiagram id="BPMNDiagram_1">
+    <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Process_1">
+      <bpmndi:BPMNShape id="StartEvent_1oc4unz_di" bpmnElement="StartEvent_1">
+        <dc:Bounds x="70" y="49" width="36" height="36" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="88" y="88" width="0" height="13" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="Task_1ndpsyi_di" bpmnElement="Task_1">
+        <dc:Bounds x="538" y="405" width="100" height="80" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="SequenceFlow_1mpqh64_di" bpmnElement="SequenceFlow_1">
+        <di:waypoint xsi:type="dc:Point" x="106" y="67" />
+        <di:waypoint xsi:type="dc:Point" x="191" y="67" />
+        <di:waypoint xsi:type="dc:Point" x="191" y="134" />
+        <di:waypoint xsi:type="dc:Point" x="304" y="134" />
+        <di:waypoint xsi:type="dc:Point" x="304" y="325" />
+        <di:waypoint xsi:type="dc:Point" x="588" y="325" />
+        <di:waypoint xsi:type="dc:Point" x="588" y="405" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="247.5" y="112.5" width="0" height="13" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="Task_099t40a_di" bpmnElement="Task_099t40a">
+        <dc:Bounds x="118" y="405" width="100" height="80" />
+      </bpmndi:BPMNShape>
+    </bpmndi:BPMNPlane>
+  </bpmndi:BPMNDiagram>
+</bpmn:definitions>

package/test/spec/features/snapping/BpmnSnappingSpec.js

@@ -99,6 +99,72 @@ describe('features/snapping - BpmnSnapping', function() {
   });
 
 
+  describe('on Sequence Flows', function() {
+
+    var diagramXML = require('./BpmnSnapping.sequenceFlow.bpmn');
+
+    beforeEach(bootstrapModeler(diagramXML, {
+      modules: testModules
+    }));
+
+    var sequenceFlow, task;
+
+    beforeEach(inject(function(elementFactory, elementRegistry, dragging) {
+      sequenceFlow = elementRegistry.get('SequenceFlow_1');
+
+      task = elementFactory.createShape({
+        type: 'bpmn:Task'
+      });
+
+      dragging.setOptions({ manual: true });
+    }));
+
+    afterEach(inject(function(dragging) {
+      dragging.setOptions({ manual: false });
+    }));
+
+
+    it('should snap vertically',
+      inject(function(canvas, create, dragging) {
+
+        // given
+        var sequenceFlowGfx = canvas.getGraphics(sequenceFlow);
+
+        // when
+        create.start(canvasEvent({ x: 0, y: 0 }), task);
+
+        dragging.hover({ element: sequenceFlow, gfx: sequenceFlowGfx });
+
+        dragging.move(canvasEvent({ x: 300, y: 245 }));
+        dragging.end();
+
+        // then
+        expect(task.x).to.eql(254);
+      })
+    );
+
+
+    it('should snap horizontally',
+      inject(function(canvas, create, dragging) {
+
+        // given
+        var sequenceFlowGfx = canvas.getGraphics(sequenceFlow);
+
+        // when
+        create.start(canvasEvent({ x: 0, y: 0 }), task);
+
+        dragging.hover({ element: sequenceFlow, gfx: sequenceFlowGfx });
+
+        dragging.move(canvasEvent({ x: 410, y: 320 }));
+        dragging.end();
+
+        // then
+        expect(task.y).to.eql(285);
+      })
+    );
+  });
+
+
   describe('on Participant create', function() {
 
     describe('in non-empty process', function() {