chore(): update readme

2025-08-22 21:48:42 +08:00 · 2018-10-08 15:44:51 -05:00
parent b4a73ad760
commit 4036db5480
42 changed files with 1966 additions and 215 deletions
--- a/core/src/components/infinite-scroll/test/top/e2e.ts
+++ b/core/src/components/infinite-scroll/test/top/e2e.ts
@ -0,0 +1,10 @@
+import { newE2EPage } from '@stencil/core/testing';
+
+it('infinite-scroll: basic', async () => {
+  const page = await newE2EPage({
+    url: '/src/components/infinite-scroll/test/basic?ionic:_testing=true'
+  });
+
+  const compare = await page.compareScreenshot();
+  expect(compare).toMatchScreenshot();
+});
--- a/core/src/components/infinite-scroll/test/top/index.html
+++ b/core/src/components/infinite-scroll/test/top/index.html
@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html dir="ltr">
+
+<head>
+  <meta charset="UTF-8">
+  <title>Infinite Scroll - Basic</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
+  <script src="/dist/ionic.js"></script>
+  <link rel="stylesheet" type="text/css" href="/css/ionic.bundle.css">
+</head>
+
+<body>
+  <ion-app>
+
+
+    <ion-header>
+      <ion-toolbar>
+        <ion-title>Infinite Scroll - Basic</ion-title>
+      </ion-toolbar>
+    </ion-header>
+
+    <ion-content id="content" padding>
+
+      <ion-infinite-scroll threshold="100px" id="infinite-scroll" position="top">
+        <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="Loading more data...">
+        </ion-infinite-scroll-content>
+      </ion-infinite-scroll>
+
+      <ion-button onclick="toggleInfiniteScroll()" expand="block">
+        Toggle InfiniteScroll
+      </ion-button>
+
+      <ion-list id="list"></ion-list>
+
+    </ion-content>
+
+  </ion-app>
+
+  <script>
+    const list = document.getElementById('list');
+    const infiniteScroll = document.getElementById('infinite-scroll');
+
+    function toggleInfiniteScroll() {
+      infiniteScroll.disabled = !infiniteScroll.disabled;
+    }
+
+    infiniteScroll.addEventListener('ionInfinite', async function () {
+      console.log('Loading data...');
+      await wait(500);
+      infiniteScroll.complete();
+      appendItems();
+
+      console.log('Done');
+    });
+
+    function appendItems() {
+      for (var i = 0; i < 30; i++) {
+        const el = document.createElement('ion-item');
+        el.textContent = `${1 + i}`;
+        list.prepend(el);
+      }
+    }
+
+    function wait(time) {
+      return new Promise(resolve => {
+        setTimeout(() => {
+          resolve();
+        }, time);
+      });
+    }
+
+    appendItems();
+
+  </script>
+</body>
+
+</html>