locomotivemtl / locomotive-scroll

🛤 Detection of elements in viewport & smooth scrolling with parallax.
https://locomotivemtl.github.io/locomotive-scroll
MIT License
7.54k stars 1.11k forks source link

Error when updating from v4 to v5 #543

Closed muhamedkarajic closed 3 months ago

muhamedkarajic commented 6 months ago

Describe the bug I'm using Angular 17 with the latest version of locomotive scroll 4.1.4 it was working fine but when updating to version 5 I get following error:

Unable to preventDefault inside passive event listener invocation.
Error from: lenis.modern.mjs:1

To Reproduce I can try to reproduce the error in a fresh Angular project, it might be due to that. However before waisting the time maybe its a known issue but I could not find anything helpful on Google.

Expected behavior I was thinking its something about my website but even when just using the HTML code given in example it still results in the same issue. Ref: https://scroll.locomotive.ca/docs/#/quickstart?id=installation

Screenshots

image

Desktop (please complete the following information):

muhamedkarajic commented 6 months ago

It seems like the error is due to the fact that I'm using

gsap.registerPlugin(ScrollTrigger);
muhamedkarajic commented 6 months ago

Could you maybe provide a guide how to update if we are using ScrollTrigger, such as people wrote in articles like this: https://gsap.com/community/forums/topic/35174-locomotive-scroll-gsap-horizontal-scroll/ https://gsap.com/community/forums/topic/29504-locomotive-scroll-scrolltrigger-issue/

muhamedkarajic commented 3 months ago

Solved it, the solution the following:

const scroll = new LocomotiveScroll();
gsap.registerPlugin(ScrollTrigger);

Before I was registering gsap before I instantiated LocomotiveScroll.