Add failing test

alpinejs · Nov 29, 2024 · fff5c3a · fff5c3a
1 parent 2c2bdb6
commit fff5c3a
Showing 1 changed file with 22 additions and 2 deletions.
diff --git a/tests/cypress/integration/directives/x-ignore.spec.js b/tests/cypress/integration/directives/x-ignore.spec.js
@@ -1,4 +1,4 @@
-import { haveText, html, notHaveClasses, notHaveText, test } from '../../utils'
+import { haveClasses, haveText, html, notHaveClasses, notHaveText, test } from '../../utils'
 
 test('x-ignore',
     html`
@@ -8,7 +8,9 @@ test('x-ignore',
             </div>
         </div>
     `,
-    ({ get }) => get('span').should(notHaveText('bar'))
+    ({ get }) => {
+        get('span').should(notHaveText('bar'))
+    }
 )
 
 test('x-ignore.self',
@@ -24,3 +26,21 @@ test('x-ignore.self',
         get('h1').should(notHaveClasses(['bar']))
     }
 )
+
+test('can lazyload component',
+    html`
+        <div x-data="{ lazyLoad() {$el.querySelector('#lazy').removeAttribute('x-ignore'); Alpine.nextTick(() => Alpine.initTree($el.querySelector('#lazy')))} }">
+            <button @click="lazyLoad">Load</button>
+            <div x-data="{ foo: 'bar' }" id="lazy" x-ignore :class="foo">
+                <span x-text="foo"></span>
+            </div>
+        </div>
+    `,
+    ({ get }) => {
+        get('span').should(notHaveText('bar'))
+        get('div#lazy').should(notHaveClasses(['bar']))
+        get('button').click()
+        get('span').should(haveText('bar'))
+        get('div#lazy').should(haveClasses(['bar']))
+    }
+)