fix(bpmn-create-connect-preview): override #getConnection

lib/Modeler.js

@@ -19,6 +19,7 @@ import BendpointsModule from 'diagram-js/lib/features/bendpoints';
 import ConnectModule from './features/connect';
 import ContextPadModule from './features/context-pad';
 import CopyPasteModule from './features/copy-paste';
+import CreateModule from './features/create';
 import DistributeElementsModule from './features/distribute-elements';
 import EditorActionsModule from './features/editor-actions';
 import GridSnappingModule from './features/grid-snapping';
@@ -211,6 +212,7 @@ Modeler.prototype._modelingModules = [
   ConnectModule,
   ContextPadModule,
   CopyPasteModule,
+  CreateModule,
   DistributeElementsModule,
   EditorActionsModule,
   GridSnappingModule,

lib/features/create/BpmnCreateConnectPreview.js

@@ -0,0 +1,67 @@
+import inherits from 'inherits';
+
+import CreateConnectPreview from 'diagram-js/lib/features/create/CreateConnectPreview';
+
+/**
+ * Shows connection preview during create.
+ *
+ * @param {Canvas} canvas
+ * @param {BpmnRules} bpmnRules
+ * @param {ElementFactory} elementFactory
+ * @param {EventBus} eventBus
+ * @param {GraphicsFactory} graphicsFactory
+ * @param {didi.Injector} injector
+ */
+export default function BpmnCreateConnectPreview(
+    bpmnRules,
+    canvas,
+    elementFactory,
+    eventBus,
+    graphicsFactory,
+    injector
+) {
+  CreateConnectPreview.call(
+    this,
+    canvas,
+    elementFactory,
+    eventBus,
+    graphicsFactory,
+    injector
+  );
+
+  this._bpmnRules = bpmnRules;
+}
+
+inherits(BpmnCreateConnectPreview, CreateConnectPreview);
+
+BpmnCreateConnectPreview.$inject = [
+  'bpmnRules',
+  'canvas',
+  'elementFactory',
+  'eventBus',
+  'graphicsFactory',
+  'injector'
+];
+
+/**
+ * Get connection that connect source and target once connect is finished.
+ *
+ * @param {Object|boolean} canConnect
+ * @param {djs.model.shape} source
+ * @param {djs.model.shape} target
+ *
+ * @returns {djs.model.connection}
+ */
+BpmnCreateConnectPreview.prototype.getConnection = function(canConnect, source, target) {
+  var attrs = canConnect;
+
+  if (!attrs || !attrs.type) {
+    attrs = this._bpmnRules.canConnect(source, target);
+  }
+
+  if (!attrs) {
+    return;
+  }
+
+  return this._elementFactory.createConnection(attrs);
+};

lib/features/create/index.js

@@ -0,0 +1,8 @@
+import BpmnCreateConnectPreview from './BpmnCreateConnectPreview';
+import CreateModule from 'diagram-js/lib/features/create';
+
+export default {
+  __depends__: [ CreateModule ],
+  __init__: [ 'createConnectPreview' ],
+  createConnectPreview: [ 'type', BpmnCreateConnectPreview ]
+};

test/spec/features/modeling/layout/LayoutConnectionSpec.js

@@ -5,7 +5,7 @@ import {
 
 import modelingModule from 'lib/features/modeling';
 import coreModule from 'lib/core';
-import createModule from 'diagram-js/lib/features/create';
+import createModule from 'lib/features/create';
 
 import {
   createCanvasEvent as canvasEvent
@@ -208,7 +208,12 @@ describe('features/modeling - layout connection', function() {
           var ctx = dragging.context();
           var context = ctx.data.context;
 
-          var connectionPreview = context.getConnection(context.canExecute.connect);
+          var connectionPreview = context.getConnection(
+            context.canExecute.connect,
+            context.source,
+            context.shape
+          );
+
           var waypointsPreview = connectionPreview.waypoints.slice();
 
           dragging.end();