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('', () => { - let wrapper: ShallowWrapper; const buildPaginator = (pagesCount?: number) => Mock.of({ pagesCount, currentPage: 1 }); - - afterEach(() => wrapper?.unmount()); + const setUp = (paginator?: ShlinkPaginator, currentQueryString?: string) => render( + + + , + ); it.each([ [undefined], @@ -17,8 +19,8 @@ describe('', () => { [buildPaginator(0)], [buildPaginator(1)], ])('renders nothing if the number of pages is below 2', (paginator) => { - wrapper = shallow(); - expect(wrapper.text()).toEqual(''); + const { container } = setUp(paginator); + expect(container.firstChild).toBeNull(); }); it.each([ @@ -33,11 +35,12 @@ describe('', () => { expectedPages, expectedEllipsis, ) => { - wrapper = shallow(); - 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('', () => { const paginator = buildPaginator(3); const currentQueryString = '?foo=bar'; - wrapper = shallow(); - 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))); }); });