WIP: Clean up event listeners on clone

[KevinBatdorf]

Currently, under some circumstances listeners will linger after a component is cloned.

Fixes #756

[calebporzio]

Interesting.

In your test case, you are registering a listener on an element via Alpine, destroying the Alpine component reference and re-cloning the component on to that element.

I WOULD expect that the listener would be fired twice.

.clone is meant to be used on different elements. And in those cases you want the listener to be run on both the original component element AND the cloned one.

[KevinBatdorf]

I was under the impression that when you use clone(), the original item was to be removed completely after the cloning. Maybe I misunderstood its use (I have little Livewire experience still =/)

Someone added a test case in Livewire though. Maybe someone else here can take a look and can chime in whether they are just doing it wrong?

Side note, I spent today trying to fix actually this and ran into issues because removeEventListener expects the EXACT SAME function to be passed in as you used with addEventListener, and that's not a trivial refactor.

[calebporzio]

Ah thanks for clarifying. No, the idea with clone is to initialize a new component with a different component's state.

It's primary use is for Livewire's DOM diffing tool "morphdom" to initialize the new HTML with the existing Alpine state BEFORE performing the DOM-diff.

I see that referenced component. Whoever that was should post a GH issue on Livewire's repo or ideally, PR a failing test for that case, and we can tackle it on that repo because it's Livewire specific.

Thanks for digging into this Kevin. Much appreciated!

Closing this.

[dvic]

Whoever that was should post a GH issue on Livewire's repo or ideally, PR a failing test for that case, and we can tackle it on that repo because it's Livewire specific.

@calebporzio Hi! I made the example that @KevinBatdorf mentioned. I'm not a PHP developer / Livewire user so I'm not sure I can create a PR with a failing test case but I've submitted an issue for it: livewire/livewire#2126. One more thing: this exact issue occurs also with the Elixir Phoenix Liveview library (that's how I encountered it).