:bug: Fixes Regression in Mutation handling (#4450)

* :test_tube: Adds test for improperly cleaned Elements

* :bug: Prevents Moved elements from being cleaned up

package-lock.json

@@ -63,6 +63,10 @@
             "resolved": "packages/persist",
             "link": true
         },
+        "node_modules/@alpinejs/resize": {
+            "resolved": "packages/resize",
+            "link": true
+        },
         "node_modules/@alpinejs/sort": {
             "resolved": "packages/sort",
             "link": true
@@ -7866,7 +7870,7 @@
             }
         },
         "packages/alpinejs": {
-            "version": "3.13.8",
+            "version": "3.14.4",
             "license": "MIT",
             "dependencies": {
                 "@vue/reactivity": "~3.1.1"
@@ -7874,17 +7878,17 @@
         },
         "packages/anchor": {
             "name": "@alpinejs/anchor",
-            "version": "3.13.8",
+            "version": "3.14.4",
             "license": "MIT"
         },
         "packages/collapse": {
             "name": "@alpinejs/collapse",
-            "version": "3.13.8",
+            "version": "3.14.4",
             "license": "MIT"
         },
         "packages/csp": {
             "name": "@alpinejs/csp",
-            "version": "3.13.8",
+            "version": "3.14.4",
             "license": "MIT",
             "dependencies": {
                 "@vue/reactivity": "~3.1.1"
@@ -7892,12 +7896,12 @@
         },
         "packages/docs": {
             "name": "@alpinejs/docs",
-            "version": "3.13.8-revision.1",
+            "version": "3.14.4-revision.1",
             "license": "MIT"
         },
         "packages/focus": {
             "name": "@alpinejs/focus",
-            "version": "3.13.8",
+            "version": "3.14.4",
             "license": "MIT",
             "dependencies": {
                 "focus-trap": "^6.9.4",
@@ -7914,17 +7918,17 @@
         },
         "packages/intersect": {
             "name": "@alpinejs/intersect",
-            "version": "3.13.8",
+            "version": "3.14.4",
             "license": "MIT"
         },
         "packages/mask": {
             "name": "@alpinejs/mask",
-            "version": "3.13.8",
+            "version": "3.14.4",
             "license": "MIT"
         },
         "packages/morph": {
             "name": "@alpinejs/morph",
-            "version": "3.13.8",
+            "version": "3.14.4",
             "license": "MIT"
         },
         "packages/navigate": {
@@ -7937,17 +7941,22 @@
         },
         "packages/persist": {
             "name": "@alpinejs/persist",
-            "version": "3.13.8",
+            "version": "3.14.4",
+            "license": "MIT"
+        },
+        "packages/resize": {
+            "name": "@alpinejs/resize",
+            "version": "3.14.4",
             "license": "MIT"
         },
         "packages/sort": {
             "name": "@alpinejs/sort",
-            "version": "3.13.8",
+            "version": "3.14.4",
             "license": "MIT"
         },
         "packages/ui": {
             "name": "@alpinejs/ui",
-            "version": "3.13.8-beta.0",
+            "version": "3.14.4",
             "license": "MIT",
             "devDependencies": {}
         }

packages/alpinejs/src/mutation.js

@@ -136,7 +136,6 @@ function onMutate(mutations) {
 
             mutations[i].addedNodes.forEach(node => {
                 if (node.nodeType !== 1) return
-                if (node._x_marker) return
 
                 addedNodes.push(node)
             })
@@ -198,7 +197,7 @@ function onMutate(mutations) {
 
     for (let node of addedNodes) {
         if (! node.isConnected) continue
-
+        if (node._x_marker) return;
         onElAddeds.forEach(i => i(node))
     }
 

tests/cypress/integration/mutation.spec.js

@@ -219,6 +219,7 @@ test('no side effects when directives are added to an element that is removed af
         get('span').should(haveText('0'))
     }
 )
+
 test(
     "previously initialized elements are not reinitialized on being moved",
     html`
@@ -243,3 +244,29 @@ test(
         get("[x-test]").should(haveText("1"));
     }
 );
+
+test(
+    "previously initialized elements are not cleaned up on being moved",
+    html`
+        <script>
+            let count = 0;
+            document.addEventListener("alpine:init", () => {
+                Alpine.directive("test", (el, _, { cleanup }) => {
+                    el.textContent = "Initialized";
+                    cleanup(() => {
+                        el.textContent = "Cleaned up";
+                    });
+                    Alpine.nextTick(() => {
+                        el.parentNode.replaceChildren(el);
+                    })
+                });
+            });
+        </script>
+        <div x-data>
+            <div class="bg-red-300 w-32 h-32" x-test></div>
+        </div>
+    `,
+    ({ get }) => {
+        get("[x-test]").should(haveText("Initialized"));
+    }
+);