mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2024-12-23 09:30:31 +03:00
Extended ShortUrlVisitsCount test to cover different contents of the tooltip
This commit is contained in:
parent
afc272c4d9
commit
73a3d1d50f
2 changed files with 35 additions and 7 deletions
|
@ -64,7 +64,7 @@ export const ShortUrlsRow = (
|
||||||
</td>
|
</td>
|
||||||
<td className="responsive-table__cell short-urls-row__cell text-lg-end" data-th="Visits">
|
<td className="responsive-table__cell short-urls-row__cell text-lg-end" data-th="Visits">
|
||||||
<ShortUrlVisitsCount
|
<ShortUrlVisitsCount
|
||||||
visitsCount={shortUrl.visitsCount}
|
visitsCount={shortUrl.visitsSummary?.total ?? shortUrl.visitsCount}
|
||||||
shortUrl={shortUrl}
|
shortUrl={shortUrl}
|
||||||
selectedServer={selectedServer}
|
selectedServer={selectedServer}
|
||||||
active={active}
|
active={active}
|
||||||
|
|
|
@ -1,14 +1,18 @@
|
||||||
import { render } from '@testing-library/react';
|
import { render, screen, waitFor } from '@testing-library/react';
|
||||||
|
import userEvent from '@testing-library/user-event';
|
||||||
import { Mock } from 'ts-mockery';
|
import { Mock } from 'ts-mockery';
|
||||||
import { ShortUrlVisitsCount } from '../../../src/short-urls/helpers/ShortUrlVisitsCount';
|
import { ShortUrlVisitsCount } from '../../../src/short-urls/helpers/ShortUrlVisitsCount';
|
||||||
import { ShortUrl } from '../../../src/short-urls/data';
|
import { ShortUrl } from '../../../src/short-urls/data';
|
||||||
|
|
||||||
describe('<ShortUrlVisitsCount />', () => {
|
describe('<ShortUrlVisitsCount />', () => {
|
||||||
const setUp = (visitsCount: number, shortUrl: ShortUrl) => render(
|
const setUp = (visitsCount: number, shortUrl: ShortUrl) => ({
|
||||||
<ShortUrlVisitsCount visitsCount={visitsCount} shortUrl={shortUrl} />,
|
user: userEvent.setup(),
|
||||||
);
|
...render(
|
||||||
|
<ShortUrlVisitsCount visitsCount={visitsCount} shortUrl={shortUrl} />,
|
||||||
|
),
|
||||||
|
});
|
||||||
|
|
||||||
it.each([undefined, {}])('just returns visits when no maxVisits is provided', (meta) => {
|
it.each([undefined, {}])('just returns visits when no limits are provided', (meta) => {
|
||||||
const visitsCount = 45;
|
const visitsCount = 45;
|
||||||
const { container } = setUp(visitsCount, Mock.of<ShortUrl>({ meta }));
|
const { container } = setUp(visitsCount, Mock.of<ShortUrl>({ meta }));
|
||||||
|
|
||||||
|
@ -23,6 +27,30 @@ describe('<ShortUrlVisitsCount />', () => {
|
||||||
const { container } = setUp(visitsCount, Mock.of<ShortUrl>({ meta }));
|
const { container } = setUp(visitsCount, Mock.of<ShortUrl>({ meta }));
|
||||||
|
|
||||||
expect(container.firstChild).toHaveTextContent(`/ ${maxVisits}`);
|
expect(container.firstChild).toHaveTextContent(`/ ${maxVisits}`);
|
||||||
expect(container.querySelector('.short-urls-visits-count__max-visits-control')).toBeInTheDocument();
|
});
|
||||||
|
|
||||||
|
it.each([
|
||||||
|
[['This short URL will not accept more than 50 visits'], { maxVisits: 50 }],
|
||||||
|
[['This short URL will not accept more than 1 visit'], { maxVisits: 1 }],
|
||||||
|
[['This short URL will not accept visits before 2022-01-01 10:00'], { validSince: '2022-01-01T10:00:00' }],
|
||||||
|
[['This short URL will not accept visits after 2022-05-05 15:30'], { validUntil: '2022-05-05T15:30:30' }],
|
||||||
|
[[
|
||||||
|
'This short URL will not accept more than 100 visits',
|
||||||
|
'This short URL will not accept visits after 2022-05-05 15:30',
|
||||||
|
], { validUntil: '2022-05-05T15:30:30', maxVisits: 100 }],
|
||||||
|
[[
|
||||||
|
'This short URL will not accept more than 100 visits',
|
||||||
|
'This short URL will not accept visits before 2023-01-01 10:00',
|
||||||
|
'This short URL will not accept visits after 2023-05-05 15:30',
|
||||||
|
], { validSince: '2023-01-01T10:00:00', validUntil: '2023-05-05T15:30:30', maxVisits: 100 }],
|
||||||
|
])('displays proper amount of tooltip list items', async (expectedListItems, meta) => {
|
||||||
|
const { user } = setUp(100, Mock.of<ShortUrl>({ meta }));
|
||||||
|
|
||||||
|
await user.hover(screen.getByRole('img', { hidden: true }));
|
||||||
|
await waitFor(() => expect(screen.getByRole('list')));
|
||||||
|
|
||||||
|
const items = screen.getAllByRole('listitem');
|
||||||
|
expect(items).toHaveLength(expectedListItems.length);
|
||||||
|
expectedListItems.forEach((text, index) => expect(items[index]).toHaveTextContent(text));
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue