Home Explore Help
Register Sign In
oleg
/
alpine
mirror of https://github.com/alpinejs/alpine.git
1
0
Fork 0
Files Issues 0 Wiki
Browse Source

Fix dom walker to only skip nested components and their children

Caleb Porzio 5 years ago
parent
acc9063df7
commit
9c4a932702
7 changed files with 27 additions and 9 deletions
Unified View Show Diff Stats
  1. 2 2
      dist/mix-manifest.json
  2. 3 2
      dist/project-x.js
  3. 0 0
      dist/project-x.min.js
  4. 1 1
      index.html
  5. 1 1
      package.json
  6. 4 3
      src/utils.js
  7. 16 0
      test/nesting.spec.js

+ 2 - 2
dist/mix-manifest.json
View File 

@@ -1,4 +1,4 @@
 
 {
 
 {
 
-    "/project-x.js": "/project-x.js?id=c71aaeb90e1486c6278a",
 
-    "/project-x.min.js": "/project-x.min.js?id=c4fab9eee62bbe35e148"
 
+    "/project-x.js": "/project-x.js?id=6a940bba5ac7fd0b68e1",
 
+    "/project-x.min.js": "/project-x.min.js?id=39ed1c431c27b0184930"
 
 }
 
 }

+ 3 - 2
dist/project-x.js
View File 

@@ -1417,12 +1417,13 @@ function isTesting() {
 
   return navigator.userAgent, navigator.userAgent.includes("Node.js") || navigator.userAgent.includes("jsdom");
 
   return navigator.userAgent, navigator.userAgent.includes("Node.js") || navigator.userAgent.includes("jsdom");
 
 }
 
 }
 
 function walkSkippingNestedComponents(el, callback) {
 
 function walkSkippingNestedComponents(el, callback) {
 
+  var isRoot = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
 
+  if (el.hasAttribute('x-data') && !isRoot) return;
 
   callback(el);
 
   callback(el);
 
   var node = el.firstElementChild;
 
   var node = el.firstElementChild;
 
 
 
   while (node) {
 
   while (node) {
 
-    if (node.hasAttribute('x-data')) return;
 
-    walkSkippingNestedComponents(node, callback);
 
+    walkSkippingNestedComponents(node, callback, false);
 
     node = node.nextElementSibling;
 
     node = node.nextElementSibling;
 
   }
 
   }
 
 }
 
 }

File diff suppressed because it is too large
+ 0 - 0
dist/project-x.min.js


+ 1 - 1
index.html
View File 

@@ -5,7 +5,7 @@
 
             [x-cloak] { display: none; }
 
             [x-cloak] { display: none; }
 
         </style>
 
         </style>
 
 
 
-        <script src="https://cdn.jsdelivr.net/gh/calebporzio/project-x@v0.4.2/dist/project-x.min.js" defer></script>
 
+        <script src="https://cdn.jsdelivr.net/gh/calebporzio/project-x@v0.4.3/dist/project-x.min.js" defer></script>
 
     </head>
 
     </head>
 
     <body>
 
     <body>
 
         <table>
 
         <table>

+ 1 - 1
package.json
View File 

@@ -1,7 +1,7 @@
 
 {
 
 {
 
   "main": "dist/project-x.js",
 
   "main": "dist/project-x.js",
 
   "name": "project-x",
 
   "name": "project-x",
 
-  "version": "0.4.2",
 
+  "version": "0.4.3",
 
   "repository": {
 
   "repository": {
 
     "type": "git",
 
     "type": "git",
 
     "url": "git://github.com/calebporzio/project-x.git"
 
     "url": "git://github.com/calebporzio/project-x.git"

+ 4 - 3
src/utils.js
View File 

@@ -16,15 +16,16 @@ export function isTesting() {
 
         || navigator.userAgent.includes("jsdom")
 
         || navigator.userAgent.includes("jsdom")
 
 }
 
 }
 
 
 
-export function walkSkippingNestedComponents(el, callback) {
 
+export function walkSkippingNestedComponents(el, callback, isRoot = true) {
 
+    if (el.hasAttribute('x-data') && ! isRoot) return
 
+
 
     callback(el)
 
     callback(el)
 
 
 
     let node = el.firstElementChild
 
     let node = el.firstElementChild
 
 
 
     while (node) {
 
     while (node) {
 
-        if (node.hasAttribute('x-data')) return
 
+        walkSkippingNestedComponents(node, callback, false)
 
 
 
-        walkSkippingNestedComponents(node, callback)
 
         node = node.nextElementSibling
 
         node = node.nextElementSibling
 
     }
 
     }
 
 }
 
 }

+ 16 - 0
test/nesting.spec.js
View File 

@@ -27,3 +27,19 @@ test('can nest components', async () => {
 
 
 
     await wait(() => { expect(document.querySelector('span').innerText).toEqual('bar') })
 
     await wait(() => { expect(document.querySelector('span').innerText).toEqual('bar') })
 
 })
 
 })
 
+
 
+test('can access parent properties after nested components', async () => {
 
+    document.body.innerHTML = `
 
+        <div x-data="{ foo: 'bar' }">
 
+            <div x-data="{ foo: 'bob' }">
 
+                <button x-on:click="foo = 'baz'">Something</button>
 
+            </div>
 
+
 
+            <span x-text="foo"></span>
 
+        </div>
 
+    `
 
+
 
+    projectX.start()
 
+
 
+    expect(document.querySelector('span').innerText).toEqual('bar')
 
+})

Some files were not shown because too many files changed in this diff