test(interaction-events): add dragging tests

bpmn-io · Jun 21, 2019 · df0cfff · df0cfff
1 parent 60feb45
commit df0cfff
Showing 1 changed file with 104 additions and 11 deletions.
diff --git a/test/spec/features/interaction-events/BpmnInteractionEventsSpec.js b/test/spec/features/interaction-events/BpmnInteractionEventsSpec.js
@@ -17,19 +17,26 @@ import {
   createCanvasEvent as canvasEvent
 } from 'test/util/MockEvents';
 
+
+var testModules = [
+  coreModule,
+  modelingModule,
+  interactionEventsModule,
+  moveModule
+];
+
 describe('features/interaction-events', function() {
 
   describe('participant hits', function() {
 
     var diagramXML = require('test/fixtures/bpmn/collaboration.bpmn');
 
     beforeEach(bootstrapModeler(diagramXML, {
-      modules: [
-        coreModule,
-        modelingModule,
-        interactionEventsModule,
-        moveModule
-      ]
+      modules: testModules
+    }));
+
+    beforeEach(inject(function(dragging) {
+      dragging.setOptions({ manual: true });
     }));
 
 
@@ -61,6 +68,62 @@ describe('features/interaction-events', function() {
     }));
 
 
+    it('should properly handle dragging and drop on participant',
+      inject(function(elementRegistry, move, dragging) {
+
+        // given
+        var participant = elementRegistry.get('Participant_1'),
+            participantGfx = elementRegistry.getGraphics(participant),
+            task = elementRegistry.get('Task_1');
+
+        // when
+        move.start(canvasEvent({ x: task.x, y: task.y }), task);
+
+        dragging.move(canvasEvent({ x: 500, y: 430 }));
+        dragging.hover({ element: participant, gfx: participantGfx });
+
+        // then
+        expect(domQueryAll('.djs-hit', participantGfx)).to.have.lengthOf(2);
+        expect(domQueryAll('.djs-hit-stroke', participantGfx)).to.have.lengthOf(0);
+
+        // when
+        dragging.end();
+
+        // then
+        expect(domQueryAll('.djs-hit', participantGfx)).to.have.lengthOf(2);
+        expect(domQueryAll('.djs-hit-stroke', participantGfx)).to.have.lengthOf(1);
+      })
+    );
+
+
+    it('should properly handle dragging and drop on lane',
+      inject(function(elementRegistry, move, dragging) {
+
+        // given
+        var lane = elementRegistry.get('Lane_2'),
+            laneGfx = elementRegistry.getGraphics(lane),
+            task = elementRegistry.get('Task_1');
+
+        // when
+        move.start(canvasEvent({ x: task.x, y: task.y }), task);
+
+        dragging.move(canvasEvent({ x: lane.x + 50, y: lane.y + 20 }));
+        dragging.hover({ element: lane, gfx: laneGfx });
+
+        // then
+        expect(domQueryAll('.djs-hit', laneGfx)).to.have.lengthOf(2);
+        expect(domQueryAll('.djs-hit-stroke', laneGfx)).to.have.lengthOf(0);
+
+        // when
+        dragging.end();
+
+        // then
+        expect(domQueryAll('.djs-hit', laneGfx)).to.have.lengthOf(2);
+        expect(domQueryAll('.djs-hit-stroke', laneGfx)).to.have.lengthOf(1);
+      })
+    );
+
+
     it('should move the participant when lane\'s hit zone is dragged',
       inject(function(canvas, eventBus, elementRegistry, move, dragging) {
 
@@ -96,11 +159,11 @@ describe('features/interaction-events', function() {
     var diagramXML = require('test/fixtures/bpmn/containers.bpmn');
 
     beforeEach(bootstrapModeler(diagramXML, {
-      modules: [
-        coreModule,
-        modelingModule,
-        interactionEventsModule
-      ]
+      modules: testModules
+    }));
+
+    beforeEach(inject(function(dragging) {
+      dragging.setOptions({ manual: true });
     }));
 
 
@@ -116,5 +179,35 @@ describe('features/interaction-events', function() {
       // then
       expect(hits).to.have.lengthOf(2);
     }));
+
+
+    it('should properly handle dragging',
+      inject(function(elementRegistry, move, dragging) {
+
+        // given
+        var subProcess = elementRegistry.get('SubProcess_1'),
+            subProcessGfx = elementRegistry.getGraphics(subProcess),
+            intermediateEvent = elementRegistry.get('IntermediateThrowEvent_4');
+
+        // when
+        move.start(canvasEvent({
+          x: intermediateEvent.x, y: intermediateEvent.y
+        }), intermediateEvent);
+
+        dragging.move(canvasEvent({ x: 150, y: 50 }));
+        dragging.hover({ element: subProcess, gfx: subProcessGfx });
+
+        // then
+        expect(domQueryAll('.djs-hit', subProcessGfx)).to.have.lengthOf(2);
+        expect(domQueryAll('.djs-hit-stroke', subProcessGfx)).to.have.lengthOf(0);
+
+        // when
+        dragging.end();
+
+        // then
+        expect(domQueryAll('.djs-hit', subProcessGfx)).to.have.lengthOf(2);
+        expect(domQueryAll('.djs-hit-stroke', subProcessGfx)).to.have.lengthOf(1);
+      })
+    );
   });
 });