From c49817d90d9a2677c13f49a901614896a281ca15 Mon Sep 17 00:00:00 2001
From: Seonghyun Ahn <ahn3407@naver.com>
Date: Tue, 25 Oct 2022 18:08:17 +0900
Subject: [PATCH] fix: fix preventClickOnDrag option not working when changed
 (#206)

---
 packages/axes/src/inputType/PanInput.ts       | 11 +++----
 .../axes/test/unit/inputType/PanInput.spec.js | 30 +++++++++++++++++++
 2 files changed, 34 insertions(+), 7 deletions(-)

diff --git a/packages/axes/src/inputType/PanInput.ts b/packages/axes/src/inputType/PanInput.ts
index 29c39812..7d510057 100644
--- a/packages/axes/src/inputType/PanInput.ts
+++ b/packages/axes/src/inputType/PanInput.ts
@@ -266,6 +266,7 @@ export class PanInput implements InputType {
   protected _onPanmove(event: InputEventType) {
     const {
       iOSEdgeSwipeThreshold,
+      preventClickOnDrag,
       releaseOnScroll,
       inputKey,
       inputButton,
@@ -339,7 +340,7 @@ export class PanInput implements InputType {
     }
     panEvent.preventSystemEvent = prevent;
     if (prevent && (this._isOverThreshold || distance >= threshold)) {
-      this._dragged = true;
+      this._dragged = preventClickOnDrag;
       this._isOverThreshold = true;
       this._observer.change(this, panEvent, toAxis(this.axes, offset));
     }
@@ -415,9 +416,7 @@ export class PanInput implements InputType {
     this._observer = observer;
     this._enabled = true;
     this._activeEvent = activeEvent;
-    if (this.options.preventClickOnDrag) {
-      element.addEventListener("click", this._preventClickWhenDragged, true);
-    }
+    element.addEventListener("click", this._preventClickWhenDragged, true);
     activeEvent.start.forEach((event) => {
       element.addEventListener(event, this._onPanstart);
     });
@@ -431,9 +430,7 @@ export class PanInput implements InputType {
     const activeEvent = this._activeEvent;
     const element = this.element;
     if (element) {
-      if (this.options.preventClickOnDrag) {
-        element.removeEventListener("click", this._preventClickWhenDragged, true);
-      }
+      element.removeEventListener("click", this._preventClickWhenDragged, true);
       activeEvent?.start.forEach((event) => {
         element.removeEventListener(event, this._onPanstart);
       });
diff --git a/packages/axes/test/unit/inputType/PanInput.spec.js b/packages/axes/test/unit/inputType/PanInput.spec.js
index 56ed4960..9bc2be7e 100644
--- a/packages/axes/test/unit/inputType/PanInput.spec.js
+++ b/packages/axes/test/unit/inputType/PanInput.spec.js
@@ -359,6 +359,36 @@ describe("PanInput", () => {
           }
         );
       });
+
+      it("should apply changes in preventClickOnDrag option after connected", (done) => {
+        // Given
+        const click = sinon.spy();
+        el.addEventListener("click", click);
+        input = new PanInput(el, {
+          inputType: ["touch", "mouse"],
+          preventClickOnDrag: true,
+        });
+        inst.connect(["x", "y"], input);
+        input.options.preventClickOnDrag = false;
+
+        // When
+        Simulator.gestures.pan(
+          el,
+          {
+            pos: [0, 0],
+            deltaX: 50,
+            deltaY: 50,
+            duration: 200,
+            easing: "linear",
+          },
+          () => {
+            el.click();
+            // Then
+            expect(click.called).to.be.true;
+            done();
+          }
+        );
+      });
     });
 
     describe("threshold", () => {