opral / inlang-paraglide-js

Tree-shakable i18n library build on the inlang ecosystem.
https://inlang.com/m/gerre34r/library-inlang-paraglideJs
36 stars 0 forks source link

SvelteKit: animations on anchor elements can break inside of layout ParaglideJS wrapper #176

Open henrikvilhelmberglund opened 1 month ago

henrikvilhelmberglund commented 1 month ago

Quite a strange one but it seems like the <ParaglideJS> wrapper used in the layout causes some types of animations to stop working on <a> tags.

Repro component: REPL edit: if there is no code press F5 and it should refresh, seems like a REPL bug (!)

On the REPL all of the animations work as expected. In a ParaglideJS project only the <button> element animates correctly.

This should happen in any project but I can make a minimal repro if required. The snippet and the render blocks can be removed if using Svelte 4.

LorisSigrist commented 1 month ago

A repro would be much appreciated!

henrikvilhelmberglund commented 1 month ago

A repro would be much appreciated!

Thanks for reminding me:

https://github.com/henrikvilhelmberglund/svelte-inlang-animation-repro

Use the nav to switch between wrap and nowrap routes: /wrap - route wrapped by the ParaGlideJS component in the layout. button works fine but links don't animate properly /nowrap - route not wrapped, everything works there.