Merge pull request #1160 from joshhanley/fix-nested-alpine-with-nested-livewire

Fix nested alpine with nested livewire

dist/alpine-ie11.js

@@ -7358,7 +7358,7 @@
 
       this.initializeElements(this.$el, function () {
         _newArrowCheck(this, _this);
-      }.bind(this), componentForClone ? false : true); // Use mutation observer to detect new elements being added within this component at run-time.
+      }.bind(this), componentForClone); // Use mutation observer to detect new elements being added within this component at run-time.
       // Alpine's just so darn flexible amirite?
 
       this.listenForNewElementsToInitialize();
@@ -7511,7 +7511,7 @@
         var extraVars = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {
           _newArrowCheck(this, _this10);
         }.bind(this);
-        var shouldRegisterListeners = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+        var componentForClone = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
         this.walkAndSkipNestedComponents(rootEl, function (el) {
           _newArrowCheck(this, _this10);
 
@@ -7519,11 +7519,11 @@
           if (el.__x_for_key !== undefined) return false; // Don't touch spawns from if directives
 
           if (el.__x_inserted_me !== undefined) return false;
-          this.initializeElement(el, extraVars, shouldRegisterListeners);
+          this.initializeElement(el, extraVars, componentForClone ? false : true);
         }.bind(this), function (el) {
           _newArrowCheck(this, _this10);
 
-          el.__x = new Component(el);
+          if (!componentForClone) el.__x = new Component(el);
         }.bind(this));
         this.executeAndClearRemainingShowDirectiveStack();
         this.executeAndClearNextTickStack(rootEl);

dist/alpine.js

@@ -1514,7 +1514,7 @@
       // event listeners are registered (the mutation observer will take care of them)
 
 
-      this.initializeElements(this.$el, () => {}, componentForClone ? false : true); // Use mutation observer to detect new elements being added within this component at run-time.
+      this.initializeElements(this.$el, () => {}, componentForClone); // Use mutation observer to detect new elements being added within this component at run-time.
       // Alpine's just so darn flexible amirite?
 
       this.listenForNewElementsToInitialize();
@@ -1603,15 +1603,15 @@
       });
     }
 
-    initializeElements(rootEl, extraVars = () => {}, shouldRegisterListeners = true) {
+    initializeElements(rootEl, extraVars = () => {}, componentForClone = false) {
       this.walkAndSkipNestedComponents(rootEl, el => {
         // Don't touch spawns from for loop
         if (el.__x_for_key !== undefined) return false; // Don't touch spawns from if directives
 
         if (el.__x_inserted_me !== undefined) return false;
-        this.initializeElement(el, extraVars, shouldRegisterListeners);
+        this.initializeElement(el, extraVars, componentForClone ? false : true);
       }, el => {
-        el.__x = new Component(el);
+        if (!componentForClone) el.__x = new Component(el);
       });
       this.executeAndClearRemainingShowDirectiveStack();
       this.executeAndClearNextTickStack(rootEl);

src/component.js

@@ -96,7 +96,7 @@ export default class Component {
         // Register all our listeners and set all our attribute bindings.
         // If we're cloning a component, the third parameter ensures no duplicate
         // event listeners are registered (the mutation observer will take care of them)
-        this.initializeElements(this.$el, () => {}, componentForClone ? false : true)
+        this.initializeElements(this.$el, () => {}, componentForClone)
 
         // Use mutation observer to detect new elements being added within this component at run-time.
         // Alpine's just so darn flexible amirite?
@@ -197,7 +197,7 @@ export default class Component {
         })
     }
 
-    initializeElements(rootEl, extraVars = () => {}, shouldRegisterListeners = true) {
+    initializeElements(rootEl, extraVars = () => {}, componentForClone = false) {
         this.walkAndSkipNestedComponents(rootEl, el => {
             // Don't touch spawns from for loop
             if (el.__x_for_key !== undefined) return false
@@ -205,9 +205,9 @@ export default class Component {
             // Don't touch spawns from if directives
             if (el.__x_inserted_me !== undefined) return false
 
-            this.initializeElement(el, extraVars, shouldRegisterListeners)
+            this.initializeElement(el, extraVars, componentForClone ? false : true)
         }, el => {
-            el.__x = new Component(el)
+            if(! componentForClone) el.__x = new Component(el)
         })
 
         this.executeAndClearRemainingShowDirectiveStack()