fix: fix direction of willChange event when circular (#856)

naver · Mar 29, 2024 · 022546a · 022546a
1 parent 3d52804
commit 022546a
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 3 deletions.
diff --git a/src/control/Control.ts b/src/control/Control.ts
@@ -306,7 +306,7 @@ abstract class Control {
     axesEvent?: OnRelease;
   }) {
     const position = this._getPosition(panel, direction);
-    this._triggerIndexChangeEvent(panel, panel.position, axesEvent);
+    this._triggerIndexChangeEvent(panel, panel.position, axesEvent, direction);
 
     return this._animateToPosition({ position, duration, newActivePanel: panel, axesEvent });
   }
@@ -347,7 +347,7 @@ abstract class Control {
     this._controller = control._controller;
   }
 
-  protected _triggerIndexChangeEvent(panel: Panel, position: number, axesEvent?: OnRelease) {
+  protected _triggerIndexChangeEvent(panel: Panel, position: number, axesEvent?: OnRelease, direction?: ValueOf<typeof DIRECTION>) {
     const flicking = getFlickingAttached(this._flicking);
     const triggeringEvent = panel !== this._activePanel ? EVENTS.WILL_CHANGE : EVENTS.WILL_RESTORE;
     const camera = flicking.camera;
@@ -357,7 +357,7 @@ abstract class Control {
       index: panel.index,
       panel,
       isTrusted: axesEvent?.isTrusted || false,
-      direction: getDirection(activePanel?.position ?? camera.position, position)
+      direction: direction ?? getDirection(activePanel?.position ?? camera.position, position)
     });
 
     this._nextPanel = panel;

diff --git a/test/unit/Flicking.spec.ts b/test/unit/Flicking.spec.ts
@@ -1414,6 +1414,25 @@ describe("Flicking", () => {
         expect(willChangePosition).not.to.equal(0);
         expect(flicking.control.controller.position).to.equal(willChangePosition);
       });
+
+      it("should have correct direction", async () => {
+        const flicking = await createFlicking(El.DEFAULT_HORIZONTAL, { circular: true });
+        const directions = [];
+
+        flicking.on(EVENTS.WILL_CHANGE, evt => {
+          directions.push(evt.direction);
+        });
+        void flicking.prev(500);
+        tick(1000);
+        void flicking.next(500);
+        tick(1000);
+        void flicking.next(500);
+        tick(1000);
+
+        expect(directions[0]).to.equal(DIRECTION.PREV);
+        expect(directions[1]).to.equal(DIRECTION.NEXT);
+        expect(directions[2]).to.equal(DIRECTION.NEXT);
+      });
     });
 
     describe(EVENTS.WILL_RESTORE, () => {