fix #1928

reimagined · Jul 2, 2021 · 9391884 · 9391884
1 parent 78993a4
commit 9391884
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 8 deletions.
diff --git a/examples/ts/hacker-news/client/containers/NewestByPage.tsx b/examples/ts/hacker-news/client/containers/NewestByPage.tsx
@@ -19,18 +19,20 @@ const NewestByPage = ({
         first: (+page - 1) * ITEMS_PER_PAGE,
       },
     },
-    null,
-    []
+    [],
+    [page]
   )
-  const { data: stories, status } = useSelector(selector)
+  const { data: stories, status } = useSelector(selector) || {
+    data: [],
+    status: ResultStatus.Initial,
+  }
 
   useEffect(() => {
     getStories()
-  }, [getStories])
+  }, [page])
 
   const isLoading =
     status === ResultStatus.Initial || status === ResultStatus.Requested
-
   return !isLoading ? (
     <Stories items={stories} page={page} type="newest" />
   ) : null

diff --git a/examples/ts/hacker-news/client/containers/ShowByPage.tsx b/examples/ts/hacker-news/client/containers/ShowByPage.tsx
@@ -20,13 +20,16 @@ const ShowByPage = ({
       },
     },
     [],
-    []
+    [page]
   )
-  const { data: stories, status } = useSelector(selector)
+  const { data: stories, status } = useSelector(selector) || {
+    data: [],
+    status: ResultStatus.Initial,
+  }
 
   useEffect(() => {
     getStories()
-  }, [getStories])
+  }, [page])
 
   const isLoading =
     status === ResultStatus.Initial && status === ResultStatus.Requested

diff --git a/examples/ts/hacker-news/test/e2e/2.story.ts b/examples/ts/hacker-news/test/e2e/2.story.ts
@@ -139,3 +139,31 @@ test('#1921: upvote/unvote story', async (t) => {
     .expect(await Selector('div').withAttribute('title', 'upvote').exists)
     .eql(true)
 })
+
+test('#1928: stories pagination', async (t) => {
+  for (let i = 0; i < 25; i++) {
+    await t.navigateTo(`${ROOT_URL}/submit`)
+
+    await t.typeText(Selector('input[type=text]').nth(1), `Story #${i + 1}`, {
+      paste: true,
+    })
+    await t.typeText('textarea', `Story #${i + 1} text`, { paste: true })
+    await t.click('button')
+
+    await waitSelector(
+      t,
+      'HackerNews',
+      Selector('a').withText(`Ask HN: Story #${i + 1}`)
+    )
+  }
+  await t.navigateTo(`${ROOT_URL}/newest`)
+  await t.expect(Selector('div').withText('Ask HN: Story #24').exists).eql(true)
+  await t.click(Selector('a').withText('More'))
+  await t
+    .expect(Selector('div').withText('Ask HN: Story #24').exists)
+    .eql(false)
+  await t.expect(Selector('div').withText('Ask HN: Story #3').exists).eql(true)
+  await t.click(Selector('a').withText('Prev'))
+  await t.expect(Selector('div').withText('Ask HN: Story #24').exists).eql(true)
+  await t.expect(Selector('div').withText('Ask HN: Story #3').exists).eql(false)
+})