wip

packages/docs/src/en/plugins/intersect.md

@@ -8,6 +8,8 @@ description: Alpine's Intersect plugin is a convenience wrapper for Intersection
 
 Alpine's Intersect plugin is a convenience wrapper for [Intersection Observer](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API) that allows you to easily react when an element enters or leaves the viewport.
 
+This is useful for: lazy loading images and other content, triggering animations, infinite scrolling, logging "views" of content, etc.
+
 <a name="installation"></a>
 ## Installation
 

tests/cypress/integration/plugins/intersect.spec.js

@@ -19,3 +19,23 @@ test('can intersect',
         get('span').should(haveText('2'))
     },
 )
+
+test('.once',
+    [html`
+    <div x-data="{ count: 0 }" x-init="setTimeout(() => count++, 300)">
+        <span x-text="count"></span>
+
+        <div x-intersect.once="count++" style="margin-top: 100vh;" id="1">hi</div>
+    </div>
+    `],
+    ({ get }, reload) => {
+        get('span').should(haveText('0'))
+        get('span').should(haveText('1'))
+        get('#1').scrollIntoView()
+        get('span').should(haveText('1'))
+        get('span').scrollIntoView()
+        get('span').should(haveText('1'))
+        get('#1').scrollIntoView()
+        get('span').should(haveText('1'))
+    },
+)