瀏覽代碼

Add .full/.half intersect tests

Caleb Porzio 3 年之前
父節點
當前提交
cb8a874e34
共有 1 個文件被更改,包括 46 次插入0 次删除
  1. 46 0
      tests/cypress/integration/plugins/intersect.spec.js

+ 46 - 0
tests/cypress/integration/plugins/intersect.spec.js

@@ -59,6 +59,52 @@ test('It should evaluate with ":leave" only when the component is not intersecte
     },
     },
 )
 )
 
 
+test.only('.half thing',
+    [html`
+    <div x-data="{ count: 0 }">
+        <span x-text="count"></span>
+
+        <div id="container" style="height: 400px; overflow-y: scroll;">
+            <div style="height: 401px;">spacer</div>
+
+            <div style="height: 400px" x-intersect.half="count++">
+                <div style="text-align: center;">content</div>
+            </div>
+        </div>
+    </div>
+    `],
+    ({ get }) => {
+        get('span').should(haveText('0'))
+        get('#container').scrollTo(0, 100, {duration: 100})
+        get('span').should(haveText('0'))
+        get('#container').scrollTo(0, 210, {duration: 100})
+        get('span').should(haveText('1'))
+    },
+)
+
+test.only('.full thing',
+    [html`
+    <div x-data="{ count: 0 }">
+        <span x-text="count"></span>
+
+        <div id="container" style="height: 400px; overflow-y: scroll;">
+            <div style="height: 401px;">spacer</div>
+
+            <div style="height: 400px" x-intersect.full="count++">
+                <div style="text-align: center;">content</div>
+            </div>
+        </div>
+    </div>
+    `],
+    ({ get }) => {
+        get('span').should(haveText('0'))
+        get('#container').scrollTo(0, 200, {duration: 100})
+        get('span').should(haveText('0'))
+        get('#container').scrollTo(0, 400, {duration: 100})
+        get('span').should(haveText('1'))
+    },
+)
+
 test('.once',
 test('.once',
     [html`
     [html`
     <div x-data="{ count: 0 }" x-init="setTimeout(() => count++, 300)">
     <div x-data="{ count: 0 }" x-init="setTimeout(() => count++, 300)">