Throws Error with Astro View Transitions in Firefox

[JoyBoy-369]

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>

Minimal Repo

Developer Tools — Astro Framework React Example (forked) - StackBlitz — https://stackblitz.com/edit/github-2hpcon-pl262h?file=src/components/Layout.astro,astro.config.mjs,src/pages/index.astro,package.json - 6 June 2024 - Watch Video

[clementroche]

Do you have the same error if you remove Lenis ? It doesn't seems to be related with Lenis at all.

[JoyBoy-369]

@clementroche Nope. I don't get the same error if I remove Lenis. I have put a minimal repo too if you would like to test it out. There is no error if I remove View Transitions too. There seems to be some issue with astro's View Transition but only in firefox

[clementroche]

I can't reproduce your issue using your link on Firefox. Lenis doesn't deal with history or location at all so it might come from your implementation.

https://github.com/livewire/livewire/discussions/7746

[JoyBoy-369]

This seems to be in regard to the Astro's View Transition, not Lenis per say. So I should ask the folk at astro for this issue?

[clementroche]

I think so

[clementroche]

I'm closing this issue for lack of activity reasons

[titouan-pellerin]

Hi there,

The issue seems to be caused by the scrollend event being fired too frequently by Lenis. I'm not sure if this is something that can be addressed on Lenis's side, but there is a simple (albeit dirty) workaround.

For more details, please refer to this related issue on the Astro repository: Issue on Astro repo.

Link to minimal reproduction of the issue

Hope this helps!