forked/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2026-03-03 14:21:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update tests to use vi instead of jest

Browse Source
This commit is contained in:
Alejandro Celaya
2023-05-27 11:57:26 +02:00
parent e2cbb2713a
commit 07fcb4e016
117 changed files with 3699 additions and 325 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
test/visits/DomainVisits.test.tsx
View File

@@ -7,15 +7,15 @@ import { DomainVisits as createDomainVisits } from '../../src/visits/DomainVisit
import type { DomainVisits } from '../../src/visits/reducers/domainVisits';
import { renderWithEvents } from '../__helpers__/setUpTest';
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
useParams: jest.fn().mockReturnValue({ domain: 'foo.com_DEFAULT' }),
vi.mock('react-router-dom', async () => ({
...(await vi.importActual<any>('react-router-dom')),
useParams: vi.fn().mockReturnValue({ domain: 'foo.com_DEFAULT' }),
}));
describe('<DomainVisits />', () => {
const exportVisits = jest.fn();
const getDomainVisits = jest.fn();
const cancelGetDomainVisits = jest.fn();
const exportVisits = vi.fn();
const getDomainVisits = vi.fn();
const cancelGetDomainVisits = vi.fn();
const domainVisits = fromPartial<DomainVisits>({ visits: [{ date: formatISO(new Date()) }] });
const DomainVisits = createDomainVisits(fromPartial({ exportVisits }));
const setUp = () => renderWithEvents(

6
test/visits/NonOrphanVisits.test.tsx
View File

@@ -8,9 +8,9 @@ import type { VisitsInfo } from '../../src/visits/reducers/types';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<NonOrphanVisits />', () => {
const exportVisits = jest.fn();
const getNonOrphanVisits = jest.fn();
const cancelGetNonOrphanVisits = jest.fn();
const exportVisits = vi.fn();
const getNonOrphanVisits = vi.fn();
const cancelGetNonOrphanVisits = vi.fn();
const nonOrphanVisits = fromPartial<VisitsInfo>({ visits: [{ date: formatISO(new Date()) }] });
const NonOrphanVisits = createNonOrphanVisits(fromPartial({ exportVisits }));
const setUp = () => renderWithEvents(

6
test/visits/OrphanVisits.test.tsx
View File

@@ -8,8 +8,8 @@ import type { VisitsInfo } from '../../src/visits/reducers/types';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<OrphanVisits />', () => {
const getOrphanVisits = jest.fn();
const exportVisits = jest.fn();
const getOrphanVisits = vi.fn();
const exportVisits = vi.fn();
const orphanVisits = fromPartial<VisitsInfo>({ visits: [{ date: formatISO(new Date()) }] });
const OrphanVisits = createOrphanVisits(fromPartial({ exportVisits }));
const setUp = () => renderWithEvents(
@@ -18,7 +18,7 @@ describe('<OrphanVisits />', () => {
{...fromPartial<MercureBoundProps>({ mercureInfo: {} })}
getOrphanVisits={getOrphanVisits}
orphanVisits={orphanVisits}
cancelGetOrphanVisits={jest.fn()}
cancelGetOrphanVisits={vi.fn()}
settings={fromPartial({})}
/>
</MemoryRouter>,

4
test/visits/ShortUrlVisits.test.tsx
View File

@@ -10,8 +10,8 @@ import { ShortUrlVisits as createShortUrlVisits } from '../../src/visits/ShortUr
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<ShortUrlVisits />', () => {
const getShortUrlVisitsMock = jest.fn();
const exportVisits = jest.fn();
const getShortUrlVisitsMock = vi.fn();
const exportVisits = vi.fn();
const shortUrlVisits = fromPartial<ShortUrlVisitsState>({ visits: [{ date: formatISO(new Date()) }] });
const ShortUrlVisits = createShortUrlVisits(fromPartial({ exportVisits }));
const setUp = () => renderWithEvents(

2
test/visits/ShortUrlVisitsHeader.test.tsx
View File

@@ -12,7 +12,7 @@ describe('<ShortUrlVisitsHeader />', () => {
const shortUrlVisits = fromPartial<ShortUrlVisits>({
visits: [{}, {}, {}],
});
const goBack = jest.fn();
const goBack = vi.fn();
const setUp = (title?: string | null) => {
const shortUrlDetail = fromPartial<ShortUrlDetail>({
shortUrl: {

12
test/visits/TagVisits.test.tsx
View File

@@ -1,21 +1,21 @@
import { screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { formatISO } from 'date-fns';
import { MemoryRouter } from 'react-router-dom';
import { MemoryRouter } from 'react-router';
import type { MercureBoundProps } from '../../src/mercure/helpers/boundToMercureHub';
import type { TagVisits as TagVisitsStats } from '../../src/visits/reducers/tagVisits';
import type { TagVisitsProps } from '../../src/visits/TagVisits';
import { TagVisits as createTagVisits } from '../../src/visits/TagVisits';
import { renderWithEvents } from '../__helpers__/setUpTest';
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
useParams: jest.fn().mockReturnValue({ tag: 'foo' }),
vi.mock('react-router-dom', async () => ({
...(await vi.importActual<any>('react-router-dom')),
useParams: vi.fn().mockReturnValue({ tag: 'foo' }),
}));
describe('<TagVisits />', () => {
const getTagVisitsMock = jest.fn();
const exportVisits = jest.fn();
const getTagVisitsMock = vi.fn();
const exportVisits = vi.fn();
const tagVisits = fromPartial<TagVisitsStats>({ visits: [{ date: formatISO(new Date()) }] });
const TagVisits = createTagVisits(
fromPartial({ isColorLightForKey: () => false, getColorForKey: () => 'red' }),

2
test/visits/TagVisitsHeader.test.tsx
View File

@@ -9,7 +9,7 @@ describe('<TagVisitsHeader />', () => {
tag: 'foo',
visits: [{}, {}, {}, {}],
});
const goBack = jest.fn();
const goBack = vi.fn();
const colorGenerator = fromPartial<ColorGenerator>({ isColorLightForKey: () => false, getColorForKey: () => 'red' });
const setUp = () => render(<TagVisitsHeader tagVisits={tagVisits} goBack={goBack} colorGenerator={colorGenerator} />);

2
test/visits/VisitsHeader.test.tsx
View File

@@ -6,7 +6,7 @@ import { VisitsHeader } from '../../src/visits/VisitsHeader';
describe('<VisitsHeader />', () => {
const visits: Visit[] = [fromPartial({}), fromPartial({}), fromPartial({})];
const title = 'My header title';
const goBack = jest.fn();
const goBack = vi.fn();
const setUp = () => render(<VisitsHeader visits={visits} goBack={goBack} title={title} />);
it('shows the amount of visits', () => {

4
test/visits/VisitsStats.test.tsx
View File

@@ -10,8 +10,8 @@ import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<VisitsStats />', () => {
const visits = rangeOf(3, () => fromPartial<Visit>({ date: '2020-01-01' }));
const getVisitsMock = jest.fn();
const exportCsv = jest.fn();
const getVisitsMock = vi.fn();
const exportCsv = vi.fn();
const setUp = (visitsInfo: Partial<VisitsInfo>, activeRoute = '/by-time') => {
const history = createMemoryHistory();
history.push(activeRoute);

4
test/visits/VisitsTable.test.tsx
View File

@@ -8,7 +8,7 @@ import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<VisitsTable />', () => {
const matchMedia = () => fromPartial<MediaQueryList>({ matches: false });
const setSelectedVisits = jest.fn();
const setSelectedVisits = vi.fn();
const setUpFactory = (props: Partial<VisitsTableProps> = {}) => renderWithEvents(
<VisitsTable
visits={[]}
@@ -28,7 +28,7 @@ describe('<VisitsTable />', () => {
],
});
afterEach(jest.resetAllMocks);
afterEach(vi.resetAllMocks);
it('renders expected amount of columns', () => {
setUp([], []);

26
test/visits/charts/__snapshots__/DoughnutChart.test.tsx.snap
View File

@@ -1,4 +1,28 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`<DoughnutChart /> > renders Doughnut with expected props 1`] = `
[
{
"props": {
"a": 1,
"b": 0,
"c": 0,
"d": 1,
"e": 0,
"f": 0,
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "setTransform",
},
]
`;
exports[`<DoughnutChart /> renders Doughnut with expected props 1`] = `
[

522
test/visits/charts/__snapshots__/HorizontalBarChart.test.tsx.snap
View File

@@ -1,4 +1,524 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`<HorizontalBarChart /> > renders chart with expected canvas 1`] = `
[
{
"props": {
"a": 1,
"b": 0,
"c": 0,
"d": 1,
"e": 0,
"f": 0,
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "setTransform",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "foo",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "bar",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "0",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "500",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
]
`;
exports[`<HorizontalBarChart /> > renders chart with expected canvas 2`] = `
[
{
"props": {
"a": 1,
"b": 0,
"c": 0,
"d": 1,
"e": 0,
"f": 0,
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "setTransform",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "one",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "two",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "0",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "200,000",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
]
`;
exports[`<HorizontalBarChart /> > renders chart with expected canvas 3`] = `
[
{
"props": {
"a": 1,
"b": 0,
"c": 0,
"d": 1,
"e": 0,
"f": 0,
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "setTransform",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "one",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "two",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "max",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "0",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "200,000",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
]
`;
exports[`<HorizontalBarChart /> renders chart with expected canvas 1`] = `
[

462
test/visits/charts/__snapshots__/LineChartCard.test.tsx.snap
View File

@@ -1,4 +1,464 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`<LineChartCard /> > renders chart with expected data 1`] = `
[
{
"props": {
"a": 1,
"b": 0,
"c": 0,
"d": 1,
"e": 0,
"f": 0,
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "setTransform",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "0",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "1",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
]
`;
exports[`<LineChartCard /> > renders chart with expected data 2`] = `
[
{
"props": {
"a": 1,
"b": 0,
"c": 0,
"d": 1,
"e": 0,
"f": 0,
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "setTransform",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "0",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "1",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
]
`;
exports[`<LineChartCard /> > renders chart with expected data 3`] = `
[
{
"props": {
"a": 1,
"b": 0,
"c": 0,
"d": 1,
"e": 0,
"f": 0,
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "setTransform",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "0",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "1",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "2016-04",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
]
`;
exports[`<LineChartCard /> > renders chart with expected data 4`] = `
[
{
"props": {
"a": 1,
"b": 0,
"c": 0,
"d": 1,
"e": 0,
"f": 0,
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "setTransform",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "0",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "1",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
{
"props": {
"text": "2016-04",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "measureText",
},
{
"props": {
"value": "12px \\"Helvetica Neue\\", 'Helvetica', 'Arial', sans-serif",
},
"transform": [
1,
0,
0,
1,
0,
0,
],
"type": "font",
},
]
`;
exports[`<LineChartCard /> renders chart with expected data 1`] = `
[

1232
test/visits/charts/__snapshots__/SortableBarChartCard.test.tsx.snap
View File

File diff suppressed because it is too large Load Diff

2
test/visits/helpers/MapModal.test.tsx
View File

@@ -3,7 +3,7 @@ import { MapModal } from '../../../src/visits/helpers/MapModal';
import type { CityStats } from '../../../src/visits/types';
describe('<MapModal />', () => {
const toggle = jest.fn();
const toggle = vi.fn();
const zaragozaLat = 41.6563497;
const zaragozaLong = -0.876566;
const newYorkLat = 40.730610;

4
test/visits/helpers/VisitsFilterDropdown.test.tsx
View File

@@ -4,7 +4,7 @@ import type { OrphanVisitType, VisitsFilter } from '../../../src/visits/types';
import { renderWithEvents } from '../../__helpers__/setUpTest';
describe('<VisitsFilterDropdown />', () => {
const onChange = jest.fn();
const onChange = vi.fn();
const setUp = (selected: VisitsFilter = {}, isOrphanVisits = true) => renderWithEvents(
<VisitsFilterDropdown
isOrphanVisits={isOrphanVisits}
@@ -13,7 +13,7 @@ describe('<VisitsFilterDropdown />', () => {
/>,
);
beforeEach(jest.clearAllMocks);
beforeEach(vi.clearAllMocks);
it('has expected text', () => {
setUp();

184
test/visits/helpers/__snapshots__/MapModal.test.tsx.snap
View File

@@ -1,4 +1,186 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`<MapModal /> > renders expected map 1`] = `
<div
class="modal fade"
role="dialog"
style="display: block;"
tabindex="-1"
>
<div
class="modal-dialog map-modal__modal"
role="document"
>
<div
class="modal-content map-modal__modal-content"
>
<div
class="map-modal__modal-body modal-body"
>
<h3
class="map-modal__modal-title"
>
Foobar
<button
aria-label="Close"
class="btn-close float-end"
type="button"
/>
</h3>
<div
class="leaflet-container leaflet-touch leaflet-grab leaflet-touch-drag leaflet-touch-zoom"
style="position: relative;"
tabindex="0"
>
<div
class="leaflet-pane leaflet-map-pane"
style="left: 0px; top: 0px;"
>
<div
class="leaflet-pane leaflet-tile-pane"
>
<div
class="leaflet-layer "
style="z-index: 1;"
>
<div
class="leaflet-tile-container leaflet-zoom-animated"
style="z-index: 18; left: 0px; top: 0px;"
>
<img
alt=""
class="leaflet-tile"
src="https://a.tile.openstreetmap.org/0/0/0.png"
style="width: 256px; height: 256px; left: -101px; top: -96px;"
/>
</div>
</div>
</div>
<div
class="leaflet-pane leaflet-overlay-pane"
/>
<div
class="leaflet-pane leaflet-shadow-pane"
>
<img
alt=""
class="leaflet-marker-shadow leaflet-zoom-hide"
src="marker-shadow.png"
style="margin-left: -12px; margin-top: -41px; width: 41px; height: 41px; left: 26px; top: -1px;"
/>
<img
alt=""
class="leaflet-marker-shadow leaflet-zoom-hide"
src="marker-shadow.png"
style="margin-left: -12px; margin-top: -41px; width: 41px; height: 41px; left: -26px; top: 0px;"
/>
</div>
<div
class="leaflet-pane leaflet-marker-pane"
>
<img
alt="Marker"
class="leaflet-marker-icon leaflet-zoom-hide leaflet-interactive"
role="button"
src="marker-icon.png"
style="margin-left: -12px; margin-top: -41px; width: 25px; height: 41px; left: 26px; top: -1px; z-index: -1;"
tabindex="0"
/>
<img
alt="Marker"
class="leaflet-marker-icon leaflet-zoom-hide leaflet-interactive"
role="button"
src="marker-icon.png"
style="margin-left: -12px; margin-top: -41px; width: 25px; height: 41px; left: -26px; top: 0px; z-index: 0;"
tabindex="0"
/>
</div>
<div
class="leaflet-pane leaflet-tooltip-pane"
/>
<div
class="leaflet-pane leaflet-popup-pane"
/>
</div>
<div
class="leaflet-control-container"
>
<div
class="leaflet-top leaflet-left"
>
<div
class="leaflet-control-zoom leaflet-bar leaflet-control"
>
<a
aria-disabled="false"
aria-label="Zoom in"
class="leaflet-control-zoom-in"
href="#"
role="button"
title="Zoom in"
>
<span
aria-hidden="true"
>
+
</span>
</a>
<a
aria-disabled="true"
aria-label="Zoom out"
class="leaflet-control-zoom-out leaflet-disabled"
href="#"
role="button"
title="Zoom out"
>
<span
aria-hidden="true"
>
−
</span>
</a>
</div>
</div>
<div
class="leaflet-top leaflet-right"
/>
<div
class="leaflet-bottom leaflet-left"
/>
<div
class="leaflet-bottom leaflet-right"
>
<div
class="leaflet-control-attribution leaflet-control"
>
<a
href="https://leafletjs.com"
title="A JavaScript library for interactive maps"
>
Leaflet
</a>
<span
aria-hidden="true"
>
|
</span>
©
<a
href="https://osm.org/copyright"
>
OpenStreetMap
</a>
contributors
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`<MapModal /> renders expected map 1`] = `
<div

352
test/visits/helpers/__snapshots__/OpenMapModalBtn.test.tsx.snap
View File

@@ -1,4 +1,354 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`<OpenMapModalBtn /> > filters out non-active cities from list of locations 1`] = `
<div
class="modal fade"
role="dialog"
style="display: block;"
tabindex="-1"
>
<div
class="modal-dialog map-modal__modal"
role="document"
>
<div
class="modal-content map-modal__modal-content"
>
<div
class="map-modal__modal-body modal-body"
>
<h3
class="map-modal__modal-title"
>
Foo
<button
aria-label="Close"
class="btn-close float-end"
type="button"
/>
</h3>
<div
class="leaflet-container leaflet-touch leaflet-grab leaflet-touch-drag leaflet-touch-zoom"
style="position: relative;"
tabindex="0"
>
<div
class="leaflet-pane leaflet-map-pane"
style="left: 0px; top: 0px;"
>
<div
class="leaflet-pane leaflet-tile-pane"
>
<div
class="leaflet-layer "
style="z-index: 1;"
>
<div
class="leaflet-tile-container leaflet-zoom-animated"
style="z-index: 18; left: 0px; top: 0px;"
>
<img
alt=""
class="leaflet-tile"
src="https://a.tile.openstreetmap.org/0/0/0.png"
style="width: 256px; height: 256px; left: -161px; top: -62px;"
/>
</div>
</div>
</div>
<div
class="leaflet-pane leaflet-overlay-pane"
/>
<div
class="leaflet-pane leaflet-shadow-pane"
>
<img
alt=""
class="leaflet-marker-shadow leaflet-zoom-hide"
src="marker-shadow.png"
style="margin-left: -12px; margin-top: -41px; width: 41px; height: 41px; left: -29px; top: 62px;"
/>
<img
alt=""
class="leaflet-marker-shadow leaflet-zoom-hide"
src="marker-shadow.png"
style="margin-left: -12px; margin-top: -41px; width: 41px; height: 41px; left: 30px; top: -62px;"
/>
</div>
<div
class="leaflet-pane leaflet-marker-pane"
>
<img
alt="Marker"
class="leaflet-marker-icon leaflet-zoom-hide leaflet-interactive"
role="button"
src="marker-icon.png"
style="margin-left: -12px; margin-top: -41px; width: 25px; height: 41px; left: -29px; top: 62px; z-index: 62;"
tabindex="0"
/>
<img
alt="Marker"
class="leaflet-marker-icon leaflet-zoom-hide leaflet-interactive"
role="button"
src="marker-icon.png"
style="margin-left: -12px; margin-top: -41px; width: 25px; height: 41px; left: 30px; top: -62px; z-index: -62;"
tabindex="0"
/>
</div>
<div
class="leaflet-pane leaflet-tooltip-pane"
/>
<div
class="leaflet-pane leaflet-popup-pane"
/>
</div>
<div
class="leaflet-control-container"
>
<div
class="leaflet-top leaflet-left"
>
<div
class="leaflet-control-zoom leaflet-bar leaflet-control"
>
<a
aria-disabled="false"
aria-label="Zoom in"
class="leaflet-control-zoom-in"
href="#"
role="button"
title="Zoom in"
>
<span
aria-hidden="true"
>
+
</span>
</a>
<a
aria-disabled="true"
aria-label="Zoom out"
class="leaflet-control-zoom-out leaflet-disabled"
href="#"
role="button"
title="Zoom out"
>
<span
aria-hidden="true"
>
−
</span>
</a>
</div>
</div>
<div
class="leaflet-top leaflet-right"
/>
<div
class="leaflet-bottom leaflet-left"
/>
<div
class="leaflet-bottom leaflet-right"
>
<div
class="leaflet-control-attribution leaflet-control"
>
<a
href="https://leafletjs.com"
title="A JavaScript library for interactive maps"
>
Leaflet
</a>
<span
aria-hidden="true"
>
|
</span>
©
<a
href="https://osm.org/copyright"
>
OpenStreetMap
</a>
contributors
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`<OpenMapModalBtn /> > filters out non-active cities from list of locations 2`] = `
<div
class="modal fade"
role="dialog"
style="display: block;"
tabindex="-1"
>
<div
class="modal-dialog map-modal__modal"
role="document"
>
<div
class="modal-content map-modal__modal-content"
>
<div
class="map-modal__modal-body modal-body"
>
<h3
class="map-modal__modal-title"
>
Foo
<button
aria-label="Close"
class="btn-close float-end"
type="button"
/>
</h3>
<div
class="leaflet-container leaflet-touch leaflet-grab leaflet-touch-drag leaflet-touch-zoom"
style="position: relative;"
tabindex="0"
>
<div
class="leaflet-pane leaflet-map-pane"
style="left: 0px; top: 0px;"
>
<div
class="leaflet-pane leaflet-tile-pane"
>
<div
class="leaflet-layer "
style="z-index: 1;"
>
<div
class="leaflet-tile-container leaflet-zoom-animated"
style="z-index: 18; left: 0px; top: 0px;"
>
<img
alt=""
class="leaflet-tile"
src="https://a.tile.openstreetmap.org/10/762/0.png"
style="width: 256px; height: 256px; left: -80px; top: 0px;"
/>
</div>
</div>
</div>
<div
class="leaflet-pane leaflet-overlay-pane"
/>
<div
class="leaflet-pane leaflet-shadow-pane"
>
<img
alt=""
class="leaflet-marker-shadow leaflet-zoom-hide"
src="marker-shadow.png"
style="margin-left: -12px; margin-top: -41px; width: 41px; height: 41px; left: 0px; top: 0px;"
/>
</div>
<div
class="leaflet-pane leaflet-marker-pane"
>
<img
alt="Marker"
class="leaflet-marker-icon leaflet-zoom-hide leaflet-interactive"
role="button"
src="marker-icon.png"
style="margin-left: -12px; margin-top: -41px; width: 25px; height: 41px; left: 0px; top: 0px; z-index: 0;"
tabindex="0"
/>
</div>
<div
class="leaflet-pane leaflet-tooltip-pane"
/>
<div
class="leaflet-pane leaflet-popup-pane"
/>
</div>
<div
class="leaflet-control-container"
>
<div
class="leaflet-top leaflet-left"
>
<div
class="leaflet-control-zoom leaflet-bar leaflet-control"
>
<a
aria-disabled="false"
aria-label="Zoom in"
class="leaflet-control-zoom-in"
href="#"
role="button"
title="Zoom in"
>
<span
aria-hidden="true"
>
+
</span>
</a>
<a
aria-disabled="false"
aria-label="Zoom out"
class="leaflet-control-zoom-out"
href="#"
role="button"
title="Zoom out"
>
<span
aria-hidden="true"
>
−
</span>
</a>
</div>
</div>
<div
class="leaflet-top leaflet-right"
/>
<div
class="leaflet-bottom leaflet-left"
/>
<div
class="leaflet-bottom leaflet-right"
>
<div
class="leaflet-control-attribution leaflet-control"
>
<a
href="https://leafletjs.com"
title="A JavaScript library for interactive maps"
>
Leaflet
</a>
<span
aria-hidden="true"
>
|
</span>
©
<a
href="https://osm.org/copyright"
>
OpenStreetMap
</a>
contributors
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`<OpenMapModalBtn /> filters out non-active cities from list of locations 1`] = `
<div

6
test/visits/reducers/domainVisits.test.ts
View File

@@ -21,12 +21,12 @@ import type { Visit } from '../../../src/visits/types';
describe('domainVisitsReducer', () => {
const now = new Date();
const visitsMocks = rangeOf(2, () => fromPartial<Visit>({}));
const getDomainVisitsCall = jest.fn();
const getDomainVisitsCall = vi.fn();
const buildApiClientMock = () => fromPartial<ShlinkApiClient>({ getDomainVisits: getDomainVisitsCall });
const getDomainVisits = getDomainVisitsCreator(buildApiClientMock);
const { reducer, cancelGetVisits: cancelGetDomainVisits } = domainVisitsReducerCreator(getDomainVisits);
beforeEach(jest.clearAllMocks);
beforeEach(vi.clearAllMocks);
describe('reducer', () => {
const buildState = (data: Partial<DomainVisits>) => fromPartial<DomainVisits>(data);
@@ -152,7 +152,7 @@ describe('domainVisitsReducer', () => {
});
describe('getDomainVisits', () => {
const dispatchMock = jest.fn();
const dispatchMock = vi.fn();
const getState = () => fromPartial<ShlinkState>({
domainVisits: { cancelLoad: false },
});

8
test/visits/reducers/nonOrphanVisits.test.ts
View File

@@ -17,12 +17,12 @@ import type { Visit } from '../../../src/visits/types';
describe('nonOrphanVisitsReducer', () => {
const now = new Date();
const visitsMocks = rangeOf(2, () => fromPartial<Visit>({}));
const getNonOrphanVisitsCall = jest.fn();
const getNonOrphanVisitsCall = vi.fn();
const buildShlinkApiClient = () => fromPartial<ShlinkApiClient>({ getNonOrphanVisits: getNonOrphanVisitsCall });
const getNonOrphanVisits = getNonOrphanVisitsCreator(buildShlinkApiClient);
const { reducer, cancelGetVisits: cancelGetNonOrphanVisits } = nonOrphanVisitsReducerCreator(getNonOrphanVisits);
beforeEach(jest.clearAllMocks);
beforeEach(vi.clearAllMocks);
describe('reducer', () => {
const buildState = (data: Partial<VisitsInfo>) => fromPartial<VisitsInfo>(data);
@@ -119,12 +119,12 @@ describe('nonOrphanVisitsReducer', () => {
});
describe('getNonOrphanVisits', () => {
const dispatchMock = jest.fn();
const dispatchMock = vi.fn();
const getState = () => fromPartial<ShlinkState>({
orphanVisits: { cancelLoad: false },
});
beforeEach(jest.resetAllMocks);
beforeEach(vi.resetAllMocks);
it.each([
[undefined],

6
test/visits/reducers/orphanVisits.test.ts
View File

@@ -17,12 +17,12 @@ import type { Visit } from '../../../src/visits/types';
describe('orphanVisitsReducer', () => {
const now = new Date();
const visitsMocks = rangeOf(2, () => fromPartial<Visit>({}));
const getOrphanVisitsCall = jest.fn();
const getOrphanVisitsCall = vi.fn();
const buildShlinkApiClientMock = () => fromPartial<ShlinkApiClient>({ getOrphanVisits: getOrphanVisitsCall });
const getOrphanVisits = getOrphanVisitsCreator(buildShlinkApiClientMock);
const { reducer, cancelGetVisits: cancelGetOrphanVisits } = orphanVisitsReducerCreator(getOrphanVisits);
beforeEach(jest.clearAllMocks);
beforeEach(vi.clearAllMocks);
describe('reducer', () => {
const buildState = (data: Partial<VisitsInfo>) => fromPartial<VisitsInfo>(data);
@@ -119,7 +119,7 @@ describe('orphanVisitsReducer', () => {
});
describe('getOrphanVisits', () => {
const dispatchMock = jest.fn();
const dispatchMock = vi.fn();
const getState = () => fromPartial<ShlinkState>({
orphanVisits: { cancelLoad: false },
});

6
test/visits/reducers/shortUrlVisits.test.ts
View File

@@ -18,12 +18,12 @@ import type { Visit } from '../../../src/visits/types';
describe('shortUrlVisitsReducer', () => {
const now = new Date();
const visitsMocks = rangeOf(2, () => fromPartial<Visit>({}));
const getShortUrlVisitsCall = jest.fn();
const getShortUrlVisitsCall = vi.fn();
const buildApiClientMock = () => fromPartial<ShlinkApiClient>({ getShortUrlVisits: getShortUrlVisitsCall });
const getShortUrlVisits = getShortUrlVisitsCreator(buildApiClientMock);
const { reducer, cancelGetVisits: cancelGetShortUrlVisits } = shortUrlVisitsReducerCreator(getShortUrlVisits);
beforeEach(jest.clearAllMocks);
beforeEach(vi.clearAllMocks);
describe('reducer', () => {
const buildState = (data: Partial<ShortUrlVisits>) => fromPartial<ShortUrlVisits>(data);
@@ -143,7 +143,7 @@ describe('shortUrlVisitsReducer', () => {
});
describe('getShortUrlVisits', () => {
const dispatchMock = jest.fn();
const dispatchMock = vi.fn();
const getState = () => fromPartial<ShlinkState>({
shortUrlVisits: { cancelLoad: false },
});

6
test/visits/reducers/tagVisits.test.ts
View File

@@ -18,12 +18,12 @@ import type { Visit } from '../../../src/visits/types';
describe('tagVisitsReducer', () => {
const now = new Date();
const visitsMocks = rangeOf(2, () => fromPartial<Visit>({}));
const getTagVisitsCall = jest.fn();
const getTagVisitsCall = vi.fn();
const buildShlinkApiClientMock = () => fromPartial<ShlinkApiClient>({ getTagVisits: getTagVisitsCall });
const getTagVisits = getTagVisitsCreator(buildShlinkApiClientMock);
const { reducer, cancelGetVisits: cancelGetTagVisits } = tagVisitsReducerCreator(getTagVisits);
beforeEach(jest.clearAllMocks);
beforeEach(vi.clearAllMocks);
describe('reducer', () => {
const buildState = (data: Partial<TagVisits>) => fromPartial<TagVisits>(data);
@@ -143,7 +143,7 @@ describe('tagVisitsReducer', () => {
});
describe('getTagVisits', () => {
const dispatchMock = jest.fn();
const dispatchMock = vi.fn();
const getState = () => fromPartial<ShlinkState>({
tagVisits: { cancelLoad: false },
});

6
test/visits/reducers/visitsOverview.test.ts
View File

@@ -14,12 +14,12 @@ import {
import type { OrphanVisit } from '../../../src/visits/types';
describe('visitsOverviewReducer', () => {
const getVisitsOverview = jest.fn();
const getVisitsOverview = vi.fn();
const buildApiClientMock = () => fromPartial<ShlinkApiClient>({ getVisitsOverview });
const loadVisitsOverview = loadVisitsOverviewCreator(buildApiClientMock);
const { reducer } = visitsOverviewReducerCreator(loadVisitsOverview);
beforeEach(jest.clearAllMocks);
beforeEach(vi.clearAllMocks);
describe('reducer', () => {
const state = (payload: Partial<VisitsOverview> = {}) => fromPartial<VisitsOverview>(payload);
@@ -128,7 +128,7 @@ describe('visitsOverviewReducer', () => {
});
describe('loadVisitsOverview', () => {
const dispatchMock = jest.fn();
const dispatchMock = vi.fn();
const getState = () => fromPartial<ShlinkState>({});
it.each([