fix(linkTools.Arrowhead): fix to trigger missing paper pointerdown ev…

…ent (#2625)
clientIO · Apr 23, 2024 · a383dee · a383dee
1 parent e13d08f
commit a383dee
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 1 deletion.
diff --git a/packages/joint-core/src/linkTools/Arrowhead.mjs b/packages/joint-core/src/linkTools/Arrowhead.mjs
@@ -48,12 +48,14 @@ const Arrowhead = ToolView.extend({
         evt.stopPropagation();
         evt.preventDefault();
         var relatedView = this.relatedView;
+        var paper = relatedView.paper;
         relatedView.model.startBatch('arrowhead-move', { ui: true, tool: this.cid });
         relatedView.startArrowheadMove(this.arrowheadType);
         this.delegateDocumentEvents();
-        relatedView.paper.undelegateEvents();
+        paper.undelegateEvents();
         this.focus();
         this.el.style.pointerEvents = 'none';
+        relatedView.notifyPointerdown(...paper.getPointerArgs(evt));
     },
     onPointerMove: function(evt) {
         var normalizedEvent = util.normalizeEvent(evt);

diff --git a/packages/joint-core/test/jointjs/dia/linkTools.js b/packages/joint-core/test/jointjs/dia/linkTools.js
@@ -304,6 +304,43 @@ QUnit.module('linkTools', function(hooks) {
         });
     });
 
+    QUnit.module('TargetArrowhead', function() {
 
+        QUnit.test('events', function(assert) {
+
+            const arrowhead = new joint.linkTools.TargetArrowhead();
+            linkView.addTools(new joint.dia.ToolsView({ tools: [arrowhead] }));
+            const listener = new joint.mvc.Listener();
+            const events = [];
+
+            listener.listenTo(paper, {
+                'all': (eventName) => events.push(eventName)
+            });
+
+            // Make sure the link is connected to a target element
+            assert.ok(link.getTargetCell());
+
+            simulate.mousedown({ el: arrowhead.el });
+            simulate.mousemove({ el: paper.el });
+            simulate.mouseup({ el: paper.el });
+
+            assert.deepEqual(
+                events.filter((event) => event !== 'render:done'),
+                [
+                    'cell:pointerdown',
+                    'link:pointerdown',
+                    'cell:pointermove',
+                    'link:pointermove',
+                    'link:disconnect',
+                    'link:pointerup',
+                    'cell:pointerup',
+                    'cell:mouseleave',
+                    'link:mouseleave',
+                ]
+            );
+
+            listener.stopListening();
+        });
+    });
 
 });