chore(snapping): add tests + adjust min participant size
Related to #299
This commit is contained in:
Nico Rehwaldt
parent
a679b8ea31
commit
a04d03da44
|
|
@ -130,7 +130,7 @@ function BpmnSnapping(eventBus, canvas) {
|
|||
}
|
||||
|
||||
if (is(shape, 'bpmn:Participant')) {
|
||||
context.minDimensions = { width: 400, height: 200 };
|
||||
context.minDimensions = { width: 300, height: 150 };
|
||||
context.childrenBoxPadding = {
|
||||
left: 50,
|
||||
right: 35
|
||||
|
|
|
|||
|
|
@ -3,31 +3,48 @@
|
|||
<bpmn:collaboration id="Collaboration_1">
|
||||
<bpmn:participant id="Participant_1" processRef="Process_1" />
|
||||
<bpmn:participant id="Participant_2" processRef="Process_2" />
|
||||
<bpmn:participant id="Participant_3" processRef="Process_3" />
|
||||
</bpmn:collaboration>
|
||||
<bpmn:process id="Process_1" isExecutable="false" />
|
||||
<bpmn:process id="Process_2">
|
||||
<bpmn:subProcess id="SubProcess_1" />
|
||||
<bpmn:textAnnotation id="TextAnnotation_1" />
|
||||
<bpmn:association id="Association_1" sourceRef="SubProcess_1" targetRef="TextAnnotation_1" />
|
||||
<bpmn:textAnnotation id="TextAnnotation_1" />
|
||||
</bpmn:process>
|
||||
<bpmn:process id="Process_3">
|
||||
<bpmn:startEvent id="StartEvent_1" />
|
||||
<bpmn:task id="Task_1" />
|
||||
</bpmn:process>
|
||||
<bpmndi:BPMNDiagram id="BPMNDiagram_1">
|
||||
<bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Collaboration_1">
|
||||
<bpmndi:BPMNShape id="Participant_1_di" bpmnElement="Participant_1">
|
||||
<dc:Bounds x="14" y="10" width="600" height="300" />
|
||||
<dc:Bounds x="624" y="30" width="442" height="234" />
|
||||
</bpmndi:BPMNShape>
|
||||
<bpmndi:BPMNShape id="Participant_2_di" bpmnElement="Participant_2">
|
||||
<dc:Bounds x="14" y="341" width="603" height="332" />
|
||||
<dc:Bounds x="47" y="30" width="506" height="299" />
|
||||
</bpmndi:BPMNShape>
|
||||
<bpmndi:BPMNShape id="SubProcess_1_di" bpmnElement="SubProcess_1" isExpanded="true">
|
||||
<dc:Bounds x="103" y="424" width="350" height="200" />
|
||||
<dc:Bounds x="136" y="113" width="213" height="149" />
|
||||
</bpmndi:BPMNShape>
|
||||
<bpmndi:BPMNShape id="TextAnnotation_1_di" bpmnElement="TextAnnotation_1">
|
||||
<dc:Bounds x="492" y="372" width="100" height="80" />
|
||||
<dc:Bounds x="409" y="62" width="100" height="80" />
|
||||
</bpmndi:BPMNShape>
|
||||
<bpmndi:BPMNEdge id="Association_1_di" bpmnElement="Association_1">
|
||||
<di:waypoint xsi:type="dc:Point" x="453" y="465" />
|
||||
<di:waypoint xsi:type="dc:Point" x="492" y="429" />
|
||||
<di:waypoint xsi:type="dc:Point" x="349" y="154" />
|
||||
<di:waypoint xsi:type="dc:Point" x="409" y="119" />
|
||||
</bpmndi:BPMNEdge>
|
||||
<bpmndi:BPMNShape id="Participant_3_di" bpmnElement="Participant_3">
|
||||
<dc:Bounds x="624" y="290" width="400" height="200" />
|
||||
</bpmndi:BPMNShape>
|
||||
<bpmndi:BPMNShape id="StartEvent_1_di" bpmnElement="StartEvent_1">
|
||||
<dc:Bounds x="721" y="355" width="36" height="36" />
|
||||
<bpmndi:BPMNLabel>
|
||||
<dc:Bounds x="694" y="391" width="90" height="20" />
|
||||
</bpmndi:BPMNLabel>
|
||||
</bpmndi:BPMNShape>
|
||||
<bpmndi:BPMNShape id="Task_1_di" bpmnElement="Task_1">
|
||||
<dc:Bounds x="809" y="333" width="100" height="80" />
|
||||
</bpmndi:BPMNShape>
|
||||
</bpmndi:BPMNPlane>
|
||||
</bpmndi:BPMNDiagram>
|
||||
</bpmn:definitions>
|
||||
|
|
@ -26,150 +26,154 @@ describe('features/snapping - BpmnSnapping', function() {
|
|||
var testModules = [ coreModule, snappingModule, modelingModule, createModule, rulesModule ];
|
||||
|
||||
|
||||
describe('when dropping on non-empty process', function() {
|
||||
describe('on Participant create', function() {
|
||||
|
||||
var diagramXML = require('../../../fixtures/bpmn/collaboration/process.bpmn');
|
||||
describe('in non-empty process', function() {
|
||||
|
||||
beforeEach(bootstrapModeler(diagramXML, { modules: testModules }));
|
||||
var diagramXML = require('../../../fixtures/bpmn/collaboration/process.bpmn');
|
||||
|
||||
beforeEach(bootstrapModeler(diagramXML, { modules: testModules }));
|
||||
|
||||
|
||||
var createEvent;
|
||||
var createEvent;
|
||||
|
||||
beforeEach(inject(function(canvas, dragging) {
|
||||
createEvent = Events.scopedCreate(canvas);
|
||||
dragging.setOptions({ manual: true });
|
||||
}));
|
||||
beforeEach(inject(function(canvas, dragging) {
|
||||
createEvent = Events.scopedCreate(canvas);
|
||||
dragging.setOptions({ manual: true });
|
||||
}));
|
||||
|
||||
|
||||
it('should snap to process children bounds / top left',
|
||||
inject(function(canvas, create, dragging, elementFactory) {
|
||||
it('should snap to process children bounds / top left',
|
||||
inject(function(canvas, create, dragging, elementFactory) {
|
||||
|
||||
// given
|
||||
var participantShape = elementFactory.createParticipantShape(false),
|
||||
rootElement = canvas.getRootElement(),
|
||||
rootGfx = canvas.getGraphics(rootElement);
|
||||
// given
|
||||
var participantShape = elementFactory.createParticipantShape(false),
|
||||
rootElement = canvas.getRootElement(),
|
||||
rootGfx = canvas.getGraphics(rootElement);
|
||||
|
||||
// when
|
||||
create.start(createEvent({ x: 50, y: 50 }), participantShape);
|
||||
// when
|
||||
create.start(createEvent({ x: 50, y: 50 }), participantShape);
|
||||
|
||||
dragging.hover({ element: rootElement, gfx: rootGfx });
|
||||
dragging.hover({ element: rootElement, gfx: rootGfx });
|
||||
|
||||
dragging.move(createEvent({ x: 65, y: 65 }));
|
||||
dragging.end(createEvent({ x: 65, y: 65 }));
|
||||
dragging.move(createEvent({ x: 65, y: 65 }));
|
||||
dragging.end(createEvent({ x: 65, y: 65 }));
|
||||
|
||||
// then
|
||||
expect(bounds(participantShape)).toEqual({
|
||||
width: 600, height: 250, x: 18, y: -8
|
||||
});
|
||||
}));
|
||||
// then
|
||||
expect(bounds(participantShape)).toEqual({
|
||||
width: 600, height: 250, x: 18, y: -8
|
||||
});
|
||||
}));
|
||||
|
||||
|
||||
it('should snap to process children bounds / bottom right',
|
||||
inject(function(canvas, create, dragging, elementFactory) {
|
||||
it('should snap to process children bounds / bottom right',
|
||||
inject(function(canvas, create, dragging, elementFactory) {
|
||||
|
||||
// given
|
||||
var participantShape = elementFactory.createParticipantShape(false),
|
||||
rootElement = canvas.getRootElement(),
|
||||
rootGfx = canvas.getGraphics(rootElement);
|
||||
// given
|
||||
var participantShape = elementFactory.createParticipantShape(false),
|
||||
rootElement = canvas.getRootElement(),
|
||||
rootGfx = canvas.getGraphics(rootElement);
|
||||
|
||||
// when
|
||||
create.start(createEvent({ x: 50, y: 50 }), participantShape);
|
||||
// when
|
||||
create.start(createEvent({ x: 50, y: 50 }), participantShape);
|
||||
|
||||
dragging.hover({ element: rootElement, gfx: rootGfx });
|
||||
dragging.hover({ element: rootElement, gfx: rootGfx });
|
||||
|
||||
dragging.move(createEvent({ x: 400, y: 400 }));
|
||||
dragging.end(createEvent({ x: 400, y: 400 }));
|
||||
dragging.move(createEvent({ x: 400, y: 400 }));
|
||||
dragging.end(createEvent({ x: 400, y: 400 }));
|
||||
|
||||
// then
|
||||
expect(bounds(participantShape)).toEqual({
|
||||
width: 600, height: 250, x: 100, y: 52
|
||||
});
|
||||
}));
|
||||
// then
|
||||
expect(bounds(participantShape)).toEqual({
|
||||
width: 600, height: 250, x: 100, y: 52
|
||||
});
|
||||
}));
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('in empty process', function() {
|
||||
|
||||
var diagramXML = require('../../../fixtures/bpmn/collaboration/process-empty.bpmn');
|
||||
|
||||
beforeEach(bootstrapModeler(diagramXML, { modules: testModules }));
|
||||
|
||||
|
||||
var createEvent;
|
||||
|
||||
beforeEach(inject(function(canvas, dragging) {
|
||||
createEvent = Events.scopedCreate(canvas);
|
||||
dragging.setOptions({ manual: true });
|
||||
}));
|
||||
|
||||
|
||||
it('should not snap', inject(function(canvas, create, dragging, elementFactory) {
|
||||
|
||||
// given
|
||||
var participantShape = elementFactory.createParticipantShape(false),
|
||||
rootElement = canvas.getRootElement(),
|
||||
rootGfx = canvas.getGraphics(rootElement);
|
||||
|
||||
// when
|
||||
create.start(createEvent({ x: 50, y: 50 }), participantShape);
|
||||
|
||||
dragging.hover({ element: rootElement, gfx: rootGfx });
|
||||
|
||||
dragging.move(createEvent({ x: 400, y: 400 }));
|
||||
dragging.end(createEvent({ x: 400, y: 400 }));
|
||||
|
||||
// then
|
||||
expect(bounds(participantShape)).toEqual({
|
||||
x: 100, y: 275, width: 600, height: 250
|
||||
});
|
||||
}));
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('in collaboration', function() {
|
||||
|
||||
var diagramXML = require('../../../fixtures/bpmn/collaboration/collaboration-participant.bpmn');
|
||||
|
||||
beforeEach(bootstrapModeler(diagramXML, { modules: testModules }));
|
||||
|
||||
|
||||
var createEvent;
|
||||
|
||||
beforeEach(inject(function(canvas, dragging) {
|
||||
createEvent = Events.scopedCreate(canvas);
|
||||
dragging.setOptions({ manual: true });
|
||||
}));
|
||||
|
||||
|
||||
it('should not snap', inject(function(canvas, create, dragging, elementFactory) {
|
||||
|
||||
// given
|
||||
var participantShape = elementFactory.createParticipantShape(false),
|
||||
rootElement = canvas.getRootElement(),
|
||||
rootGfx = canvas.getGraphics(rootElement);
|
||||
|
||||
// when
|
||||
create.start(createEvent({ x: 50, y: 50 }), participantShape);
|
||||
|
||||
dragging.hover({ element: rootElement, gfx: rootGfx });
|
||||
|
||||
dragging.move(createEvent({ x: 400, y: 400 }));
|
||||
dragging.end(createEvent({ x: 400, y: 400 }));
|
||||
|
||||
// then
|
||||
expect(bounds(participantShape)).toEqual({
|
||||
x: 100, y: 275, width: 600, height: 250
|
||||
});
|
||||
}));
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('when dropping on empty process', function() {
|
||||
describe('on Participant resize', function () {
|
||||
|
||||
var diagramXML = require('../../../fixtures/bpmn/collaboration/process-empty.bpmn');
|
||||
|
||||
beforeEach(bootstrapModeler(diagramXML, { modules: testModules }));
|
||||
|
||||
|
||||
var createEvent;
|
||||
|
||||
beforeEach(inject(function(canvas, dragging) {
|
||||
createEvent = Events.scopedCreate(canvas);
|
||||
dragging.setOptions({ manual: true });
|
||||
}));
|
||||
|
||||
|
||||
it('should not snap', inject(function(canvas, create, dragging, elementFactory) {
|
||||
|
||||
// given
|
||||
var participantShape = elementFactory.createParticipantShape(false),
|
||||
rootElement = canvas.getRootElement(),
|
||||
rootGfx = canvas.getGraphics(rootElement);
|
||||
|
||||
// when
|
||||
create.start(createEvent({ x: 50, y: 50 }), participantShape);
|
||||
|
||||
dragging.hover({ element: rootElement, gfx: rootGfx });
|
||||
|
||||
dragging.move(createEvent({ x: 400, y: 400 }));
|
||||
dragging.end(createEvent({ x: 400, y: 400 }));
|
||||
|
||||
// then
|
||||
expect(bounds(participantShape)).toEqual({
|
||||
x: 100, y: 275, width: 600, height: 250
|
||||
});
|
||||
}));
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('when dropping on collaboration', function() {
|
||||
|
||||
var diagramXML = require('../../../fixtures/bpmn/collaboration/collaboration-participant.bpmn');
|
||||
|
||||
beforeEach(bootstrapModeler(diagramXML, { modules: testModules }));
|
||||
|
||||
|
||||
var createEvent;
|
||||
|
||||
beforeEach(inject(function(canvas, dragging) {
|
||||
createEvent = Events.scopedCreate(canvas);
|
||||
dragging.setOptions({ manual: true });
|
||||
}));
|
||||
|
||||
|
||||
it('should not snap', inject(function(canvas, create, dragging, elementFactory) {
|
||||
|
||||
// given
|
||||
var participantShape = elementFactory.createParticipantShape(false),
|
||||
rootElement = canvas.getRootElement(),
|
||||
rootGfx = canvas.getGraphics(rootElement);
|
||||
|
||||
// when
|
||||
create.start(createEvent({ x: 50, y: 50 }), participantShape);
|
||||
|
||||
dragging.hover({ element: rootElement, gfx: rootGfx });
|
||||
|
||||
dragging.move(createEvent({ x: 400, y: 400 }));
|
||||
dragging.end(createEvent({ x: 400, y: 400 }));
|
||||
|
||||
// then
|
||||
expect(bounds(participantShape)).toEqual({
|
||||
x: 100, y: 275, width: 600, height: 250
|
||||
});
|
||||
}));
|
||||
|
||||
});
|
||||
|
||||
|
||||
describe('on shape resize', function () {
|
||||
|
||||
var diagramXML = require('../../../fixtures/bpmn/collaboration-resize.bpmn');
|
||||
var diagramXML = require('./BpmnSnapping.collaboration-resize.bpmn');
|
||||
|
||||
var testResizeModules = [ coreModule, resizeModule, rulesModule, snappingModule ];
|
||||
|
||||
|
|
@ -182,31 +186,83 @@ describe('features/snapping - BpmnSnapping', function() {
|
|||
}));
|
||||
|
||||
|
||||
describe('Participant min bounds', function() {
|
||||
describe('snap min bounds', function() {
|
||||
|
||||
it('should snap <se>', inject(function(canvas, elementRegistry, resize, dragging) {
|
||||
it('should snap to children from <se>', inject(function(canvas, elementRegistry, resize, dragging) {
|
||||
|
||||
var participant = elementRegistry.get('Participant_2');
|
||||
|
||||
resize.activate(Events.create(canvas._svg, { x: 500, y: 500 }), participant, 'se');
|
||||
dragging.move(Events.create(canvas._svg, { x: 0, y: 0 }));
|
||||
resize.activate(createEvent({ x: 500, y: 500 }), participant, 'se');
|
||||
dragging.move(createEvent({ x: 0, y: 0 }));
|
||||
dragging.end();
|
||||
|
||||
expect(participant.width).toEqual(400);
|
||||
expect(participant.height).toEqual(200);
|
||||
expect(participant.width).toEqual(497);
|
||||
expect(participant.height).toEqual(252);
|
||||
}));
|
||||
|
||||
|
||||
it('should snap from <nw>', inject(function(canvas, elementRegistry, resize, dragging) {
|
||||
it('should snap to children from <nw>', inject(function(canvas, elementRegistry, resize, dragging) {
|
||||
|
||||
var participant = elementRegistry.get('Participant_2');
|
||||
|
||||
resize.activate(Events.create(canvas._svg, { x: 0, y: 0 }), participant, 'nw');
|
||||
dragging.move(Events.create(canvas._svg, { x: 500, y: 500 }));
|
||||
resize.activate(createEvent({ x: 0, y: 0 }), participant, 'nw');
|
||||
dragging.move(createEvent({ x: 500, y: 500 }));
|
||||
dragging.end();
|
||||
|
||||
expect(participant.width).toEqual(400);
|
||||
expect(participant.height).toEqual(200);
|
||||
expect(participant.width).toEqual(467);
|
||||
expect(participant.height).toEqual(287);
|
||||
}));
|
||||
|
||||
|
||||
it('should snap to min dimensions from <se>', inject(function(canvas, elementRegistry, resize, dragging) {
|
||||
|
||||
var participant = elementRegistry.get('Participant_1');
|
||||
|
||||
resize.activate(createEvent({ x: 500, y: 500 }), participant, 'se');
|
||||
dragging.move(createEvent({ x: 0, y: 0 }));
|
||||
dragging.end();
|
||||
|
||||
expect(participant.width).toEqual(300);
|
||||
expect(participant.height).toEqual(150);
|
||||
}));
|
||||
|
||||
|
||||
it('should snap to min dimensions from <nw>', inject(function(canvas, elementRegistry, resize, dragging) {
|
||||
|
||||
var participant = elementRegistry.get('Participant_1');
|
||||
|
||||
resize.activate(createEvent({ x: 0, y: 0 }), participant, 'nw');
|
||||
dragging.move(createEvent({ x: 500, y: 500 }));
|
||||
dragging.end();
|
||||
|
||||
expect(participant.width).toEqual(300);
|
||||
expect(participant.height).toEqual(150);
|
||||
}));
|
||||
|
||||
|
||||
it('should snap to min dimensions + children from <se>', inject(function(canvas, elementRegistry, resize, dragging) {
|
||||
|
||||
var participant = elementRegistry.get('Participant_3');
|
||||
|
||||
resize.activate(createEvent({ x: 500, y: 500 }), participant, 'se');
|
||||
dragging.move(createEvent({ x: 0, y: 0 }));
|
||||
dragging.end();
|
||||
|
||||
expect(participant.width).toEqual(320);
|
||||
expect(participant.height).toEqual(150);
|
||||
}));
|
||||
|
||||
|
||||
it('should snap to min dimensions + children from <nw>', inject(function(canvas, elementRegistry, resize, dragging) {
|
||||
|
||||
var participant = elementRegistry.get('Participant_3');
|
||||
|
||||
resize.activate(createEvent({ x: 0, y: 0 }), participant, 'nw');
|
||||
dragging.move(createEvent({ x: 500, y: 500 }));
|
||||
dragging.end();
|
||||
|
||||
expect(participant.width).toEqual(353);
|
||||
expect(participant.height).toEqual(177);
|
||||
}));
|
||||
|
||||
});
|
||||
|
|
@ -216,8 +272,8 @@ describe('features/snapping - BpmnSnapping', function() {
|
|||
|
||||
var subProcess = elementRegistry.get('SubProcess_1');
|
||||
|
||||
resize.activate(Events.create(canvas._svg, { x: 453, y: 624 }), subProcess, 'se');
|
||||
dragging.move(Events.create(canvas._svg, { x: -453, y: -624 }));
|
||||
resize.activate(createEvent({ x: 453, y: 624 }), subProcess, 'se');
|
||||
dragging.move(createEvent({ x: -453, y: -624 }));
|
||||
dragging.end();
|
||||
|
||||
expect(subProcess.width).toEqual(140);
|
||||
|
|
@ -229,12 +285,12 @@ describe('features/snapping - BpmnSnapping', function() {
|
|||
|
||||
var participant = elementRegistry.get('Participant_1');
|
||||
|
||||
resize.activate(Events.create(canvas._svg, { x: 614, y: 310 }), participant, 'se');
|
||||
dragging.move(Events.create(canvas._svg, { x: -614, y: -310 }));
|
||||
resize.activate(createEvent({ x: 614, y: 310 }), participant, 'se');
|
||||
dragging.move(createEvent({ x: -614, y: -310 }));
|
||||
dragging.end();
|
||||
|
||||
expect(participant.width).toEqual(400);
|
||||
expect(participant.height).toEqual(200);
|
||||
expect(participant.width).toEqual(300);
|
||||
expect(participant.height).toEqual(150);
|
||||
}));
|
||||
|
||||
|
||||
|
|
@ -242,8 +298,8 @@ describe('features/snapping - BpmnSnapping', function() {
|
|||
|
||||
var textAnnotation = elementRegistry.get('TextAnnotation_1');
|
||||
|
||||
resize.activate(Events.create(canvas._svg, { x: 592, y: 452 }), textAnnotation, 'se');
|
||||
dragging.move(Events.create(canvas._svg, { x: -592, y: -452 }));
|
||||
resize.activate(createEvent({ x: 592, y: 452 }), textAnnotation, 'se');
|
||||
dragging.move(createEvent({ x: -592, y: -452 }));
|
||||
dragging.end();
|
||||
|
||||
expect(textAnnotation.width).toEqual(50);
|
||||
|
|
|
|||
Loading…
Reference in New Issue