dispatch scrollend event on scroll to immediate

darkroomengineering · Dec 27, 2024 · 743ea7d · 743ea7d
1 parent d74e6c1
commit 743ea7d
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 9 deletions.
diff --git a/packages/core/src/lenis.ts b/packages/core/src/lenis.ts
@@ -260,6 +260,18 @@ export class Lenis {
     }
   }
 
+  private dispatchScrollendEvent = () => {
+    this.options.wrapper.dispatchEvent(
+      new CustomEvent('scrollend', {
+        bubbles: this.options.wrapper === window,
+        // cancelable: false,
+        detail: {
+          lenisScrollEnd: true,
+        },
+      })
+    )
+  }
+
   private setScroll(scroll: number) {
     // behavior: 'instant' bypasses the scroll-behavior CSS property
 
@@ -633,6 +645,10 @@ export class Lenis {
       this.emit()
       onComplete?.(this)
       this.userData = {}
+
+      requestAnimationFrame(() => {
+        this.dispatchScrollendEvent()
+      })
       return
     }
 
@@ -675,15 +691,7 @@ export class Lenis {
           this.userData = {}
 
           requestAnimationFrame(() => {
-            this.options.wrapper.dispatchEvent(
-              new CustomEvent('scrollend', {
-                bubbles: this.options.wrapper === window,
-                // cancelable: false,
-                detail: {
-                  lenisScrollEnd: true,
-                },
-              })
-            )
+            this.dispatchScrollendEvent()
           })
 
           // avoid emitting event twice

diff --git a/playground/core/test.ts b/playground/core/test.ts
@@ -141,6 +141,14 @@ declare global {
 
 // requestAnimationFrame(raf)
 
+const scrollButton = document.getElementById('scroll-100')
+
+scrollButton?.addEventListener('click', () => {
+  lenis.scrollTo(100, {
+    immediate: true,
+  })
+})
+
 // const stopButton = document.getElementById('stop')
 // const startButton = document.getElementById('start')