When I use lenis with astro and enable view-transitions I get the following errors in the browser console after scrolling a couple of times :
Too many calls to Location or History APIs within a short timeframe. router.js:8:17
Uncaught DOMException: The operation is insecure.
updateScrollPosition router.js:8
onScrollEnd router.js:409
EventListener.handleEvent* router.js:418
router.js:8
updateScrollPosition router.js:8
onScrollEnd router.js:409
(Async: EventListener.handleEvent)
router.js:418
However, this does not seem to be the case when view transitions is disabled and works fine in safari and chrome
I am using lenis astro and gsap.
<script>
import gsap from 'gsap'
import Lenis from 'lenis'
import ScrollTrigger from 'gsap/ScrollTrigger'
import Flip from 'gsap/Flip'
window.gsap = gsap
gsap.registerPlugin(ScrollTrigger, Flip)
const lenis = new Lenis({
smoothWheel: true,
syncTouch: true,
duration: 1.2,
infinite: false,
easing: (t) => Math.min(1, 1.001 - Math.pow(2, -10 * t))
})
lenis.on('scroll', ScrollTrigger.update)
gsap.ticker.add((time) => {
lenis.raf(time * 1000)
})
gsap.ticker.lagSmoothing(0)
</script>
Pay now to fund the work behind this issue.
Get updates on progress being made.
Maintainer is rewarded once the issue is completed.
You're funding impactful open source efforts
You want to contribute to this effort
You want to get funding like this too