fix: don't start drag on right click for pointerdown

Author: danielkaradachki

e2e/draggable.js

@@ -40,6 +40,12 @@ describe('Draggable with Pointer events', () => {
             expect(args.pageY).toEqual(200);
         });
 
+        it("does not execute press if the left button is not clicked", () => {
+            pointerdown(el, 100, 200, true, 2);
+
+            expect(handler).not.toHaveBeenCalled();
+        });
+
         it("executes press with originalEvent on pointerdown", () => {
             pointerdown(el, 100, 200);
 

e2e/pointer-util.js

@@ -1,7 +1,8 @@
-const pointerEvent = (type, x, y, isPrimary) =>
+const pointerEvent = (type, x, y, isPrimary = true, button = 0) =>
     new PointerEvent(type, {
         bubbles: true,
         cancellable: true,
+        button: button,
 
         pointerId: 1,
         isPrimary: isPrimary,
@@ -10,15 +11,15 @@ const pointerEvent = (type, x, y, isPrimary) =>
         view: window
     });
 
-export function pointerdown(element, x, y, primary = true) {
-    element.dispatchEvent(pointerEvent("pointerdown", x, y, primary));
+export function pointerdown(element, x, y, primary, button) {
+    element.dispatchEvent(pointerEvent("pointerdown", x, y, primary, button));
 }
 
-export function pointermove(element, x, y, primary = true) {
+export function pointermove(element, x, y, primary, button) {
     element.dispatchEvent(pointerEvent("pointermove", x, y, primary));
 }
 
-export function pointerup(element, x, y, primary = true) {
+export function pointerup(element, x, y, primary, button) {
     element.dispatchEvent(pointerEvent("pointerup", x, y, primary));
 }
 

src/main.js

@@ -99,7 +99,7 @@ export class Draggable {
         };
 
         this._pointerdown = (e) => {
-            if (e.isPrimary) {
+            if (e.isPrimary && e.button === 0) {
                 bind(this._element, "pointermove", this._pointermove);
                 this._touchAction = e.target.style.touchAction;
                 e.target.style.touchAction = "none";