CSS transitions with LiveView and phx-update=prepend


It seems that phx-update=“prepend” makes all currently existing DOM nodes re-enter the DOM. I would like to know how to avoid this behaviour with prepend (there is no problem with append) in order to add CSS transitions on those nodes when they enter the DOM.

I don’t know if it a known problem, but it seems due to how the JS code handles “prepend”.

I make a small demo of the problem:

git clone https://github.com/lud/liveview-transition-demo.git
cd liveview-transition-demo
mix phx.server

Is there a way to prevent that ?

Thank you

1 Like

(just bumping up the topic)