499 lines
14 KiB
JavaScript
499 lines
14 KiB
JavaScript
import {
|
|
bootstrapModeler,
|
|
inject
|
|
} from 'test/TestHelper';
|
|
|
|
import modelingModule from 'lib/features/modeling';
|
|
import coreModule from 'lib/core';
|
|
|
|
import bendpointsModule from 'diagram-js/lib/features/bendpoints';
|
|
import connectionPreviewModule from 'diagram-js/lib/features/connection-preview';
|
|
import connectModule from 'diagram-js/lib/features/connect';
|
|
import createModule from 'diagram-js/lib/features/create';
|
|
|
|
import {
|
|
createCanvasEvent as canvasEvent
|
|
} from '../../../../util/MockEvents';
|
|
|
|
|
|
var testModules = [
|
|
bendpointsModule,
|
|
connectionPreviewModule,
|
|
connectModule,
|
|
coreModule,
|
|
createModule,
|
|
modelingModule
|
|
];
|
|
|
|
|
|
describe('features/modeling - layout connection', function() {
|
|
|
|
var diagramXML = require('../../../../fixtures/bpmn/sequence-flows.bpmn');
|
|
|
|
beforeEach(bootstrapModeler(diagramXML, {
|
|
modules: testModules
|
|
}));
|
|
|
|
|
|
describe('should not touch already layouted', function() {
|
|
|
|
it('execute', inject(function(elementRegistry, modeling, bpmnFactory) {
|
|
|
|
// given
|
|
var sequenceFlowConnection = elementRegistry.get('SequenceFlow_1'),
|
|
sequenceFlow = sequenceFlowConnection.businessObject;
|
|
|
|
var expectedWaypoints = sequenceFlowConnection.waypoints;
|
|
|
|
// when
|
|
modeling.layoutConnection(sequenceFlowConnection);
|
|
|
|
// then
|
|
|
|
// expect cropped, repaired connection
|
|
// that was not actually modified
|
|
|
|
expect(sequenceFlowConnection.waypoints).to.eql(expectedWaypoints);
|
|
|
|
// expect cropped waypoints in di
|
|
var diWaypoints = bpmnFactory.createDiWaypoints(expectedWaypoints);
|
|
|
|
expect(sequenceFlow.di.waypoint).eql(diWaypoints);
|
|
}));
|
|
|
|
|
|
it('undo', inject(function(elementRegistry, commandStack, modeling) {
|
|
|
|
// given
|
|
var sequenceFlowConnection = elementRegistry.get('SequenceFlow_1'),
|
|
sequenceFlow = sequenceFlowConnection.businessObject;
|
|
|
|
var oldWaypoints = sequenceFlowConnection.waypoints,
|
|
oldDiWaypoints = sequenceFlow.di.waypoint;
|
|
|
|
modeling.layoutConnection(sequenceFlowConnection);
|
|
|
|
// when
|
|
commandStack.undo();
|
|
|
|
// then
|
|
expect(sequenceFlowConnection.waypoints).eql(oldWaypoints);
|
|
expect(sequenceFlow.di.waypoint).eql(oldDiWaypoints);
|
|
}));
|
|
|
|
|
|
it('redo', inject(function(elementRegistry, commandStack, modeling) {
|
|
|
|
// given
|
|
var sequenceFlowConnection = elementRegistry.get('SequenceFlow_1'),
|
|
sequenceFlow = sequenceFlowConnection.businessObject;
|
|
|
|
modeling.layoutConnection(sequenceFlowConnection);
|
|
|
|
var newWaypoints = sequenceFlowConnection.waypoints,
|
|
newDiWaypoints = sequenceFlow.di.waypoint;
|
|
|
|
// when
|
|
commandStack.undo();
|
|
commandStack.redo();
|
|
|
|
// then
|
|
expect(sequenceFlowConnection.waypoints).eql(newWaypoints);
|
|
expect(sequenceFlow.di.waypoint).eql(newDiWaypoints);
|
|
}));
|
|
|
|
});
|
|
|
|
|
|
it('should remove un-needed waypoints', inject(function(elementRegistry, modeling) {
|
|
|
|
// given
|
|
var taskShape = elementRegistry.get('Task_2'),
|
|
sequenceFlowConnection = elementRegistry.get('SequenceFlow_1');
|
|
|
|
// when
|
|
// moving task
|
|
modeling.moveElements([ taskShape ], { x: 250, y: -95 });
|
|
|
|
// then
|
|
var newWaypoints = sequenceFlowConnection.waypoints;
|
|
|
|
expect(newWaypoints.map(toPoint)).to.eql([
|
|
{ x: 578, y: 341 },
|
|
{ x: 982, y: 341 }
|
|
]);
|
|
}));
|
|
|
|
|
|
describe('integration', function() {
|
|
|
|
describe('re-connection', function() {
|
|
|
|
it('should correctly layout after start re-connection', inject(function(elementRegistry, modeling) {
|
|
|
|
// given
|
|
var task1 = elementRegistry.get('Task_1'),
|
|
connection = elementRegistry.get('SequenceFlow_1'),
|
|
docking = { x: 292, y: 376 };
|
|
|
|
// when
|
|
modeling.reconnectStart(connection, task1, docking);
|
|
|
|
// then
|
|
var waypoints = connection.waypoints,
|
|
i,
|
|
first,
|
|
second;
|
|
|
|
for (i = 0; i < waypoints.length - 1; i++) {
|
|
first = waypoints[i];
|
|
second = waypoints[i + 1];
|
|
|
|
expect(areOnSameAxis(first, second), 'points are on different axes').to.be.true;
|
|
}
|
|
|
|
}));
|
|
|
|
|
|
it('should correctly layout after end re-connection', inject(function(elementRegistry, modeling) {
|
|
|
|
// given
|
|
var task1 = elementRegistry.get('Task_1'),
|
|
connection = elementRegistry.get('SequenceFlow_1'),
|
|
docking = { x: 292, y: 376 };
|
|
|
|
// when
|
|
modeling.reconnectEnd(connection, task1, docking);
|
|
|
|
// then
|
|
var waypoints = connection.waypoints,
|
|
i,
|
|
first,
|
|
second;
|
|
|
|
for (i = 0; i < waypoints.length - 1; i++) {
|
|
first = waypoints[i];
|
|
second = waypoints[i + 1];
|
|
|
|
expect(areOnSameAxis(first, second), 'points are on different axes').to.be.true;
|
|
}
|
|
|
|
}));
|
|
|
|
});
|
|
|
|
|
|
describe('connection preview', function() {
|
|
|
|
var task;
|
|
|
|
beforeEach(inject(function(elementFactory, dragging) {
|
|
task = elementFactory.createShape({
|
|
type: 'bpmn:Task'
|
|
});
|
|
|
|
dragging.setOptions({ manual: true });
|
|
}));
|
|
|
|
afterEach(inject(function(dragging) {
|
|
dragging.setOptions({ manual: false });
|
|
}));
|
|
|
|
|
|
it.skip('should correctly lay out connection preview on create',
|
|
inject(function(canvas, create, dragging, elementRegistry) {
|
|
|
|
// given
|
|
var rootShape = canvas.getRootElement(),
|
|
rootShapeGfx = canvas.getGraphics(rootShape),
|
|
task1 = elementRegistry.get('Task_1');
|
|
|
|
// when
|
|
create.start(canvasEvent({ x: 0, y: 0 }), task, task1);
|
|
|
|
dragging.move(canvasEvent({ x: 175, y: 175 }));
|
|
dragging.hover({ element: rootShape, gfx: rootShapeGfx });
|
|
dragging.move(canvasEvent({ x: 200, y: 200 }));
|
|
|
|
var ctx = dragging.context();
|
|
var context = ctx.data.context;
|
|
|
|
var connectionPreview = context.getConnection(
|
|
context.canExecute.connect,
|
|
context.source,
|
|
context.shape
|
|
);
|
|
|
|
var waypointsPreview = connectionPreview.waypoints.slice();
|
|
|
|
dragging.end();
|
|
|
|
// then
|
|
expect(task1.outgoing[0]).to.exist;
|
|
expect(task1.outgoing[0].waypoints).to.deep.eql(waypointsPreview);
|
|
})
|
|
);
|
|
|
|
|
|
it('should correctly lay out new connection preview',
|
|
inject(function(connect, dragging, elementRegistry) {
|
|
|
|
// given
|
|
var task1 = elementRegistry.get('Task_1'),
|
|
task2 = elementRegistry.get('Task_2');
|
|
|
|
// when
|
|
connect.start(canvasEvent({ x: 0, y: 0 }), task1);
|
|
|
|
dragging.move(canvasEvent({ x: 760, y: 420 }));
|
|
dragging.hover({ element: task2 });
|
|
dragging.move(canvasEvent({ x: 782, y: 436 }));
|
|
|
|
var ctx = dragging.context();
|
|
var context = ctx.data.context;
|
|
|
|
var connectionPreview = context.getConnection(
|
|
context.canExecute,
|
|
context.source,
|
|
context.target
|
|
);
|
|
|
|
var waypointsPreview = connectionPreview.waypoints.slice();
|
|
|
|
dragging.end();
|
|
|
|
// then
|
|
expect(task1.outgoing[0]).to.exist;
|
|
expect(task1.outgoing[0].waypoints).to.deep.eql(waypointsPreview);
|
|
})
|
|
);
|
|
|
|
|
|
it('should correctly lay out connection preview on reconnect start',
|
|
inject(function(canvas, bendpointMove, dragging, elementRegistry) {
|
|
|
|
// given
|
|
var task1 = elementRegistry.get('Task_1'),
|
|
task1Gfx = canvas.getGraphics(task1),
|
|
sequenceFlow2 = elementRegistry.get('SequenceFlow_2');
|
|
|
|
// when
|
|
bendpointMove.start(canvasEvent({ x: 0, y: 0 }), sequenceFlow2, 0);
|
|
|
|
dragging.move(canvasEvent({ x: 230, y: 360 }));
|
|
dragging.hover({ element: task1, gfx: task1Gfx });
|
|
dragging.move(canvasEvent({ x: 248, y: 382 }));
|
|
|
|
var ctx = dragging.context();
|
|
var context = ctx.data.context;
|
|
|
|
var connectionPreview = context.getConnection(
|
|
context.allowed,
|
|
context.source,
|
|
context.target
|
|
);
|
|
|
|
var waypointsPreview = connectionPreview.waypoints.slice();
|
|
|
|
dragging.end();
|
|
|
|
// then
|
|
expect(task1.outgoing[0]).to.exist;
|
|
expect(task1.outgoing[0].waypoints).to.deep.eql(waypointsPreview);
|
|
})
|
|
);
|
|
|
|
|
|
it('should correctly lay out connection preview on reconnect end',
|
|
inject(function(canvas, bendpointMove, dragging, elementRegistry) {
|
|
|
|
// given
|
|
var task1 = elementRegistry.get('Task_1'),
|
|
task1Gfx = canvas.getGraphics(task1),
|
|
sequenceFlow2 = elementRegistry.get('SequenceFlow_2');
|
|
|
|
// when
|
|
bendpointMove.start(canvasEvent({ x: 0, y: 0 }), sequenceFlow2, 2);
|
|
|
|
dragging.move(canvasEvent({ x: 230, y: 360 }));
|
|
dragging.hover({ element: task1, gfx: task1Gfx });
|
|
dragging.move(canvasEvent({ x: 248, y: 382 }));
|
|
|
|
var ctx = dragging.context();
|
|
var context = ctx.data.context;
|
|
|
|
var connectionPreview = context.getConnection(
|
|
context.allowed,
|
|
context.source,
|
|
context.target
|
|
);
|
|
|
|
var waypointsPreview = connectionPreview.waypoints.slice();
|
|
|
|
dragging.end();
|
|
|
|
// then
|
|
expect(task1.incoming[0]).to.exist;
|
|
expect(task1.incoming[0].waypoints).to.deep.eql(waypointsPreview);
|
|
})
|
|
);
|
|
|
|
|
|
it('should correctly lay out connection preview on inserted bendpoint move',
|
|
inject(function(bendpointMove, dragging, elementRegistry) {
|
|
|
|
// given
|
|
var task2 = elementRegistry.get('Task_2'),
|
|
sequenceFlow1 = elementRegistry.get('SequenceFlow_1');
|
|
|
|
// when
|
|
bendpointMove.start(canvasEvent({ x: 700, y: 341 }), sequenceFlow1, 1, true);
|
|
|
|
dragging.move(canvasEvent({ x: 700, y: 400 }));
|
|
|
|
var ctx = dragging.context();
|
|
var context = ctx.data.context;
|
|
|
|
var connectionPreview = context.getConnection(context.allowed);
|
|
|
|
var waypointsPreview = connectionPreview.waypoints.slice();
|
|
|
|
dragging.end();
|
|
|
|
// then
|
|
expect(task2.incoming[0]).to.exist;
|
|
expect(task2.incoming[0].waypoints).to.deep.eql(waypointsPreview);
|
|
})
|
|
);
|
|
|
|
|
|
it('should correctly lay out connection preview on existing bendpoint move',
|
|
inject(function(bendpointMove, dragging, elementRegistry) {
|
|
|
|
// given
|
|
var task2 = elementRegistry.get('Task_2'),
|
|
sequenceFlow1 = elementRegistry.get('SequenceFlow_1');
|
|
|
|
// when
|
|
bendpointMove.start(canvasEvent({ x: 934, y: 341 }), sequenceFlow1, 1);
|
|
|
|
dragging.move(canvasEvent({ x: 960, y: 340 }));
|
|
|
|
var ctx = dragging.context();
|
|
var context = ctx.data.context;
|
|
|
|
var connectionPreview = context.getConnection(context.allowed);
|
|
|
|
var waypointsPreview = connectionPreview.waypoints.slice();
|
|
|
|
dragging.end();
|
|
|
|
// then
|
|
expect(task2.incoming[0]).to.exist;
|
|
expect(task2.incoming[0].waypoints).to.deep.eql(waypointsPreview);
|
|
})
|
|
);
|
|
});
|
|
|
|
|
|
describe('connection preview with connection type replacement', function() {
|
|
|
|
var diagramXML = require('test/spec/features/modeling/behavior/ReplaceConnectionBehavior.message-sequence-flow.bpmn');
|
|
|
|
beforeEach(inject(function(dragging) {
|
|
dragging.setOptions({ manual: true });
|
|
}));
|
|
|
|
afterEach(inject(function(dragging) {
|
|
dragging.setOptions({ manual: false });
|
|
}));
|
|
|
|
beforeEach(bootstrapModeler(diagramXML, {
|
|
modules: testModules
|
|
}));
|
|
|
|
|
|
it('should correctly lay out connection preview when reconnecting with replacement',
|
|
inject(function(canvas, bendpointMove, dragging, elementRegistry) {
|
|
|
|
// given
|
|
var participant2 = elementRegistry.get('Participant_2'),
|
|
participant2Gfx = canvas.getGraphics(participant2),
|
|
sequenceFlow1 = elementRegistry.get('SequenceFlow_1');
|
|
|
|
// when
|
|
bendpointMove.start(canvasEvent(sequenceFlow1.waypoints[1]), sequenceFlow1, 1);
|
|
|
|
dragging.move(canvasEvent({ x: participant2.x + 100, y: participant2.y + 10 }));
|
|
dragging.hover({ element: participant2, gfx: participant2Gfx });
|
|
dragging.move(canvasEvent({ x: participant2.x + 105, y: participant2.y + 10 }));
|
|
|
|
|
|
var ctx = dragging.context();
|
|
var context = ctx.data.context;
|
|
|
|
var connectionPreview = context.getConnection(context.allowed);
|
|
|
|
var waypointsPreview = connectionPreview.waypoints.slice();
|
|
|
|
dragging.end();
|
|
|
|
var newWaypoints = participant2.incoming.slice(-1)[0].waypoints;
|
|
|
|
// then
|
|
expect(newWaypoints).to.exist;
|
|
expect(newWaypoints).to.deep.eql(waypointsPreview);
|
|
})
|
|
);
|
|
});
|
|
|
|
|
|
describe('attaching event', function() {
|
|
|
|
var diagramXML = require('test/spec/features/rules/BpmnRules.attaching.bpmn');
|
|
|
|
beforeEach(bootstrapModeler(diagramXML, {
|
|
modules: testModules
|
|
}));
|
|
|
|
|
|
it('should correctly lay out connection after replacement',
|
|
inject(function(elementRegistry, modeling) {
|
|
|
|
// given
|
|
var event = elementRegistry.get('IntermediateThrowEventWithConnections'),
|
|
parent = elementRegistry.get('SubProcess_1');
|
|
|
|
// when
|
|
modeling.moveElements([ event ], { x: 0, y: -90 }, parent, { attach: true });
|
|
|
|
// then
|
|
var boundaryEvent = elementRegistry.get('IntermediateThrowEventWithConnections');
|
|
|
|
expect(boundaryEvent.outgoing[0]).to.have.waypoints([
|
|
{ x: 769, y: 297 },
|
|
{ x: 769, y: 369 },
|
|
{ x: 837, y: 369 }
|
|
]);
|
|
})
|
|
);
|
|
|
|
});
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
// helpers //////////////////////
|
|
|
|
function toPoint(p) {
|
|
return {
|
|
x: p.x,
|
|
y: p.y
|
|
};
|
|
}
|
|
|
|
function areOnSameAxis(a, b) {
|
|
return a.x === b.x || a.y === b.y;
|
|
} |