From 58f952df8ab4562f0340c4389ae0b3809858b6bc Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandrocelaya@gmail.com>
Date: Thu, 9 Jun 2022 22:17:33 +0200
Subject: [PATCH] Migrated Paginator test to react testing library

---
 test/short-urls/Paginator.test.tsx | 31 ++++++++++++++++--------------
 1 file changed, 17 insertions(+), 14 deletions(-)

diff --git a/test/short-urls/Paginator.test.tsx b/test/short-urls/Paginator.test.tsx
index 0e611429..a7a12ab5 100644
--- a/test/short-urls/Paginator.test.tsx
+++ b/test/short-urls/Paginator.test.tsx
@@ -1,15 +1,17 @@
-import { shallow, ShallowWrapper } from 'enzyme';
-import { PaginationItem, PaginationLink } from 'reactstrap';
+import { render, screen } from '@testing-library/react';
 import { Mock } from 'ts-mockery';
+import { MemoryRouter } from 'react-router-dom';
 import { Paginator } from '../../src/short-urls/Paginator';
 import { ShlinkPaginator } from '../../src/api/types';
 import { ELLIPSIS } from '../../src/utils/helpers/pagination';
 
 describe('<Paginator />', () => {
-  let wrapper: ShallowWrapper;
   const buildPaginator = (pagesCount?: number) => Mock.of<ShlinkPaginator>({ pagesCount, currentPage: 1 });
-
-  afterEach(() => wrapper?.unmount());
+  const setUp = (paginator?: ShlinkPaginator, currentQueryString?: string) => render(
+    <MemoryRouter>
+      <Paginator serverId="abc123" paginator={paginator} currentQueryString={currentQueryString} />
+    </MemoryRouter>,
+  );
 
   it.each([
     [undefined],
@@ -17,8 +19,8 @@ describe('<Paginator />', () => {
     [buildPaginator(0)],
     [buildPaginator(1)],
   ])('renders nothing if the number of pages is below 2', (paginator) => {
-    wrapper = shallow(<Paginator serverId="abc123" paginator={paginator} />);
-    expect(wrapper.text()).toEqual('');
+    const { container } = setUp(paginator);
+    expect(container.firstChild).toBeNull();
   });
 
   it.each([
@@ -33,11 +35,12 @@ describe('<Paginator />', () => {
     expectedPages,
     expectedEllipsis,
   ) => {
-    wrapper = shallow(<Paginator serverId="abc123" paginator={paginator} />);
-    const items = wrapper.find(PaginationItem);
-    const ellipsis = items.filterWhere((item) => item.find(PaginationLink).prop('children') === ELLIPSIS);
+    setUp(paginator);
 
-    expect(items).toHaveLength(expectedPages);
+    const links = screen.getAllByRole('link');
+    const ellipsis = screen.queryAllByText(ELLIPSIS);
+
+    expect(links).toHaveLength(expectedPages);
     expect(ellipsis).toHaveLength(expectedEllipsis);
   });
 
@@ -45,10 +48,10 @@ describe('<Paginator />', () => {
     const paginator = buildPaginator(3);
     const currentQueryString = '?foo=bar';
 
-    wrapper = shallow(<Paginator serverId="abc123" paginator={paginator} currentQueryString={currentQueryString} />);
-    const links = wrapper.find(PaginationLink);
+    setUp(paginator, currentQueryString);
+    const links = screen.getAllByRole('link');
 
     expect(links).toHaveLength(5);
-    links.forEach((link) => expect(link.prop('to')).toContain(currentQueryString));
+    links.forEach((link) => expect(link).toHaveAttribute('href', expect.stringContaining(currentQueryString)));
   });
 });