Compare commits

...

41 Commits

Author SHA1 Message Date
Alejandro Celaya
f5e92c6897 Merge pull request #848 from shlinkio/develop
Release 3.10.2
2023-07-09 10:17:23 +02:00
Alejandro Celaya
f1014a4810 Build docker image for linux/arm64/v8 and linux/amd64 only 2023-07-09 10:09:35 +02:00
Alejandro Celaya
1793424658 Merge pull request #847 from acelaya-forks/feature/docker-build-on-tag
Build docker image only on tags
2023-07-09 09:58:55 +02:00
Alejandro Celaya
c94a5b948e Build docker image only on tags 2023-07-09 09:48:54 +02:00
Alejandro Celaya
107cabcd8b Merge pull request #845 from shlinkio/dependabot/npm_and_yarn/tough-cookie-4.1.3
Bump tough-cookie from 4.1.2 to 4.1.3
2023-07-08 07:50:43 +02:00
Alejandro Celaya
99bc769894 Merge pull request #844 from shlinkio/dependabot/npm_and_yarn/stylelint-15.10.1
Bump stylelint from 14.16.0 to 15.10.1
2023-07-08 07:50:18 +02:00
dependabot[bot]
e8f1964941 Bump tough-cookie from 4.1.2 to 4.1.3
Bumps [tough-cookie](https://github.com/salesforce/tough-cookie) from 4.1.2 to 4.1.3.
- [Release notes](https://github.com/salesforce/tough-cookie/releases)
- [Changelog](https://github.com/salesforce/tough-cookie/blob/master/CHANGELOG.md)
- [Commits](https://github.com/salesforce/tough-cookie/compare/v4.1.2...v4.1.3)

---
updated-dependencies:
- dependency-name: tough-cookie
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>
2023-07-08 00:17:47 +00:00
dependabot[bot]
1a491bec1c Bump stylelint from 14.16.0 to 15.10.1
Bumps [stylelint](https://github.com/stylelint/stylelint) from 14.16.0 to 15.10.1.
- [Release notes](https://github.com/stylelint/stylelint/releases)
- [Changelog](https://github.com/stylelint/stylelint/blob/main/CHANGELOG.md)
- [Commits](https://github.com/stylelint/stylelint/compare/14.16.0...15.10.1)

---
updated-dependencies:
- dependency-name: stylelint
  dependency-type: direct:development
...

Signed-off-by: dependabot[bot] <support@github.com>
2023-07-07 22:00:52 +00:00
Alejandro Celaya
4ba63cdbf8 Merge pull request #837 from acelaya-forks/feature/vitest-0.32
Feature/vitest 0.32
2023-06-12 09:47:20 +02:00
Alejandro Celaya
b2c2af3ebb Exclude sw helper from code coverage 2023-06-12 08:59:38 +02:00
Alejandro Celaya
9dca19fcb5 Replace coverage-c8 with coverage-v8 2023-06-12 08:51:37 +02:00
Alejandro Celaya
7c2dab43e1 Update to vitest 0.32 2023-06-09 09:07:20 +02:00
Alejandro Celaya
a8c6d9b034 Merge pull request #836 from shlinkio/dependabot/npm_and_yarn/vite-4.3.9
Bump vite from 4.3.1 to 4.3.9
2023-06-06 05:38:06 +02:00
dependabot[bot]
be0cb20fa2 Bump vite from 4.3.1 to 4.3.9
Bumps [vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite) from 4.3.1 to 4.3.9.
- [Release notes](https://github.com/vitejs/vite/releases)
- [Changelog](https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md)
- [Commits](https://github.com/vitejs/vite/commits/v4.3.9/packages/vite)

---
updated-dependencies:
- dependency-name: vite
  dependency-type: direct:development
...

Signed-off-by: dependabot[bot] <support@github.com>
2023-06-06 02:03:33 +00:00
Alejandro Celaya
2ac1025e9f Merge pull request #834 from acelaya-forks/feature/vitest-migration
Feature/vitest migration
2023-05-27 14:21:33 +02:00
Alejandro Celaya
27d79b574e Correct test:watch command so that it actually watches 2023-05-27 14:15:38 +02:00
Alejandro Celaya
1b82f42a33 Remove direct dependency on redux and redux-thunk, as those are now required by @reduxjs/toolkit 2023-05-27 14:10:37 +02:00
Alejandro Celaya
f3f9eac67b Fix comments 2023-05-27 13:12:38 +02:00
Alejandro Celaya
2a86a0e540 Fix remaining type errors in tests 2023-05-27 12:45:12 +02:00
Alejandro Celaya
d14aea708e Fix incorrect types between testing library and vitest 2023-05-27 12:29:03 +02:00
Alejandro Celaya
12a05b422d Fix merge conflicts 2023-05-27 12:04:01 +02:00
Alejandro Celaya
a5abe9dbf2 Update test snapshots 2023-05-27 12:02:13 +02:00
Alejandro Celaya
07fcb4e016 Update tests to use vi instead of jest 2023-05-27 11:57:26 +02:00
Alejandro Celaya
e2cbb2713a Replace jest config with vitest config 2023-05-27 11:36:18 +02:00
Alejandro Celaya
706e00ace0 Merge pull request #833 from acelaya-forks/feature/menus
Feature/menus
2023-05-27 10:57:14 +02:00
Alejandro Celaya
655fbf94c1 Normalize and consolidate dropdown menus 2023-05-27 10:40:07 +02:00
Alejandro Celaya
afc574aceb Fixed block and inline dropdown buttons 2023-05-27 09:40:49 +02:00
Alejandro Celaya
3da2b56426 Update actions dependencies and node 2023-05-27 09:40:10 +02:00
Alejandro Celaya
5f91ad8819 Merge pull request #829 from shlinkio/develop
Release 3.10.1
2023-04-23 15:56:15 +02:00
Alejandro Celaya
131a745514 Add v3.10.1 to changelog 2023-04-23 15:24:48 +02:00
Alejandro Celaya
86349f1ad3 Merge pull request #828 from acelaya-forks/feature/short-url-export
Feature/short url export
2023-04-22 12:28:12 +02:00
Alejandro Celaya
72e4a7b062 Fix incorrect type 2023-04-22 12:09:15 +02:00
Alejandro Celaya
0a0165df45 Update changelog 2023-04-22 12:05:31 +02:00
Alejandro Celaya
992b22fd24 Refactor short URL export so that it is compatible with what Shlink expects 2023-04-21 09:36:51 +02:00
Alejandro Celaya
6fbe6c673b Merge pull request #827 from acelaya-forks/feature/vite-latest
Update vite deps
2023-04-21 08:20:42 +02:00
Alejandro Celaya
ff22e54b59 Update vite deps 2023-04-20 22:57:49 +02:00
Alejandro Celaya
578365ab68 Delete outdated stryker config file 2023-04-20 09:28:39 +02:00
Alejandro Celaya
22905a2efc Merge pull request #825 from acelaya-forks/feature/shoehorn
Introduce shoehorn as a possible replacement for ts-mockery
2023-04-14 09:34:45 +02:00
Alejandro Celaya
26bad75a1a Finish replacing ts-mockery with shoehorn 2023-04-14 09:28:53 +02:00
Alejandro Celaya
04e1950591 Migrate more tests to shoehorn 2023-04-13 22:47:13 +02:00
Alejandro Celaya
340f4b8fb5 Introduce shoehorn as a possible replacement for ts-mockery 2023-04-13 21:48:29 +02:00
177 changed files with 4017 additions and 7691 deletions

View File

@@ -11,6 +11,6 @@ jobs:
ci:
uses: shlinkio/github-actions/.github/workflows/web-app-ci.yml@main
with:
node-version: 18.12
node-version: 20.2
publish-coverage: true
force-install: true

View File

@@ -9,14 +9,14 @@ jobs:
continue-on-error: true
steps:
- name: Checkout code
uses: actions/checkout@v2
uses: actions/checkout@v3
with:
repository: ${{ github.event.pull_request.head.repo.full_name }}
ref: ${{ github.event.pull_request.head.ref }}
- name: Use node.js
uses: actions/setup-node@v1
uses: actions/setup-node@v3
with:
node-version: 18.12
node-version: 20.2
- name: Build
run: |
npm ci --force && \

View File

@@ -2,8 +2,6 @@ name: Build and publish docker image
on:
push:
branches:
- develop
tags:
- 'v*'
@@ -14,3 +12,4 @@ jobs:
with:
image-name: shlinkio/shlink-web-client
version-arg-name: VERSION
platforms: 'linux/arm64/v8,linux/amd64'

View File

@@ -10,11 +10,11 @@ jobs:
runs-on: ubuntu-20.04
steps:
- name: Checkout code
uses: actions/checkout@v2
uses: actions/checkout@v3
- name: Use node.js
uses: actions/setup-node@v1
uses: actions/setup-node@v3
with:
node-version: 18.12
node-version: 20.2
- name: Generate release assets
run: npm ci --force && VERSION=${GITHUB_REF#refs/tags/v} npm run build:dist
- name: Publish release with assets

View File

@@ -4,6 +4,41 @@ All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org).
## [3.10.2] - 2023-07-09
### Added
* *Nothing*
### Changed
* [#781](https://github.com/shlinkio/shlink-web-client/issues/781) Migrate tests from jest to vitest.
* [#843](https://github.com/shlinkio/shlink-web-client/issues/843) Build docker image only for new tags, making sure it always includes an actual version number.
### Deprecated
* *Nothing*
### Removed
* *Nothing*
### Fixed
* *Nothing*
## [3.10.1] - 2023-04-23
### Added
* *Nothing*
### Changed
* *Nothing*
### Deprecated
* *Nothing*
### Removed
* *Nothing*
### Fixed
* [#826](https://github.com/shlinkio/shlink-web-client/issues/826) Fix generated short URLs CSV so that it can be used to import on Shlink.
## [3.10.0] - 2023-03-19
### Added
* [#807](https://github.com/shlinkio/shlink-web-client/issues/807) Add support for device-specific long-URLs when creating or editing short URLs.

View File

@@ -1,4 +1,4 @@
FROM node:18.12-alpine as node
FROM node:20.2-alpine as node
COPY . /shlink-web-client
ARG VERSION="latest"
ENV VERSION ${VERSION}

View File

@@ -1,9 +0,0 @@
module.exports = {
presets: [
['@babel/preset-env', {
targets: { esmodules: true }
}],
['@babel/preset-react', { runtime: 'automatic' }],
'@babel/preset-typescript',
],
};

View File

@@ -1,12 +0,0 @@
// This is a custom Jest transformer turning style imports into empty objects.
// http://facebook.github.io/jest/docs/en/webpack.html
module.exports = {
process() {
return { code: 'module.exports = {};' };
},
getCacheKey() {
// The output is always the same.
return 'cssTransform';
},
};

View File

@@ -1,31 +0,0 @@
const path = require('path');
// This is a custom Jest transformer turning file imports into filenames.
// http://facebook.github.io/jest/docs/en/webpack.html
module.exports = {
process(src, filename) {
const assetFilename = JSON.stringify(path.basename(filename));
if (filename.match(/\.svg$/)) {
return `module.exports = {
__esModule: true,
default: ${assetFilename},
ReactComponent: (props) => ({
$$typeof: Symbol.for('react.element'),
type: 'svg',
ref: null,
key: null,
props: Object.assign({}, props, {
children: ${assetFilename}
})
}),
};`;
}
return {
code: `module.exports = ${assetFilename};`
};
},
};

View File

@@ -1,12 +0,0 @@
import '@testing-library/jest-dom';
import 'jest-canvas-mock';
import 'chart.js/auto';
import ResizeObserver from 'resize-observer-polyfill';
import { setAutoFreeze } from 'immer';
(global as any).ResizeObserver = ResizeObserver;
(global as any).scrollTo = () => {};
(global as any).prompt = () => {};
(global as any).matchMedia = (media: string) => ({ matches: false, media });
setAutoFreeze(false); // TODO Bypassing a bug on jest

27
config/test/setupTests.ts Normal file
View File

@@ -0,0 +1,27 @@
import 'vitest-canvas-mock';
import 'chart.js/auto';
import type { TestingLibraryMatchers } from '@testing-library/jest-dom/matchers';
import matchers from '@testing-library/jest-dom/matchers';
import { cleanup } from '@testing-library/react';
import ResizeObserver from 'resize-observer-polyfill';
import { afterEach, expect } from 'vitest';
// Workaround for TypeScript error: https://github.com/testing-library/jest-dom/issues/439#issuecomment-1536524120
declare module 'vitest' {
interface Assertion<T = any> extends jest.Matchers<void, T>, TestingLibraryMatchers<T, void> {}
}
// Extends Vitest's expect method with methods from react-testing-library
expect.extend(matchers);
afterEach(() => {
// Clears all mocks after every test
vi.clearAllMocks();
// Run a cleanup after each test case (e.g. clearing jsdom)
cleanup();
});
(global as any).ResizeObserver = ResizeObserver;
(global as any).scrollTo = () => {};
(global as any).prompt = () => {};
(global as any).matchMedia = (media: string) => ({ matches: false, media });

View File

@@ -3,7 +3,7 @@ version: '3'
services:
shlink_web_client_node:
container_name: shlink_web_client_node
image: node:18.12-alpine
image: node:20.2-alpine
command: /bin/sh -c "cd /home/shlink/www && npm install --force && npm run start"
volumes:
- ./:/home/shlink/www

View File

@@ -1,39 +0,0 @@
module.exports = {
coverageDirectory: '<rootDir>/coverage',
collectCoverageFrom: [
'src/**/*.{ts,tsx}',
'!src/*.{ts,tsx}',
'!src/reducers/index.ts',
'!src/**/provideServices.ts',
'!src/container/*.ts',
],
coverageThreshold: {
global: {
statements: 90,
branches: 85,
functions: 90,
lines: 90,
},
},
setupFilesAfterEnv: ['<rootDir>/config/jest/setupTests.ts'],
testMatch: ['<rootDir>/test/**/*.test.{ts,tsx}'],
testEnvironment: 'jsdom',
testEnvironmentOptions: {
url: 'http://localhost',
},
transform: {
'^.+\\.(ts|tsx|js)$': '<rootDir>/node_modules/babel-jest',
'^.+\\.scss$': '<rootDir>/config/jest/cssTransform.js',
'^(?!.*\\.(ts|tsx|js|json|scss)$)': '<rootDir>/config/jest/fileTransform.js',
},
transformIgnorePatterns: [
'node_modules\/(?!(\@react-leaflet|react-leaflet|leaflet|react-chartjs-2|react-colorful)\/)',
'^.+\\.module\\.scss$',
],
moduleNameMapper: {
'^.+\\.module\\.scss$': 'identity-obj-proxy',
'react-chartjs-2': '<rootDir>/node_modules/react-chartjs-2/dist/index.js',
'uuid': '<rootDir>/node_modules/uuid/dist/index.js',
},
moduleFileExtensions: ['js', 'ts', 'tsx', 'json'],
};

8903
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -17,16 +17,12 @@
"preview": "vite preview --host=0.0.0.0",
"build": "npm run types && vite build && node scripts/replace-version.mjs",
"build:dist": "npm run build && node scripts/create-dist-file.mjs",
"test": "jest --env=jsdom --colors",
"test:coverage": "npm run test -- --coverage --coverageReporters=text --coverageReporters=text-summary",
"test:ci": "npm run test:coverage -- --coverageReporters=clover --ci",
"test:pretty": "npm run test:coverage -- --coverageReporters=html",
"test": "vitest run --run",
"test:watch": "vitest --watch",
"test:ci": "npm run test -- --coverage",
"test:verbose": "npm run test -- --verbose"
},
"dependencies": {
"@babel/preset-env": "^7.20.2",
"@babel/preset-react": "^7.18.6",
"@babel/preset-typescript": "^7.21.0",
"@fortawesome/fontawesome-free": "^6.3.0",
"@fortawesome/fontawesome-svg-core": "^6.3.0",
"@fortawesome/free-brands-svg-icons": "^6.3.0",
@@ -54,16 +50,14 @@
"react-copy-to-clipboard": "^5.1.0",
"react-datepicker": "^4.8.0",
"react-dom": "^18.2.0",
"react-external-link": "^2.0.0",
"react-external-link": "^2.2.0",
"react-leaflet": "^4.2.0",
"react-redux": "^8.0.5",
"react-router-dom": "^6.6.1",
"react-swipeable": "^7.0.0",
"react-tag-autocomplete": "^6.3.0",
"reactstrap": "^9.1.5",
"redux": "^4.2.0",
"redux-localstorage-simple": "^2.5.1",
"redux-thunk": "^2.4.2",
"uuid": "^8.3.2",
"workbox-core": "^6.5.4",
"workbox-expiration": "^6.5.4",
@@ -75,9 +69,9 @@
"@shlinkio/eslint-config-js-coding-standard": "~2.1.0",
"@shlinkio/stylelint-config-css-coding-standard": "~1.0.1",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/react": "^14.0.0",
"@testing-library/user-event": "^14.4.3",
"@types/jest": "^29.2.4",
"@total-typescript/shoehorn": "^0.1.0",
"@types/json2csv": "^5.0.3",
"@types/leaflet": "^1.9.0",
"@types/qs": "^6.9.7",
@@ -89,22 +83,20 @@
"@types/react-dom": "^18.0.10",
"@types/react-tag-autocomplete": "^6.3.0",
"@types/uuid": "^8.3.4",
"@vitejs/plugin-react": "^3.1.0",
"@vitejs/plugin-react": "^4.0.0",
"@vitest/coverage-v8": "^0.32.0",
"adm-zip": "^0.5.10",
"babel-jest": "^29.5.0",
"chalk": "^5.2.0",
"eslint": "^8.30.0",
"identity-obj-proxy": "^3.0.0",
"jest": "^29.3.1",
"jest-canvas-mock": "^2.4.0",
"jest-environment-jsdom": "^29.3.1",
"jsdom": "^22.0.0",
"resize-observer-polyfill": "^1.5.1",
"sass": "^1.57.1",
"stylelint": "^14.16.0",
"ts-mockery": "^1.2.0",
"stylelint": "^15.10.1",
"typescript": "^5.0.2",
"vite": "^4.2.0",
"vite-plugin-pwa": "^0.14.4"
"vite": "^4.3.9",
"vite-plugin-pwa": "^0.14.4",
"vitest": "^0.32.0",
"vitest-canvas-mock": "^0.2.2"
},
"browserslist": [
">0.2%",

View File

@@ -24,7 +24,6 @@ export class ReportExporter {
private readonly exportCsv = (filename: string, rows: object[]) => {
const csv = this.jsonToCsv(rows);
saveCsv(this.window, csv, filename);
};
}

View File

@@ -5,9 +5,9 @@ import { Link } from 'react-router-dom';
import { DropdownItem } from 'reactstrap';
import type { SelectedServer } from '../../servers/data';
import { getServerId } from '../../servers/data';
import { DropdownBtnMenu } from '../../utils/DropdownBtnMenu';
import { useFeature } from '../../utils/helpers/features';
import { useToggle } from '../../utils/helpers/hooks';
import { RowDropdownBtn } from '../../utils/RowDropdownBtn';
import { DEFAULT_DOMAIN } from '../../visits/reducers/domainVisits';
import type { Domain } from '../data';
import type { EditDomainRedirects } from '../reducers/domainRedirects';
@@ -20,7 +20,6 @@ interface DomainDropdownProps {
}
export const DomainDropdown: FC<DomainDropdownProps> = ({ domain, editDomainRedirects, selectedServer }) => {
const [isOpen, toggle] = useToggle();
const [isModalOpen, toggleModal] = useToggle();
const { isDefault } = domain;
const canBeEdited = !isDefault || useFeature('defaultDomainRedirectsEdition', selectedServer);
@@ -28,7 +27,7 @@ export const DomainDropdown: FC<DomainDropdownProps> = ({ domain, editDomainRedi
const serverId = getServerId(selectedServer);
return (
<DropdownBtnMenu isOpen={isOpen} toggle={toggle}>
<RowDropdownBtn>
{withVisits && (
<DropdownItem
tag={Link}
@@ -47,6 +46,6 @@ export const DomainDropdown: FC<DomainDropdownProps> = ({ domain, editDomainRedi
toggle={toggleModal}
editDomainRedirects={editDomainRedirects}
/>
</DropdownBtnMenu>
</RowDropdownBtn>
);
};

View File

@@ -9,8 +9,8 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import type { FC } from 'react';
import { Link } from 'react-router-dom';
import { DropdownItem } from 'reactstrap';
import { DropdownBtnMenu } from '../utils/DropdownBtnMenu';
import { useToggle } from '../utils/helpers/hooks';
import { RowDropdownBtn } from '../utils/RowDropdownBtn';
import type { ServerWithId } from './data';
import type { DeleteServerModalProps } from './DeleteServerModal';
@@ -25,14 +25,13 @@ interface ManageServersRowDropdownConnectProps extends ManageServersRowDropdownP
export const ManageServersRowDropdown = (
DeleteServerModal: FC<DeleteServerModalProps>,
): FC<ManageServersRowDropdownConnectProps> => ({ server, setAutoConnect }) => {
const [isMenuOpen, toggleMenu] = useToggle();
const [isModalOpen,, showModal, hideModal] = useToggle();
const serverUrl = `/server/${server.id}`;
const { autoConnect: isAutoConnect } = server;
const autoConnectIcon = isAutoConnect ? toggleOffIcon : toggleOnIcon;
return (
<DropdownBtnMenu isOpen={isMenuOpen} toggle={toggleMenu}>
<RowDropdownBtn minWidth={170}>
<DropdownItem tag={Link} to={serverUrl}>
<FontAwesomeIcon icon={connectIcon} fixedWidth /> Connect
</DropdownItem>
@@ -48,6 +47,6 @@ export const ManageServersRowDropdown = (
</DropdownItem>
<DeleteServerModal redirectHome={false} server={server} isOpen={isModalOpen} toggle={hideModal} />
</DropdownBtnMenu>
</RowDropdownBtn>
);
};

View File

@@ -79,6 +79,8 @@ export interface ExportableShortUrl {
createdAt: string;
title: string;
shortUrl: string;
domain?: string;
shortCode: string;
longUrl: string;
tags: string;
visits: number;

View File

@@ -1,4 +1,5 @@
import type { FC } from 'react';
import { useCallback } from 'react';
import type { ShlinkApiClientBuilder } from '../../api/services/ShlinkApiClientBuilder';
import type { ReportExporter } from '../../common/services/ReportExporter';
import type { SelectedServer } from '../../servers/data';
@@ -24,7 +25,7 @@ export const ExportShortUrlsBtn = (
): FC<ExportShortUrlsBtnConnectProps> => ({ amount = 0, selectedServer }) => {
const [{ tags, search, startDate, endDate, orderBy, tagsMode }] = useShortUrlsQuery();
const [loading,, startLoading, stopLoading] = useToggle();
const exportAllUrls = async () => {
const exportAllUrls = useCallback(async () => {
if (!isServerWithId(selectedServer)) {
return;
}
@@ -47,16 +48,23 @@ export const ExportShortUrlsBtn = (
startLoading();
const shortUrls = await loadAllUrls();
exportShortUrls(shortUrls.map((shortUrl) => ({
createdAt: shortUrl.dateCreated,
shortUrl: shortUrl.shortUrl,
longUrl: shortUrl.longUrl,
title: shortUrl.title ?? '',
tags: shortUrl.tags.join(','),
visits: shortUrl?.visitsSummary?.total ?? shortUrl.visitsCount,
})));
exportShortUrls(shortUrls.map((shortUrl) => {
const { hostname: domain, pathname } = new URL(shortUrl.shortUrl);
const shortCode = pathname.substring(1); // Remove trailing slash
return {
createdAt: shortUrl.dateCreated,
domain,
shortCode,
shortUrl: shortUrl.shortUrl,
longUrl: shortUrl.longUrl,
title: shortUrl.title ?? '',
tags: shortUrl.tags.join('|'),
visits: shortUrl?.visitsSummary?.total ?? shortUrl.visitsCount,
};
}));
stopLoading();
};
}, [selectedServer]);
return <ExportBtn loading={loading} className="btn-md-block" amount={amount} onClick={exportAllUrls} />;
};

View File

@@ -17,7 +17,7 @@ export const ShortUrlsFilterDropdown = (
const onFilterClick = (key: keyof ShortUrlsFilter) => () => onChange({ ...selected, [key]: !selected?.[key] });
return (
<DropdownBtn text="Filters" dropdownClassName={className} className="me-3" right minWidth={250}>
<DropdownBtn text="Filters" dropdownClassName={className} inline end minWidth={250}>
<DropdownItem header>Visits:</DropdownItem>
<DropdownItem active={excludeBots} onClick={onFilterClick('excludeBots')}>Ignore visits from bots</DropdownItem>

View File

@@ -87,7 +87,7 @@ export const ShortUrlsRow = (
<td className="responsive-table__cell short-urls-row__cell" data-th="Status">
<ShortUrlStatus shortUrl={shortUrl} />
</td>
<td className="responsive-table__cell short-urls-row__cell">
<td className="responsive-table__cell short-urls-row__cell text-end">
<ShortUrlsRowMenu selectedServer={selectedServer} shortUrl={shortUrl} />
</td>
</tr>

View File

@@ -8,8 +8,8 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import type { FC } from 'react';
import { DropdownItem } from 'reactstrap';
import type { SelectedServer } from '../../servers/data';
import { DropdownBtnMenu } from '../../utils/DropdownBtnMenu';
import { useToggle } from '../../utils/helpers/hooks';
import { RowDropdownBtn } from '../../utils/RowDropdownBtn';
import type { ShortUrl, ShortUrlModalProps } from '../data';
import { ShortUrlDetailLink } from './ShortUrlDetailLink';
@@ -23,12 +23,11 @@ export const ShortUrlsRowMenu = (
DeleteShortUrlModal: ShortUrlModal,
QrCodeModal: ShortUrlModal,
) => ({ shortUrl, selectedServer }: ShortUrlsRowMenuProps) => {
const [isOpen, toggle] = useToggle();
const [isQrModalOpen,, openQrCodeModal, closeQrCodeModal] = useToggle();
const [isDeleteModalOpen,, openDeleteModal, closeDeleteModal] = useToggle();
return (
<DropdownBtnMenu toggle={toggle} isOpen={isOpen}>
<RowDropdownBtn minWidth={190}>
<DropdownItem tag={ShortUrlDetailLink} selectedServer={selectedServer} shortUrl={shortUrl} suffix="visits">
<FontAwesomeIcon icon={pieChartIcon} fixedWidth /> Visit stats
</DropdownItem>
@@ -48,7 +47,7 @@ export const ShortUrlsRowMenu = (
<FontAwesomeIcon icon={deleteIcon} fixedWidth /> Delete short URL
</DropdownItem>
<DeleteShortUrlModal shortUrl={shortUrl} isOpen={isDeleteModalOpen} toggle={closeDeleteModal} />
</DropdownBtnMenu>
</RowDropdownBtn>
);
};

View File

@@ -5,9 +5,9 @@ import { Link } from 'react-router-dom';
import { DropdownItem } from 'reactstrap';
import type { SelectedServer } from '../servers/data';
import { getServerId } from '../servers/data';
import { DropdownBtnMenu } from '../utils/DropdownBtnMenu';
import { useToggle } from '../utils/helpers/hooks';
import { prettify } from '../utils/helpers/numbers';
import { RowDropdownBtn } from '../utils/RowDropdownBtn';
import type { ColorGenerator } from '../utils/services/ColorGenerator';
import type { SimplifiedTag, TagModalProps } from './data';
import { TagBullet } from './helpers/TagBullet';
@@ -24,7 +24,6 @@ export const TagsTableRow = (
) => ({ tag, selectedServer }: TagsTableRowProps) => {
const [isDeleteModalOpen, toggleDelete] = useToggle();
const [isEditModalOpen, toggleEdit] = useToggle();
const [isDropdownOpen, toggleDropdown] = useToggle();
const serverId = getServerId(selectedServer);
return (
@@ -43,14 +42,14 @@ export const TagsTableRow = (
</Link>
</td>
<td className="responsive-table__cell text-lg-end">
<DropdownBtnMenu toggle={toggleDropdown} isOpen={isDropdownOpen}>
<RowDropdownBtn>
<DropdownItem onClick={toggleEdit}>
<FontAwesomeIcon icon={editIcon} fixedWidth className="me-1" /> Edit
</DropdownItem>
<DropdownItem onClick={toggleDelete}>
<FontAwesomeIcon icon={deleteIcon} fixedWidth className="me-1" /> Delete
</DropdownItem>
</DropdownBtnMenu>
</RowDropdownBtn>
</td>
<EditTagModal tag={tag.tag} toggle={toggleEdit} isOpen={isEditModalOpen} />

View File

@@ -2,13 +2,20 @@
@import '../utils/mixins/vertical-align';
.dropdown-btn__toggle.dropdown-btn__toggle {
text-align: left;
}
.dropdown-btn__toggle.dropdown-btn__toggle--with-caret {
padding-right: 1.75rem;
}
.dropdown-btn__toggle.dropdown-btn__toggle,
.dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled).active,
.dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):active,
.dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):focus,
.dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):hover,
.show > .dropdown-btn__toggle.dropdown-btn__toggle.dropdown-toggle {
text-align: left;
color: var(--input-text-color);
background-color: var(--primary-color);
border-color: var(--input-border-color);

View File

@@ -1,28 +1,45 @@
import type { FC, PropsWithChildren } from 'react';
import classNames from 'classnames';
import type { FC, PropsWithChildren, ReactNode } from 'react';
import { Dropdown, DropdownMenu, DropdownToggle } from 'reactstrap';
import type { DropdownToggleProps } from 'reactstrap/types/lib/DropdownToggle';
import { useToggle } from './helpers/hooks';
import './DropdownBtn.scss';
export type DropdownBtnProps = PropsWithChildren<{
text: string;
disabled?: boolean;
export type DropdownBtnProps = PropsWithChildren<Omit<DropdownToggleProps, 'caret' | 'size' | 'outline'> & {
text: ReactNode;
noCaret?: boolean;
className?: string;
dropdownClassName?: string;
right?: boolean;
inline?: boolean;
minWidth?: number;
size?: 'sm' | 'md' | 'lg';
}>;
export const DropdownBtn: FC<DropdownBtnProps> = (
{ text, disabled = false, className = '', children, dropdownClassName, right = false, minWidth },
) => {
export const DropdownBtn: FC<DropdownBtnProps> = ({
text,
disabled = false,
className,
children,
dropdownClassName,
noCaret,
end = false,
minWidth,
inline,
size,
}) => {
const [isOpen, toggle] = useToggle();
const toggleClasses = `dropdown-btn__toggle btn-block ${className}`;
const style = { minWidth: minWidth && `${minWidth}px` };
const toggleClasses = classNames('dropdown-btn__toggle', className, {
'btn-block': !inline,
'dropdown-btn__toggle--with-caret': !noCaret,
});
const menuStyle = { minWidth: minWidth && `${minWidth}px` };
return (
<Dropdown isOpen={isOpen} toggle={toggle} disabled={disabled} className={dropdownClassName}>
<DropdownToggle caret className={toggleClasses} color="primary">{text}</DropdownToggle>
<DropdownMenu className="w-100" end={right} style={style}>{children}</DropdownMenu>
<DropdownToggle size={size} caret={!noCaret} className={toggleClasses} color="primary">
{text}
</DropdownToggle>
<DropdownMenu className="w-100" end={end} style={menuStyle}>{children}</DropdownMenu>
</Dropdown>
);
};

View File

@@ -1,3 +0,0 @@
.dropdown-btn-menu__dropdown-toggle:after {
display: none !important;
}

View File

@@ -1,20 +0,0 @@
import { faEllipsisV as menuIcon } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import type { FC, PropsWithChildren } from 'react';
import { ButtonDropdown, DropdownMenu, DropdownToggle } from 'reactstrap';
import './DropdownBtnMenu.scss';
export type DropdownBtnMenuProps = PropsWithChildren<{
isOpen: boolean;
toggle: () => void;
right?: boolean;
}>;
export const DropdownBtnMenu: FC<DropdownBtnMenuProps> = ({ isOpen, toggle, children, right = true }) => (
<ButtonDropdown toggle={toggle} isOpen={isOpen}>
<DropdownToggle size="sm" caret outline className="dropdown-btn-menu__dropdown-toggle">
&nbsp;<FontAwesomeIcon icon={menuIcon} />&nbsp;
</DropdownToggle>
<DropdownMenu end={right}>{children}</DropdownMenu>
</ButtonDropdown>
);

View File

@@ -5,10 +5,10 @@ import type { ButtonProps } from 'reactstrap';
import { Button } from 'reactstrap';
import { prettify } from './helpers/numbers';
interface ExportBtnProps extends Omit<ButtonProps, 'outline' | 'color' | 'disabled'> {
type ExportBtnProps = Omit<ButtonProps, 'outline' | 'color' | 'disabled'> & {
amount?: number;
loading?: boolean;
}
};
export const ExportBtn: FC<ExportBtnProps> = ({ amount = 0, loading = false, ...rest }) => (
<Button {...rest} outline color="primary" disabled={loading}>

View File

@@ -0,0 +1,21 @@
import { faEllipsisV as menuIcon } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import type { FC, PropsWithChildren } from 'react';
import { DropdownBtn } from './DropdownBtn';
export type DropdownBtnMenuProps = PropsWithChildren<{
minWidth?: number;
}>;
export const RowDropdownBtn: FC<DropdownBtnMenuProps> = ({ children, minWidth }) => (
<DropdownBtn
text={<FontAwesomeIcon className="px-1" icon={menuIcon} />}
size="sm"
minWidth={minWidth}
end
noCaret
inline
>
{children}
</DropdownBtn>
);

View File

@@ -22,7 +22,7 @@ export const VisitsFilterDropdown = (
const onBotsClick = () => onChange({ ...selected, excludeBots: !selected?.excludeBots });
return (
<DropdownBtn text="Filters" dropdownClassName={className} className="me-3" right minWidth={250}>
<DropdownBtn text="Filters" dropdownClassName={className} inline end minWidth={250}>
<DropdownItem header>Bots:</DropdownItem>
<DropdownItem active={excludeBots} onClick={onBotsClick}>Exclude potential bots</DropdownItem>

View File

@@ -1,32 +0,0 @@
const jestConfig = require(`${__dirname}/jest.config.js`);
module.exports = {
mutate: jestConfig.collectCoverageFrom,
checkers: [ 'typescript' ],
tsconfigFile: 'tsconfig.json',
testRunner: 'jest',
reporters: [ 'progress', 'clear-text' ],
ignorePatterns: [
'coverage',
'reports',
'build',
'dist',
'home',
'scripts',
'docker-compose.*',
'public/servers.json*',
],
jest: {
projectType: 'custom',
config: jestConfig,
enableFindRelatedTests: true,
},
thresholds: {
high: 80,
low: 60,
break: null,
},
clearTextReporter: {
logTests: false,
},
};

View File

@@ -5,7 +5,11 @@ import type { ReactElement } from 'react';
export const setUpCanvas = (element: ReactElement) => {
const result = render(element);
const { container } = result;
const getEvents = () => container.querySelector('canvas')?.getContext('2d')?.__getEvents(); // eslint-disable-line no-underscore-dangle
const getEvents = () => {
const context = container.querySelector('canvas')?.getContext('2d');
// @ts-expect-error __getEvents is set by vitest-canvas-mock
return context?.__getEvents(); // eslint-disable-line no-underscore-dangle
};
return { ...result, events: getEvents(), getEvents };
};

View File

@@ -1,18 +1,18 @@
import { Mock } from 'ts-mockery';
import { fromAny, fromPartial } from '@total-typescript/shoehorn';
const createLinkMock = () => ({
setAttribute: jest.fn(),
click: jest.fn(),
setAttribute: vi.fn(),
click: vi.fn(),
style: {},
});
export const appendChild = jest.fn();
export const appendChild = vi.fn();
export const removeChild = jest.fn();
export const removeChild = vi.fn();
export const windowMock = Mock.of<Window>({
document: {
createElement: jest.fn(createLinkMock),
export const windowMock = fromPartial<Window>({
document: fromAny({
createElement: vi.fn(createLinkMock),
body: { appendChild, removeChild },
},
}),
});

View File

@@ -1,5 +1,5 @@
import { render, screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShlinkApiErrorProps } from '../../src/api/ShlinkApiError';
import { ShlinkApiError } from '../../src/api/ShlinkApiError';
import type { InvalidArgumentError, ProblemDetailsError } from '../../src/api/types/errors';
@@ -10,8 +10,8 @@ describe('<ShlinkApiError />', () => {
it.each([
[undefined, 'the fallback', 'the fallback'],
[Mock.all<ProblemDetailsError>(), 'the fallback', 'the fallback'],
[Mock.of<ProblemDetailsError>({ detail: 'the detail' }), 'the fallback', 'the detail'],
[fromPartial<ProblemDetailsError>({}), 'the fallback', 'the fallback'],
[fromPartial<ProblemDetailsError>({ detail: 'the detail' }), 'the fallback', 'the detail'],
])('renders proper message', (errorData, fallbackMessage, expectedMessage) => {
const { container } = setUp({ errorData, fallbackMessage });
@@ -21,9 +21,9 @@ describe('<ShlinkApiError />', () => {
it.each([
[undefined, 0],
[Mock.all<ProblemDetailsError>(), 0],
[Mock.of<InvalidArgumentError>({ type: ErrorTypeV2.INVALID_ARGUMENT, invalidElements: [] }), 1],
[Mock.of<InvalidArgumentError>({ type: ErrorTypeV3.INVALID_ARGUMENT, invalidElements: [] }), 1],
[fromPartial<ProblemDetailsError>({}), 0],
[fromPartial<InvalidArgumentError>({ type: ErrorTypeV2.INVALID_ARGUMENT, invalidElements: [] }), 1],
[fromPartial<InvalidArgumentError>({ type: ErrorTypeV3.INVALID_ARGUMENT, invalidElements: [] }), 1],
])('renders list of invalid elements when provided error is an InvalidError', (errorData, expectedElementsCount) => {
setUp({ errorData });
expect(screen.queryAllByText(/^Invalid elements/)).toHaveLength(expectedElementsCount);

View File

@@ -1,4 +1,4 @@
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import { ShlinkApiClient } from '../../../src/api/services/ShlinkApiClient';
import type { ShlinkDomain, ShlinkVisits, ShlinkVisitsOverview } from '../../../src/api/types';
import { ErrorTypeV2, ErrorTypeV3 } from '../../../src/api/types/errors';
@@ -7,9 +7,9 @@ import type { ShortUrl, ShortUrlsOrder } from '../../../src/short-urls/data';
import type { OptionalString } from '../../../src/utils/utils';
describe('ShlinkApiClient', () => {
const fetchJson = jest.fn().mockResolvedValue({});
const fetchEmpty = jest.fn().mockResolvedValue(undefined);
const httpClient = Mock.of<HttpClient>({ fetchJson, fetchEmpty });
const fetchJson = vi.fn().mockResolvedValue({});
const fetchEmpty = vi.fn().mockResolvedValue(undefined);
const httpClient = fromPartial<HttpClient>({ fetchJson, fetchEmpty });
const buildApiClient = () => new ShlinkApiClient(httpClient, '', '');
const shortCodesWithDomainCombinations: [string, OptionalString][] = [
['abc123', null],
@@ -17,8 +17,6 @@ describe('ShlinkApiClient', () => {
['abc123', 'example.com'],
];
beforeEach(jest.clearAllMocks);
describe('listShortUrls', () => {
const expectedList = ['foo', 'bar'];
@@ -177,7 +175,7 @@ describe('ShlinkApiClient', () => {
maxVisits: 50,
validSince: '2025-01-01T10:00:00+01:00',
};
const expectedResp = Mock.of<ShortUrl>();
const expectedResp = fromPartial<ShortUrl>({});
fetchJson.mockResolvedValue(expectedResp);
const { updateShortUrl } = buildApiClient();
const expectedQuery = domain ? `?domain=${domain}` : '';
@@ -311,7 +309,7 @@ describe('ShlinkApiClient', () => {
describe('listDomains', () => {
it('returns domains', async () => {
const expectedData = { data: [Mock.all<ShlinkDomain>(), Mock.all<ShlinkDomain>()] };
const expectedData = { data: [fromPartial<ShlinkDomain>({}), fromPartial<ShlinkDomain>({})] };
fetchJson.mockResolvedValue({ domains: expectedData });
const { listDomains } = buildApiClient();
@@ -324,7 +322,7 @@ describe('ShlinkApiClient', () => {
describe('getVisitsOverview', () => {
it('returns visits overview', async () => {
const expectedData = Mock.all<ShlinkVisitsOverview>();
const expectedData = fromPartial<ShlinkVisitsOverview>({});
fetchJson.mockResolvedValue({ visits: expectedData });
const { getVisitsOverview } = buildApiClient();
@@ -337,7 +335,7 @@ describe('ShlinkApiClient', () => {
describe('getOrphanVisits', () => {
it('returns orphan visits', async () => {
fetchJson.mockResolvedValue({ visits: Mock.of<ShlinkVisits>({ data: [] }) });
fetchJson.mockResolvedValue({ visits: fromPartial<ShlinkVisits>({ data: [] }) });
const { getOrphanVisits } = buildApiClient();
const result = await getOrphanVisits();
@@ -349,7 +347,7 @@ describe('ShlinkApiClient', () => {
describe('getNonOrphanVisits', () => {
it('returns non-orphan visits', async () => {
fetchJson.mockResolvedValue({ visits: Mock.of<ShlinkVisits>({ data: [] }) });
fetchJson.mockResolvedValue({ visits: fromPartial<ShlinkVisits>({ data: [] }) });
const { getNonOrphanVisits } = buildApiClient();
const result = await getNonOrphanVisits();

View File

@@ -1,15 +1,13 @@
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import { buildShlinkApiClient } from '../../../src/api/services/ShlinkApiClientBuilder';
import type { HttpClient } from '../../../src/common/services/HttpClient';
import type { ShlinkState } from '../../../src/container/types';
import type { ReachableServer, SelectedServer } from '../../../src/servers/data';
describe('ShlinkApiClientBuilder', () => {
const server = (data: Partial<ReachableServer>) => Mock.of<ReachableServer>(data);
const server = fromPartial<ReachableServer>;
const createBuilder = () => {
const builder = buildShlinkApiClient(Mock.of<HttpClient>());
return (selectedServer: SelectedServer) => builder(() => Mock.of<ShlinkState>({ selectedServer }));
const builder = buildShlinkApiClient(fromPartial({}));
return (selectedServer: SelectedServer) => builder(() => fromPartial({ selectedServer }));
};
it('creates new instances when provided params are different', async () => {
@@ -42,7 +40,7 @@ describe('ShlinkApiClientBuilder', () => {
it('does not fetch from state when provided param is already selected server', () => {
const url = 'url';
const apiKey = 'apiKey';
const apiClient = buildShlinkApiClient(Mock.of<HttpClient>())(server({ url, apiKey }));
const apiClient = buildShlinkApiClient(fromPartial({}))(server({ url, apiKey }));
expect(apiClient['baseUrl']).toEqual(url); // eslint-disable-line @typescript-eslint/dot-notation
expect(apiClient['apiKey']).toEqual(apiKey); // eslint-disable-line @typescript-eslint/dot-notation

View File

@@ -1,9 +1,8 @@
import { render, screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { createMemoryHistory } from 'history';
import { Router } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import { App as createApp } from '../../src/app/App';
import type { Settings } from '../../src/settings/reducers/settings';
describe('<App />', () => {
const App = createApp(
@@ -25,7 +24,7 @@ describe('<App />', () => {
<App
fetchServers={() => {}}
servers={{}}
settings={Mock.all<Settings>()}
settings={fromPartial({})}
appUpdated
resetAppUpdate={() => {}}
/>
@@ -33,8 +32,6 @@ describe('<App />', () => {
);
};
afterEach(jest.clearAllMocks);
it('renders children components', () => {
setUp();

View File

@@ -3,12 +3,10 @@ import { AppUpdateBanner } from '../../src/common/AppUpdateBanner';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<AppUpdateBanner />', () => {
const toggle = jest.fn();
const forceUpdate = jest.fn();
const toggle = vi.fn();
const forceUpdate = vi.fn();
const setUp = () => renderWithEvents(<AppUpdateBanner isOpen toggle={toggle} forceUpdate={forceUpdate} />);
afterEach(jest.clearAllMocks);
it('renders initial state', () => {
setUp();

View File

@@ -1,14 +1,13 @@
import { render, screen } from '@testing-library/react';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter } from 'react-router';
import { AsideMenu as createAsideMenu } from '../../src/common/AsideMenu';
import type { ReachableServer } from '../../src/servers/data';
describe('<AsideMenu />', () => {
const AsideMenu = createAsideMenu(() => <>DeleteServerButton</>);
const setUp = (id: string | false = 'abc123') => render(
<MemoryRouter>
<AsideMenu selectedServer={Mock.of<ReachableServer>({ id: id || undefined, version: '2.8.0' })} />
<AsideMenu selectedServer={fromPartial({ id: id || undefined, version: '2.8.0' })} />
</MemoryRouter>,
);

View File

@@ -1,5 +1,5 @@
import { render, screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import { ErrorHandler as createErrorHandler } from '../../src/common/ErrorHandler';
import { renderWithEvents } from '../__helpers__/setUpTest';
@@ -8,17 +8,16 @@ const ComponentWithError = () => {
};
describe('<ErrorHandler />', () => {
const reload = jest.fn();
const window = Mock.of<Window>({
const reload = vi.fn();
const window = fromPartial<Window>({
location: { reload },
});
const cons = Mock.of<Console>({ error: jest.fn() });
const cons = fromPartial<Console>({ error: vi.fn() });
const ErrorHandler = createErrorHandler(window, cons);
beforeEach(() => {
jest.spyOn(console, 'error').mockImplementation(() => {}); // Silence react errors
vi.spyOn(console, 'error').mockImplementation(() => {}); // Silence react errors
});
afterEach(jest.resetAllMocks);
it('renders children when no error has occurred', () => {
render(<ErrorHandler children={<span>Foo</span>} />);

View File

@@ -1,6 +1,6 @@
import { render, screen } from '@testing-library/react';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter } from 'react-router';
import { Home } from '../../src/common/Home';
import type { ServersMap, ServerWithId } from '../../src/servers/data';
@@ -19,9 +19,9 @@ describe('<Home />', () => {
it.each([
[
{
'1a': Mock.of<ServerWithId>({ name: 'foo', id: '1' }),
'2b': Mock.of<ServerWithId>({ name: 'bar', id: '2' }),
'3c': Mock.of<ServerWithId>({ name: 'baz', id: '3' }),
'1a': fromPartial<ServerWithId>({ name: 'foo', id: '1' }),
'2b': fromPartial<ServerWithId>({ name: 'bar', id: '2' }),
'3c': fromPartial<ServerWithId>({ name: 'baz', id: '3' }),
},
3,
],

View File

@@ -1,12 +1,12 @@
import { render, screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { createMemoryHistory } from 'history';
import { Router, useParams } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import { MenuLayout as createMenuLayout } from '../../src/common/MenuLayout';
import type { NonReachableServer, NotFoundServer, ReachableServer, SelectedServer } from '../../src/servers/data';
import type { NonReachableServer, NotFoundServer, SelectedServer } from '../../src/servers/data';
import type { SemVer } from '../../src/utils/helpers/version';
jest.mock('react-router-dom', () => ({ ...jest.requireActual('react-router-dom'), useParams: jest.fn() }));
vi.mock('react-router-dom', async () => ({ ...(await vi.importActual<any>('react-router-dom')), useParams: vi.fn() }));
describe('<MenuLayout />', () => {
const MenuLayout = createMenuLayout(
@@ -31,9 +31,9 @@ describe('<MenuLayout />', () => {
return render(
<Router location={history.location} navigator={history}>
<MenuLayout
sidebarNotPresent={jest.fn()}
sidebarPresent={jest.fn()}
selectServer={jest.fn()}
sidebarNotPresent={vi.fn()}
sidebarPresent={vi.fn()}
selectServer={vi.fn()}
selectedServer={selectedServer}
/>
</Router>,
@@ -44,8 +44,6 @@ describe('<MenuLayout />', () => {
(useParams as any).mockReturnValue({ serverId: 'abc123' });
});
afterEach(jest.clearAllMocks);
it('shows loading indicator while loading server', () => {
setUp(null);
@@ -54,8 +52,8 @@ describe('<MenuLayout />', () => {
});
it.each([
[Mock.of<NotFoundServer>({ serverNotFound: true })],
[Mock.of<NonReachableServer>({ serverNotReachable: true })],
[fromPartial<NotFoundServer>({ serverNotFound: true })],
[fromPartial<NonReachableServer>({ serverNotReachable: true })],
])('shows error for non reachable servers', (selectedServer) => {
setUp(selectedServer);
@@ -81,7 +79,7 @@ describe('<MenuLayout />', () => {
])(
'renders expected component based on location and server version',
(version, currentPath, expectedContent) => {
setUp(Mock.of<ReachableServer>({ version }), currentPath);
setUp(fromPartial({ version }), currentPath);
expect(screen.getByText(expectedContent)).toBeInTheDocument();
},
);

View File

@@ -1,5 +1,5 @@
import { render, screen } from '@testing-library/react';
import { MemoryRouter } from 'react-router-dom';
import { MemoryRouter } from 'react-router';
import { NotFound } from '../../src/common/NotFound';
describe('<NotFound />', () => {

View File

@@ -1,5 +1,5 @@
import { render, screen } from '@testing-library/react';
import { MemoryRouter } from 'react-router-dom';
import { MemoryRouter } from 'react-router';
import { ScrollToTop } from '../../src/common/ScrollToTop';
describe('<ScrollToTop />', () => {

View File

@@ -1,5 +1,5 @@
import { render, screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShlinkVersionsProps } from '../../src/common/ShlinkVersions';
import { ShlinkVersions } from '../../src/common/ShlinkVersions';
import type { NonReachableServer, NotFoundServer, ReachableServer } from '../../src/servers/data';
@@ -8,11 +8,11 @@ describe('<ShlinkVersions />', () => {
const setUp = (props: ShlinkVersionsProps) => render(<ShlinkVersions {...props} />);
it.each([
['1.2.3', Mock.of<ReachableServer>({ version: '1.0.0', printableVersion: 'foo' }), 'v1.2.3', 'foo'],
['foo', Mock.of<ReachableServer>({ version: '1.0.0', printableVersion: '1.2.3' }), 'latest', '1.2.3'],
['latest', Mock.of<ReachableServer>({ version: '1.0.0', printableVersion: 'latest' }), 'latest', 'latest'],
['5.5.0', Mock.of<ReachableServer>({ version: '1.0.0', printableVersion: '0.2.8' }), 'v5.5.0', '0.2.8'],
['not-semver', Mock.of<ReachableServer>({ version: '1.0.0', printableVersion: 'some' }), 'latest', 'some'],
['1.2.3', fromPartial<ReachableServer>({ version: '1.0.0', printableVersion: 'foo' }), 'v1.2.3', 'foo'],
['foo', fromPartial<ReachableServer>({ version: '1.0.0', printableVersion: '1.2.3' }), 'latest', '1.2.3'],
['latest', fromPartial<ReachableServer>({ version: '1.0.0', printableVersion: 'latest' }), 'latest', 'latest'],
['5.5.0', fromPartial<ReachableServer>({ version: '1.0.0', printableVersion: '0.2.8' }), 'v5.5.0', '0.2.8'],
['not-semver', fromPartial<ReachableServer>({ version: '1.0.0', printableVersion: 'some' }), 'latest', 'some'],
])(
'displays expected versions when selected server is reachable',
(clientVersion, selectedServer, expectedClientVersion, expectedServerVersion) => {
@@ -34,8 +34,8 @@ describe('<ShlinkVersions />', () => {
it.each([
['1.2.3', null],
['1.2.3', Mock.of<NotFoundServer>({ serverNotFound: true })],
['1.2.3', Mock.of<NonReachableServer>({ serverNotReachable: true })],
['1.2.3', fromPartial<NotFoundServer>({ serverNotFound: true })],
['1.2.3', fromPartial<NonReachableServer>({ serverNotReachable: true })],
])('displays only client version when selected server is not reachable', (clientVersion, selectedServer) => {
setUp({ clientVersion, selectedServer });
const links = screen.getAllByRole('link');

View File

@@ -1,12 +1,11 @@
import { render } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { Sidebar } from '../../src/common/reducers/sidebar';
import { ShlinkVersionsContainer } from '../../src/common/ShlinkVersionsContainer';
import type { SelectedServer } from '../../src/servers/data';
describe('<ShlinkVersionsContainer />', () => {
const setUp = (sidebar: Sidebar) => render(
<ShlinkVersionsContainer selectedServer={Mock.all<SelectedServer>()} sidebar={sidebar} />,
<ShlinkVersionsContainer selectedServer={fromPartial({})} sidebar={sidebar} />,
);
it.each([

View File

@@ -4,7 +4,7 @@ import { ELLIPSIS } from '../../src/utils/helpers/pagination';
describe('<SimplePaginator />', () => {
const setUp = (pagesCount: number, currentPage = 1) => render(
<SimplePaginator pagesCount={pagesCount} currentPage={currentPage} setCurrentPage={jest.fn()} />,
<SimplePaginator pagesCount={pagesCount} currentPage={currentPage} setCurrentPage={vi.fn()} />,
);
it.each([-3, -2, 0, 1])('renders empty when the amount of pages is smaller than 2', (pagesCount) => {

View File

@@ -1,11 +1,9 @@
import { HttpClient } from '../../../src/common/services/HttpClient';
describe('HttpClient', () => {
const fetch = jest.fn();
const fetch = vi.fn();
const httpClient = new HttpClient(fetch);
beforeEach(jest.clearAllMocks);
describe('fetchJson', () => {
it('throws json on success', async () => {
const theError = { error: true, foo: 'bar' };

View File

@@ -1,15 +1,14 @@
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { HttpClient } from '../../../src/common/services/HttpClient';
import { ImageDownloader } from '../../../src/common/services/ImageDownloader';
import { windowMock } from '../../__mocks__/Window.mock';
describe('ImageDownloader', () => {
const fetchBlob = jest.fn();
const httpClient = Mock.of<HttpClient>({ fetchBlob });
const fetchBlob = vi.fn();
const httpClient = fromPartial<HttpClient>({ fetchBlob });
let imageDownloader: ImageDownloader;
beforeEach(() => {
jest.clearAllMocks();
(global as any).URL = { createObjectURL: () => '' };
imageDownloader = new ImageDownloader(httpClient, windowMock);

View File

@@ -4,10 +4,9 @@ import type { NormalizedVisit } from '../../../src/visits/types';
import { windowMock } from '../../__mocks__/Window.mock';
describe('ReportExporter', () => {
const jsonToCsv = jest.fn();
const jsonToCsv = vi.fn();
let exporter: ReportExporter;
beforeEach(jest.clearAllMocks);
beforeEach(() => {
(global as any).Blob = class Blob {};
(global as any).URL = { createObjectURL: () => '' };
@@ -53,6 +52,7 @@ describe('ReportExporter', () => {
createdAt: '',
longUrl: '',
tags: '',
shortCode: '',
},
];

View File

@@ -1,17 +1,16 @@
import { render, screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShlinkDomainRedirects } from '../../src/api/types';
import type { Domain } from '../../src/domains/data';
import { DomainRow } from '../../src/domains/DomainRow';
import type { SelectedServer } from '../../src/servers/data';
describe('<DomainRow />', () => {
const redirectsCombinations = [
[Mock.of<ShlinkDomainRedirects>({ baseUrlRedirect: 'foo' })],
[Mock.of<ShlinkDomainRedirects>({ invalidShortUrlRedirect: 'bar' })],
[Mock.of<ShlinkDomainRedirects>({ baseUrlRedirect: 'baz', regular404Redirect: 'foo' })],
[fromPartial<ShlinkDomainRedirects>({ baseUrlRedirect: 'foo' })],
[fromPartial<ShlinkDomainRedirects>({ invalidShortUrlRedirect: 'bar' })],
[fromPartial<ShlinkDomainRedirects>({ baseUrlRedirect: 'baz', regular404Redirect: 'foo' })],
[
Mock.of<ShlinkDomainRedirects>(
fromPartial<ShlinkDomainRedirects>(
{ baseUrlRedirect: 'baz', regular404Redirect: 'bar', invalidShortUrlRedirect: 'foo' },
),
],
@@ -22,16 +21,16 @@ describe('<DomainRow />', () => {
<DomainRow
domain={domain}
defaultRedirects={defaultRedirects}
selectedServer={Mock.all<SelectedServer>()}
editDomainRedirects={jest.fn()}
checkDomainHealth={jest.fn()}
selectedServer={fromPartial({})}
editDomainRedirects={vi.fn()}
checkDomainHealth={vi.fn()}
/>
</tbody>
</table>,
);
it.each(redirectsCombinations)('shows expected redirects', (redirects) => {
setUp(Mock.of<Domain>({ domain: '', isDefault: true, redirects }));
setUp(fromPartial({ domain: '', isDefault: true, redirects }));
const cells = screen.getAllByRole('cell');
redirects?.baseUrlRedirect && expect(cells[1]).toHaveTextContent(redirects.baseUrlRedirect);
@@ -42,9 +41,9 @@ describe('<DomainRow />', () => {
it.each([
[undefined],
[Mock.of<ShlinkDomainRedirects>()],
[fromPartial<ShlinkDomainRedirects>({})],
])('shows expected "no redirects"', (redirects) => {
setUp(Mock.of<Domain>({ domain: '', isDefault: true, redirects }));
setUp(fromPartial({ domain: '', isDefault: true, redirects }));
const cells = screen.getAllByRole('cell');
expect(cells[1]).toHaveTextContent('No redirect');
@@ -54,7 +53,7 @@ describe('<DomainRow />', () => {
});
it.each(redirectsCombinations)('shows expected fallback redirects', (fallbackRedirects) => {
setUp(Mock.of<Domain>({ domain: '', isDefault: true }), fallbackRedirects);
setUp(fromPartial({ domain: '', isDefault: true }), fallbackRedirects);
const cells = screen.getAllByRole('cell');
fallbackRedirects?.baseUrlRedirect && expect(cells[1]).toHaveTextContent(
@@ -69,7 +68,7 @@ describe('<DomainRow />', () => {
});
it.each([[true], [false]])('shows icon on default domain only', (isDefault) => {
const { container } = setUp(Mock.of<Domain>({ domain: '', isDefault }));
const { container } = setUp(fromPartial({ domain: '', isDefault }));
if (isDefault) {
expect(container.querySelector('#defaultDomainIcon')).toBeInTheDocument();

View File

@@ -1,24 +1,21 @@
import { screen, waitFor } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import type { ShlinkDomain } from '../../src/api/types';
import { fromPartial } from '@total-typescript/shoehorn';
import { DomainSelector } from '../../src/domains/DomainSelector';
import type { DomainsList } from '../../src/domains/reducers/domainsList';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<DomainSelector />', () => {
const domainsList = Mock.of<DomainsList>({
const domainsList = fromPartial<DomainsList>({
domains: [
Mock.of<ShlinkDomain>({ domain: 'default.com', isDefault: true }),
Mock.of<ShlinkDomain>({ domain: 'foo.com' }),
Mock.of<ShlinkDomain>({ domain: 'bar.com' }),
fromPartial({ domain: 'default.com', isDefault: true }),
fromPartial({ domain: 'foo.com' }),
fromPartial({ domain: 'bar.com' }),
],
});
const setUp = (value = '') => renderWithEvents(
<DomainSelector value={value} domainsList={domainsList} listDomains={jest.fn()} onChange={jest.fn()} />,
<DomainSelector value={value} domainsList={domainsList} listDomains={vi.fn()} onChange={vi.fn()} />,
);
afterEach(jest.clearAllMocks);
it.each([
['', 'Domain', 'domains-dropdown__toggle-btn'],
['my-domain.com', 'Domain: my-domain.com', 'domains-dropdown__toggle-btn--active'],
@@ -27,9 +24,8 @@ describe('<DomainSelector />', () => {
const btn = screen.getByRole('button', { name: expectedText });
expect(screen.queryByPlaceholderText('Domain')).not.toBeInTheDocument();
expect(btn).toHaveAttribute(
'class',
`dropdown-btn__toggle btn-block ${expectedClassName} dropdown-toggle btn btn-primary`,
expect(btn).toHaveClass(
`dropdown-btn__toggle ${expectedClassName} btn-block dropdown-btn__toggle--with-caret dropdown-toggle btn btn-primary`,
);
await user.click(btn);

View File

@@ -1,30 +1,27 @@
import { screen, waitFor } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShlinkDomain } from '../../src/api/types';
import type { ProblemDetailsError } from '../../src/api/types/errors';
import { ManageDomains } from '../../src/domains/ManageDomains';
import type { DomainsList } from '../../src/domains/reducers/domainsList';
import type { SelectedServer } from '../../src/servers/data';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<ManageDomains />', () => {
const listDomains = jest.fn();
const filterDomains = jest.fn();
const listDomains = vi.fn();
const filterDomains = vi.fn();
const setUp = (domainsList: DomainsList) => renderWithEvents(
<ManageDomains
listDomains={listDomains}
filterDomains={filterDomains}
editDomainRedirects={jest.fn()}
checkDomainHealth={jest.fn()}
editDomainRedirects={vi.fn()}
checkDomainHealth={vi.fn()}
domainsList={domainsList}
selectedServer={Mock.all<SelectedServer>()}
selectedServer={fromPartial({})}
/>,
);
afterEach(jest.clearAllMocks);
it('shows loading message while domains are loading', () => {
setUp(Mock.of<DomainsList>({ loading: true, filteredDomains: [] }));
setUp(fromPartial({ loading: true, filteredDomains: [] }));
expect(screen.getByText('Loading...')).toBeInTheDocument();
expect(screen.queryByText('Error loading domains :(')).not.toBeInTheDocument();
@@ -32,17 +29,17 @@ describe('<ManageDomains />', () => {
it.each([
[undefined, 'Error loading domains :('],
[Mock.of<ProblemDetailsError>(), 'Error loading domains :('],
[Mock.of<ProblemDetailsError>({ detail: 'Foo error!!' }), 'Foo error!!'],
[fromPartial<ProblemDetailsError>({}), 'Error loading domains :('],
[fromPartial<ProblemDetailsError>({ detail: 'Foo error!!' }), 'Foo error!!'],
])('shows error result when domains loading fails', (errorData, expectedErrorMessage) => {
setUp(Mock.of<DomainsList>({ loading: false, error: true, errorData, filteredDomains: [] }));
setUp(fromPartial({ loading: false, error: true, errorData, filteredDomains: [] }));
expect(screen.queryByText('Loading...')).not.toBeInTheDocument();
expect(screen.getByText(expectedErrorMessage)).toBeInTheDocument();
});
it('filters domains when SearchField changes', async () => {
const { user } = setUp(Mock.of<DomainsList>({ loading: false, error: false, filteredDomains: [] }));
const { user } = setUp(fromPartial({ loading: false, error: false, filteredDomains: [] }));
expect(filterDomains).not.toHaveBeenCalled();
await user.type(screen.getByPlaceholderText('Search...'), 'Foo');
@@ -50,19 +47,19 @@ describe('<ManageDomains />', () => {
});
it('shows expected headers and one row when list of domains is empty', () => {
setUp(Mock.of<DomainsList>({ loading: false, error: false, filteredDomains: [] }));
setUp(fromPartial({ loading: false, error: false, filteredDomains: [] }));
expect(screen.getAllByRole('columnheader')).toHaveLength(7);
expect(screen.getByText('No results found')).toBeInTheDocument();
});
it('has many rows if multiple domains are provided', () => {
const filteredDomains = [
Mock.of<ShlinkDomain>({ domain: 'foo' }),
Mock.of<ShlinkDomain>({ domain: 'bar' }),
Mock.of<ShlinkDomain>({ domain: 'baz' }),
const filteredDomains: ShlinkDomain[] = [
fromPartial({ domain: 'foo' }),
fromPartial({ domain: 'bar' }),
fromPartial({ domain: 'baz' }),
];
setUp(Mock.of<DomainsList>({ loading: false, error: false, filteredDomains }));
setUp(fromPartial({ loading: false, error: false, filteredDomains }));
expect(screen.getAllByRole('row')).toHaveLength(filteredDomains.length + 1);
expect(screen.getByText('foo')).toBeInTheDocument();

View File

@@ -1,26 +1,24 @@
import { screen, waitForElementToBeRemoved } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { Domain } from '../../../src/domains/data';
import { DomainDropdown } from '../../../src/domains/helpers/DomainDropdown';
import type { ReachableServer, SelectedServer } from '../../../src/servers/data';
import type { SelectedServer } from '../../../src/servers/data';
import type { SemVer } from '../../../src/utils/helpers/version';
import { renderWithEvents } from '../../__helpers__/setUpTest';
describe('<DomainDropdown />', () => {
const editDomainRedirects = jest.fn().mockResolvedValue(undefined);
const editDomainRedirects = vi.fn().mockResolvedValue(undefined);
const setUp = (domain?: Domain, selectedServer?: SelectedServer) => renderWithEvents(
<MemoryRouter>
<DomainDropdown
domain={domain ?? Mock.all<Domain>()}
selectedServer={selectedServer ?? Mock.all<SelectedServer>()}
domain={domain ?? fromPartial({})}
selectedServer={selectedServer ?? fromPartial({})}
editDomainRedirects={editDomainRedirects}
/>
</MemoryRouter>,
);
afterEach(jest.clearAllMocks);
it('renders expected menu items', () => {
setUp();
@@ -33,8 +31,8 @@ describe('<DomainDropdown />', () => {
[false, ''],
])('points first link to the proper section', (isDefault, expectedLink) => {
setUp(
Mock.of<Domain>({ domain: 'foo.com', isDefault }),
Mock.of<ReachableServer>({ version: '3.1.0', id: '123' }),
fromPartial({ domain: 'foo.com', isDefault }),
fromPartial({ version: '3.1.0', id: '123' }),
);
expect(screen.getByText('Visit stats')).toHaveAttribute('href', `/server/123/domain/foo.com${expectedLink}/visits`);
@@ -46,8 +44,8 @@ describe('<DomainDropdown />', () => {
[false, '2.9.0' as SemVer, true],
])('allows editing certain the domains', (isDefault, serverVersion, canBeEdited) => {
setUp(
Mock.of<Domain>({ domain: 'foo.com', isDefault }),
Mock.of<ReachableServer>({ version: serverVersion, id: '123' }),
fromPartial({ domain: 'foo.com', isDefault }),
fromPartial({ version: serverVersion, id: '123' }),
);
if (canBeEdited) {
@@ -62,7 +60,7 @@ describe('<DomainDropdown />', () => {
['bar.org'],
['baz.net'],
])('displays modal when editing redirects', async (domain) => {
const { user } = setUp(Mock.of<Domain>({ domain, isDefault: false }));
const { user } = setUp(fromPartial({ domain, isDefault: false }));
expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
expect(screen.queryByRole('form')).not.toBeInTheDocument();

View File

@@ -1,17 +1,15 @@
import { screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { DomainStatus } from '../../../src/domains/data';
import { DomainStatusIcon } from '../../../src/domains/helpers/DomainStatusIcon';
import { renderWithEvents } from '../../__helpers__/setUpTest';
describe('<DomainStatusIcon />', () => {
const matchMedia = jest.fn().mockReturnValue(Mock.of<MediaQueryList>({ matches: false }));
const matchMedia = vi.fn().mockReturnValue(fromPartial<MediaQueryList>({ matches: false }));
const setUp = (status: DomainStatus) => renderWithEvents(
<DomainStatusIcon status={status} matchMedia={matchMedia} />,
);
beforeEach(jest.clearAllMocks);
it.each([
['validating' as DomainStatus],
['invalid' as DomainStatus],

View File

@@ -1,13 +1,13 @@
import { fireEvent, screen, waitFor } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShlinkDomain } from '../../../src/api/types';
import { EditDomainRedirectsModal } from '../../../src/domains/helpers/EditDomainRedirectsModal';
import { renderWithEvents } from '../../__helpers__/setUpTest';
describe('<EditDomainRedirectsModal />', () => {
const editDomainRedirects = jest.fn().mockResolvedValue(undefined);
const toggle = jest.fn();
const domain = Mock.of<ShlinkDomain>({
const editDomainRedirects = vi.fn().mockResolvedValue(undefined);
const toggle = vi.fn();
const domain = fromPartial<ShlinkDomain>({
domain: 'foo.com',
redirects: {
baseUrlRedirect: 'baz',
@@ -17,8 +17,6 @@ describe('<EditDomainRedirectsModal />', () => {
<EditDomainRedirectsModal domain={domain} isOpen toggle={toggle} editDomainRedirects={editDomainRedirects} />,
);
afterEach(jest.clearAllMocks);
it('renders domain in header', () => {
setUp();
expect(screen.getByRole('heading')).toHaveTextContent('Edit redirects for foo.com');

View File

@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`<DomainStatusIcon /> renders expected icon and tooltip when status is not validating 1`] = `
exports[`<DomainStatusIcon /> > renders expected icon and tooltip when status is not validating 1`] = `
<svg
aria-hidden="true"
class="svg-inline--fa fa-circle-notch fa-spin fa-fw "
@@ -18,7 +18,7 @@ exports[`<DomainStatusIcon /> renders expected icon and tooltip when status is n
</svg>
`;
exports[`<DomainStatusIcon /> renders expected icon and tooltip when status is not validating 2`] = `
exports[`<DomainStatusIcon /> > renders expected icon and tooltip when status is not validating 2`] = `
<span>
<svg
aria-hidden="true"
@@ -38,7 +38,7 @@ exports[`<DomainStatusIcon /> renders expected icon and tooltip when status is n
</span>
`;
exports[`<DomainStatusIcon /> renders expected icon and tooltip when status is not validating 3`] = `
exports[`<DomainStatusIcon /> > renders expected icon and tooltip when status is not validating 3`] = `
<span>
<svg
aria-hidden="true"
@@ -58,7 +58,7 @@ exports[`<DomainStatusIcon /> renders expected icon and tooltip when status is n
</span>
`;
exports[`<DomainStatusIcon /> renders proper tooltip based on state 1`] = `
exports[`<DomainStatusIcon /> > renders proper tooltip based on state 1`] = `
<div
class="tooltip-inner"
role="tooltip"
@@ -79,7 +79,7 @@ exports[`<DomainStatusIcon /> renders proper tooltip based on state 1`] = `
</div>
`;
exports[`<DomainStatusIcon /> renders proper tooltip based on state 2`] = `
exports[`<DomainStatusIcon /> > renders proper tooltip based on state 2`] = `
<div
class="tooltip-inner"
role="tooltip"

View File

@@ -1,25 +1,22 @@
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShlinkApiClient } from '../../../src/api/services/ShlinkApiClient';
import type { ShlinkDomainRedirects } from '../../../src/api/types';
import type { EditDomainRedirects } from '../../../src/domains/reducers/domainRedirects';
import { editDomainRedirects } from '../../../src/domains/reducers/domainRedirects';
describe('domainRedirectsReducer', () => {
beforeEach(jest.clearAllMocks);
describe('editDomainRedirects', () => {
const domain = 'example.com';
const redirects = Mock.all<ShlinkDomainRedirects>();
const dispatch = jest.fn();
const getState = jest.fn();
const editDomainRedirectsCall = jest.fn();
const buildShlinkApiClient = () => Mock.of<ShlinkApiClient>({ editDomainRedirects: editDomainRedirectsCall });
const redirects = fromPartial<ShlinkDomainRedirects>({});
const dispatch = vi.fn();
const getState = vi.fn();
const editDomainRedirectsCall = vi.fn();
const buildShlinkApiClient = () => fromPartial<ShlinkApiClient>({ editDomainRedirects: editDomainRedirectsCall });
const editDomainRedirectsAction = editDomainRedirects(buildShlinkApiClient);
it('dispatches domain and redirects once loaded', async () => {
editDomainRedirectsCall.mockResolvedValue(redirects);
await editDomainRedirectsAction(Mock.of<EditDomainRedirects>({ domain }))(dispatch, getState, {});
await editDomainRedirectsAction(fromPartial({ domain }))(dispatch, getState, {});
expect(dispatch).toHaveBeenCalledTimes(2);
expect(dispatch).toHaveBeenLastCalledWith(expect.objectContaining({

View File

@@ -1,4 +1,4 @@
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShlinkApiClient } from '../../../src/api/services/ShlinkApiClient';
import type { ShlinkDomainRedirects } from '../../../src/api/types';
import { parseApiError } from '../../../src/api/utils';
@@ -6,26 +6,23 @@ import type { ShlinkState } from '../../../src/container/types';
import type { Domain } from '../../../src/domains/data';
import type { EditDomainRedirects } from '../../../src/domains/reducers/domainRedirects';
import { editDomainRedirects } from '../../../src/domains/reducers/domainRedirects';
import type {
DomainsList } from '../../../src/domains/reducers/domainsList';
import {
domainsListReducerCreator,
replaceRedirectsOnDomain,
replaceStatusOnDomain,
} from '../../../src/domains/reducers/domainsList';
import type { SelectedServer, ServerData } from '../../../src/servers/data';
describe('domainsListReducer', () => {
const dispatch = jest.fn();
const getState = jest.fn();
const listDomains = jest.fn();
const health = jest.fn();
const buildShlinkApiClient = () => Mock.of<ShlinkApiClient>({ listDomains, health });
const filteredDomains = [
Mock.of<Domain>({ domain: 'foo', status: 'validating' }),
Mock.of<Domain>({ domain: 'Boo', status: 'validating' }),
const dispatch = vi.fn();
const getState = vi.fn();
const listDomains = vi.fn();
const health = vi.fn();
const buildShlinkApiClient = () => fromPartial<ShlinkApiClient>({ listDomains, health });
const filteredDomains: Domain[] = [
fromPartial({ domain: 'foo', status: 'validating' }),
fromPartial({ domain: 'Boo', status: 'validating' }),
];
const domains = [...filteredDomains, Mock.of<Domain>({ domain: 'bar', status: 'validating' })];
const domains: Domain[] = [...filteredDomains, fromPartial({ domain: 'bar', status: 'validating' })];
const error = { type: 'NOT_FOUND', status: 404 } as unknown as Error;
const editDomainRedirectsThunk = editDomainRedirects(buildShlinkApiClient);
const { reducer, listDomains: listDomainsAction, checkDomainHealth, filterDomains } = domainsListReducerCreator(
@@ -33,8 +30,6 @@ describe('domainsListReducer', () => {
editDomainRedirectsThunk,
);
beforeEach(jest.clearAllMocks);
describe('reducer', () => {
it('returns loading on LIST_DOMAINS_START', () => {
expect(reducer(undefined, listDomainsAction.pending(''))).toEqual(
@@ -55,7 +50,7 @@ describe('domainsListReducer', () => {
});
it('filters domains on FILTER_DOMAINS', () => {
expect(reducer(Mock.of<DomainsList>({ domains }), filterDomains('oO'))).toEqual({ domains, filteredDomains });
expect(reducer(fromPartial({ domains }), filterDomains('oO'))).toEqual({ domains, filteredDomains });
});
it.each([
@@ -71,7 +66,7 @@ describe('domainsListReducer', () => {
const editDomainRedirects: EditDomainRedirects = { domain, redirects };
expect(reducer(
Mock.of<DomainsList>({ domains, filteredDomains }),
fromPartial({ domains, filteredDomains }),
editDomainRedirectsThunk.fulfilled(editDomainRedirects, '', editDomainRedirects),
)).toEqual({
domains: domains.map(replaceRedirectsOnDomain(editDomainRedirects)),
@@ -85,7 +80,7 @@ describe('domainsListReducer', () => {
['does_not_exist'],
])('replaces status on proper domain on VALIDATE_DOMAIN', (domain) => {
expect(reducer(
Mock.of<DomainsList>({ domains, filteredDomains }),
fromPartial({ domains, filteredDomains }),
checkDomainHealth.fulfilled({ domain, status: 'valid' }, '', ''),
)).toEqual({
domains: domains.map(replaceStatusOnDomain(domain, 'valid')),
@@ -122,8 +117,8 @@ describe('domainsListReducer', () => {
const domain = 'example.com';
it('dispatches invalid status when selected server does not have all required data', async () => {
getState.mockReturnValue(Mock.of<ShlinkState>({
selectedServer: Mock.all<SelectedServer>(),
getState.mockReturnValue(fromPartial<ShlinkState>({
selectedServer: {},
}));
await checkDomainHealth(domain)(dispatch, getState, {});
@@ -136,11 +131,11 @@ describe('domainsListReducer', () => {
});
it('dispatches invalid status when health endpoint returns an error', async () => {
getState.mockReturnValue(Mock.of<ShlinkState>({
selectedServer: Mock.of<ServerData>({
getState.mockReturnValue(fromPartial<ShlinkState>({
selectedServer: {
url: 'https://myerver.com',
apiKey: '123',
}),
},
}));
health.mockRejectedValue({});
@@ -160,11 +155,11 @@ describe('domainsListReducer', () => {
healthStatus,
expectedStatus,
) => {
getState.mockReturnValue(Mock.of<ShlinkState>({
selectedServer: Mock.of<ServerData>({
getState.mockReturnValue(fromPartial<ShlinkState>({
selectedServer: {
url: 'https://myerver.com',
apiKey: '123',
}),
},
}));
health.mockResolvedValue({ status: healthStatus });

View File

@@ -1,24 +1,22 @@
import { fromPartial } from '@total-typescript/shoehorn';
import { EventSourcePolyfill } from 'event-source-polyfill';
import { identity } from 'ramda';
import { Mock } from 'ts-mockery';
import { bindToMercureTopic } from '../../../src/mercure/helpers';
import type { MercureInfo } from '../../../src/mercure/reducers/mercureInfo';
jest.mock('event-source-polyfill');
vi.mock('event-source-polyfill');
describe('helpers', () => {
afterEach(jest.resetAllMocks);
describe('bindToMercureTopic', () => {
const onMessage = jest.fn();
const onTokenExpired = jest.fn();
const onMessage = vi.fn();
const onTokenExpired = vi.fn();
it.each([
[Mock.of<MercureInfo>({ loading: true, error: false, mercureHubUrl: 'foo' })],
[Mock.of<MercureInfo>({ loading: false, error: true, mercureHubUrl: 'foo' })],
[Mock.of<MercureInfo>({ loading: true, error: true, mercureHubUrl: 'foo' })],
[Mock.of<MercureInfo>({ loading: false, error: false, mercureHubUrl: undefined })],
[Mock.of<MercureInfo>({ loading: true, error: true, mercureHubUrl: undefined })],
[fromPartial<MercureInfo>({ loading: true, error: false, mercureHubUrl: 'foo' })],
[fromPartial<MercureInfo>({ loading: false, error: true, mercureHubUrl: 'foo' })],
[fromPartial<MercureInfo>({ loading: true, error: true, mercureHubUrl: 'foo' })],
[fromPartial<MercureInfo>({ loading: false, error: false, mercureHubUrl: undefined })],
[fromPartial<MercureInfo>({ loading: true, error: true, mercureHubUrl: undefined })],
])('does not bind an EventSource when loading, error or no hub URL', (mercureInfo) => {
bindToMercureTopic(mercureInfo, [''], identity, () => {});

View File

@@ -1,4 +1,4 @@
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShlinkApiClient } from '../../../src/api/services/ShlinkApiClient';
import type { GetState } from '../../../src/container/types';
import { mercureInfoReducerCreator } from '../../../src/mercure/reducers/mercureInfo';
@@ -8,12 +8,10 @@ describe('mercureInfoReducer', () => {
mercureHubUrl: 'http://example.com/.well-known/mercure',
token: 'abc.123.def',
};
const getMercureInfo = jest.fn();
const buildShlinkApiClient = () => Mock.of<ShlinkApiClient>({ mercureInfo: getMercureInfo });
const getMercureInfo = vi.fn();
const buildShlinkApiClient = () => fromPartial<ShlinkApiClient>({ mercureInfo: getMercureInfo });
const { loadMercureInfo, reducer } = mercureInfoReducerCreator(buildShlinkApiClient);
beforeEach(jest.resetAllMocks);
describe('reducer', () => {
it('returns loading on GET_MERCURE_INFO_START', () => {
expect(reducer(undefined, loadMercureInfo.pending(''))).toEqual({
@@ -37,8 +35,8 @@ describe('mercureInfoReducer', () => {
});
describe('loadMercureInfo', () => {
const dispatch = jest.fn();
const createGetStateMock = (enabled: boolean): GetState => jest.fn().mockReturnValue({
const dispatch = vi.fn();
const createGetStateMock = (enabled: boolean): GetState => vi.fn().mockReturnValue({
settings: {
realTimeUpdates: { enabled },
},

View File

@@ -1,21 +1,24 @@
import { fireEvent, screen, waitFor } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { useNavigate } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import { CreateServer as createCreateServer } from '../../src/servers/CreateServer';
import type { ServerWithId } from '../../src/servers/data';
import { renderWithEvents } from '../__helpers__/setUpTest';
jest.mock('react-router-dom', () => ({ ...jest.requireActual('react-router-dom'), useNavigate: jest.fn() }));
vi.mock('react-router-dom', async () => ({
...(await vi.importActual<any>('react-router-dom')),
useNavigate: vi.fn(),
}));
describe('<CreateServer />', () => {
const createServersMock = jest.fn();
const navigate = jest.fn();
const servers = { foo: Mock.of<ServerWithId>({ url: 'https://existing_url.com', apiKey: 'existing_api_key' }) };
const createServersMock = vi.fn();
const navigate = vi.fn();
const servers = { foo: fromPartial<ServerWithId>({ url: 'https://existing_url.com', apiKey: 'existing_api_key' }) };
const setUp = (serversImported = false, importFailed = false) => {
(useNavigate as any).mockReturnValue(navigate);
let callCount = 0;
const useTimeoutToggle = jest.fn().mockImplementation(() => {
const useTimeoutToggle = vi.fn().mockImplementation(() => {
const result = [callCount % 2 === 0 ? serversImported : importFailed, () => null];
callCount += 1;
return result;
@@ -25,8 +28,6 @@ describe('<CreateServer />', () => {
return renderWithEvents(<CreateServer createServers={createServersMock} servers={servers} />);
};
beforeEach(jest.clearAllMocks);
it('shows success message when imported is true', () => {
setUp(true);

View File

@@ -1,7 +1,6 @@
import { screen, waitFor } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ReactNode } from 'react';
import { Mock } from 'ts-mockery';
import type { ServerWithId } from '../../src/servers/data';
import { DeleteServerButton as createDeleteServerButton } from '../../src/servers/DeleteServerButton';
import { renderWithEvents } from '../__helpers__/setUpTest';
@@ -10,7 +9,7 @@ describe('<DeleteServerButton />', () => {
({ isOpen }) => <>DeleteServerModal {isOpen ? '[Open]' : '[Closed]'}</>,
);
const setUp = (children?: ReactNode) => renderWithEvents(
<DeleteServerButton server={Mock.all<ServerWithId>()} textClassName="button">{children}</DeleteServerButton>,
<DeleteServerButton server={fromPartial({})} textClassName="button">{children}</DeleteServerButton>,
);
it.each([

View File

@@ -1,16 +1,18 @@
import { screen, waitFor } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { useNavigate } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { ServerWithId } from '../../src/servers/data';
import { DeleteServerModal } from '../../src/servers/DeleteServerModal';
import { renderWithEvents } from '../__helpers__/setUpTest';
import { TestModalWrapper } from '../__helpers__/TestModalWrapper';
jest.mock('react-router-dom', () => ({ ...jest.requireActual('react-router-dom'), useNavigate: jest.fn() }));
vi.mock('react-router-dom', async () => ({
...(await vi.importActual<any>('react-router-dom')),
useNavigate: vi.fn(),
}));
describe('<DeleteServerModal />', () => {
const deleteServerMock = jest.fn();
const navigate = jest.fn();
const deleteServerMock = vi.fn();
const navigate = vi.fn();
const serverName = 'the_server_name';
const setUp = () => {
(useNavigate as any).mockReturnValue(navigate);
@@ -20,7 +22,7 @@ describe('<DeleteServerModal />', () => {
renderModal={(args) => (
<DeleteServerModal
{...args}
server={Mock.of<ServerWithId>({ name: serverName })}
server={fromPartial({ name: serverName })}
deleteServer={deleteServerMock}
/>
)}
@@ -28,8 +30,6 @@ describe('<DeleteServerModal />', () => {
);
};
afterEach(jest.clearAllMocks);
it('renders a modal window', () => {
setUp();

View File

@@ -1,17 +1,20 @@
import { fireEvent, screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter, useNavigate } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { ReachableServer, SelectedServer } from '../../src/servers/data';
import { EditServer as editServerConstruct } from '../../src/servers/EditServer';
import { renderWithEvents } from '../__helpers__/setUpTest';
jest.mock('react-router-dom', () => ({ ...jest.requireActual('react-router-dom'), useNavigate: jest.fn() }));
vi.mock('react-router-dom', async () => ({
...(await vi.importActual<any>('react-router-dom')),
useNavigate: vi.fn(),
}));
describe('<EditServer />', () => {
const ServerError = jest.fn();
const editServerMock = jest.fn();
const navigate = jest.fn();
const defaultSelectedServer = Mock.of<ReachableServer>({
const ServerError = vi.fn();
const editServerMock = vi.fn();
const navigate = vi.fn();
const defaultSelectedServer = fromPartial<ReachableServer>({
id: 'abc123',
name: 'the_name',
url: 'the_url',
@@ -20,7 +23,7 @@ describe('<EditServer />', () => {
const EditServer = editServerConstruct(ServerError);
const setUp = (selectedServer: SelectedServer = defaultSelectedServer) => renderWithEvents(
<MemoryRouter>
<EditServer editServer={editServerMock} selectedServer={selectedServer} selectServer={jest.fn()} />
<EditServer editServer={editServerMock} selectedServer={selectedServer} selectServer={vi.fn()} />
</MemoryRouter>,
);
@@ -28,10 +31,8 @@ describe('<EditServer />', () => {
(useNavigate as any).mockReturnValue(navigate);
});
afterEach(jest.clearAllMocks);
it('renders nothing if selected server is not reachable', () => {
setUp(Mock.all<SelectedServer>());
setUp(fromPartial<SelectedServer>({}));
expect(screen.queryByText('Edit')).not.toBeInTheDocument();
expect(screen.queryByText('Cancel')).not.toBeInTheDocument();

View File

@@ -1,30 +1,28 @@
import { screen, waitFor } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { ServersMap, ServerWithId } from '../../src/servers/data';
import { ManageServers as createManageServers } from '../../src/servers/ManageServers';
import type { ServersExporter } from '../../src/servers/services/ServersExporter';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<ManageServers />', () => {
const exportServers = jest.fn();
const serversExporter = Mock.of<ServersExporter>({ exportServers });
const useTimeoutToggle = jest.fn().mockReturnValue([false, jest.fn()]);
const exportServers = vi.fn();
const serversExporter = fromPartial<ServersExporter>({ exportServers });
const useTimeoutToggle = vi.fn().mockReturnValue([false, vi.fn()]);
const ManageServers = createManageServers(
serversExporter,
() => <span>ImportServersBtn</span>,
useTimeoutToggle,
({ hasAutoConnect }) => <tr><td>ManageServersRow {hasAutoConnect ? '[YES]' : '[NO]'}</td></tr>,
);
const createServerMock = (value: string, autoConnect = false) => Mock.of<ServerWithId>(
const createServerMock = (value: string, autoConnect = false) => fromPartial<ServerWithId>(
{ id: value, name: value, url: value, autoConnect },
);
const setUp = (servers: ServersMap = {}) => renderWithEvents(
<MemoryRouter><ManageServers servers={servers} /></MemoryRouter>,
);
afterEach(jest.clearAllMocks);
it('shows search field which allows searching servers, affecting te amount of rendered rows', async () => {
const { user } = setUp({
foo: createServerMock('foo'),
@@ -85,7 +83,7 @@ describe('<ManageServers />', () => {
});
it.each([[true], [false]])('shows an error message if an error occurs while importing servers', (hasError) => {
useTimeoutToggle.mockReturnValue([hasError, jest.fn()]);
useTimeoutToggle.mockReturnValue([hasError, vi.fn()]);
setUp({ foo: createServerMock('foo') });

View File

@@ -1,6 +1,6 @@
import { screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { ServerWithId } from '../../src/servers/data';
import { ManageServersRowDropdown as createManageServersRowDropdown } from '../../src/servers/ManageServersRowDropdown';
import { renderWithEvents } from '../__helpers__/setUpTest';
@@ -9,9 +9,9 @@ describe('<ManageServersRowDropdown />', () => {
const ManageServersRowDropdown = createManageServersRowDropdown(
({ isOpen }) => <span>DeleteServerModal {isOpen ? '[OPEN]' : '[CLOSED]'}</span>,
);
const setAutoConnect = jest.fn();
const setAutoConnect = vi.fn();
const setUp = (autoConnect = false) => {
const server = Mock.of<ServerWithId>({ id: 'abc123', autoConnect });
const server = fromPartial<ServerWithId>({ id: 'abc123', autoConnect });
return renderWithEvents(
<MemoryRouter>
<ManageServersRowDropdown setAutoConnect={setAutoConnect} server={server} />
@@ -19,8 +19,6 @@ describe('<ManageServersRowDropdown />', () => {
);
};
afterEach(jest.clearAllMocks);
it('renders expected amount of dropdown items', async () => {
const { user } = setUp();

View File

@@ -1,22 +1,17 @@
import { screen, waitFor } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { MercureInfo } from '../../src/mercure/reducers/mercureInfo';
import type { ReachableServer } from '../../src/servers/data';
import { Overview as overviewCreator } from '../../src/servers/Overview';
import type { Settings } from '../../src/settings/reducers/settings';
import type { ShortUrlsList as ShortUrlsListState } from '../../src/short-urls/reducers/shortUrlsList';
import type { TagsList } from '../../src/tags/reducers/tagsList';
import { prettify } from '../../src/utils/helpers/numbers';
import type { VisitsOverview } from '../../src/visits/reducers/visitsOverview';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<Overview />', () => {
const ShortUrlsTable = () => <>ShortUrlsTable</>;
const CreateShortUrl = () => <>CreateShortUrl</>;
const listShortUrls = jest.fn();
const listTags = jest.fn();
const loadVisitsOverview = jest.fn();
const listShortUrls = vi.fn();
const listTags = vi.fn();
const loadVisitsOverview = vi.fn();
const Overview = overviewCreator(ShortUrlsTable, CreateShortUrl);
const shortUrls = {
pagination: { totalItems: 83710 },
@@ -28,18 +23,18 @@ describe('<Overview />', () => {
listShortUrls={listShortUrls}
listTags={listTags}
loadVisitsOverview={loadVisitsOverview}
shortUrlsList={Mock.of<ShortUrlsListState>({ loading, shortUrls })}
tagsList={Mock.of<TagsList>({ loading, tags: ['foo', 'bar', 'baz'] })}
visitsOverview={Mock.of<VisitsOverview>({
shortUrlsList={fromPartial({ loading, shortUrls })}
tagsList={fromPartial({ loading, tags: ['foo', 'bar', 'baz'] })}
visitsOverview={fromPartial({
loading,
nonOrphanVisits: { total: 3456, bots: 1000, nonBots: 2456 },
orphanVisits: { total: 28, bots: 15, nonBots: 13 },
})}
selectedServer={Mock.of<ReachableServer>({ id: serverId })}
createNewVisits={jest.fn()}
loadMercureInfo={jest.fn()}
mercureInfo={Mock.all<MercureInfo>()}
settings={Mock.of<Settings>({ visits: { excludeBots } })}
selectedServer={fromPartial({ id: serverId })}
createNewVisits={vi.fn()}
loadMercureInfo={vi.fn()}
mercureInfo={fromPartial<MercureInfo>({})}
settings={fromPartial({ visits: { excludeBots } })}
/>
</MemoryRouter>,
);

View File

@@ -1,16 +1,16 @@
import { screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { values } from 'ramda';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { ServersMap, ServerWithId } from '../../src/servers/data';
import type { ServersMap } from '../../src/servers/data';
import { ServersDropdown } from '../../src/servers/ServersDropdown';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<ServersDropdown />', () => {
const fallbackServers: ServersMap = {
'1a': Mock.of<ServerWithId>({ name: 'foo', id: '1a' }),
'2b': Mock.of<ServerWithId>({ name: 'bar', id: '2b' }),
'3c': Mock.of<ServerWithId>({ name: 'baz', id: '3c' }),
'1a': fromPartial({ name: 'foo', id: '1a' }),
'2b': fromPartial({ name: 'bar', id: '2b' }),
'3c': fromPartial({ name: 'baz', id: '3c' }),
};
const setUp = (servers: ServersMap = fallbackServers) => renderWithEvents(
<MemoryRouter><ServersDropdown servers={servers} selectedServer={null} /></MemoryRouter>,

View File

@@ -1,13 +1,13 @@
import { render, screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { ServerWithId } from '../../src/servers/data';
import { ServersListGroup } from '../../src/servers/ServersListGroup';
describe('<ServersListGroup />', () => {
const servers = [
Mock.of<ServerWithId>({ name: 'foo', id: '123' }),
Mock.of<ServerWithId>({ name: 'bar', id: '456' }),
const servers: ServerWithId[] = [
fromPartial({ name: 'foo', id: '123' }),
fromPartial({ name: 'bar', id: '456' }),
];
const setUp = (params: { servers?: ServerWithId[]; withChildren?: boolean; embedded?: boolean }) => {
const { servers = [], withChildren = true, embedded } = params;

View File

@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`<DeleteServerButton /> renders expected content 1`] = `
exports[`<DeleteServerButton /> > renders expected content 1`] = `
<span>
<span
class="button"
@@ -10,7 +10,7 @@ exports[`<DeleteServerButton /> renders expected content 1`] = `
</span>
`;
exports[`<DeleteServerButton /> renders expected content 2`] = `
exports[`<DeleteServerButton /> > renders expected content 2`] = `
<span>
<span
class="button"
@@ -20,7 +20,7 @@ exports[`<DeleteServerButton /> renders expected content 2`] = `
</span>
`;
exports[`<DeleteServerButton /> renders expected content 3`] = `
exports[`<DeleteServerButton /> > renders expected content 3`] = `
<span>
<span
class="button"
@@ -30,7 +30,7 @@ exports[`<DeleteServerButton /> renders expected content 3`] = `
</span>
`;
exports[`<DeleteServerButton /> renders expected content 4`] = `
exports[`<DeleteServerButton /> > renders expected content 4`] = `
<span>
<svg
aria-hidden="true"

View File

@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`<ManageServersRow /> renders auto-connect icon only if server is autoConnect 1`] = `
exports[`<ManageServersRow /> > renders auto-connect icon only if server is autoConnect 1`] = `
<div>
<table>
<tbody>
@@ -57,7 +57,7 @@ exports[`<ManageServersRow /> renders auto-connect icon only if server is autoCo
</div>
`;
exports[`<ManageServersRow /> renders auto-connect icon only if server is autoConnect 2`] = `
exports[`<ManageServersRow /> > renders auto-connect icon only if server is autoConnect 2`] = `
<div>
<table>
<tbody>

View File

@@ -1,24 +1,23 @@
import { screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ServerData } from '../../../src/servers/data';
import { DuplicatedServersModal } from '../../../src/servers/helpers/DuplicatedServersModal';
import { renderWithEvents } from '../../__helpers__/setUpTest';
describe('<DuplicatedServersModal />', () => {
const onDiscard = jest.fn();
const onSave = jest.fn();
const onDiscard = vi.fn();
const onSave = vi.fn();
const setUp = (duplicatedServers: ServerData[] = []) => renderWithEvents(
<DuplicatedServersModal isOpen duplicatedServers={duplicatedServers} onDiscard={onDiscard} onSave={onSave} />,
);
beforeEach(jest.clearAllMocks);
const mockServer = (data: Partial<ServerData> = {}) => fromPartial<ServerData>(data);
it.each([
[[], 0],
[[Mock.all<ServerData>()], 2],
[[Mock.all<ServerData>(), Mock.all<ServerData>()], 2],
[[Mock.all<ServerData>(), Mock.all<ServerData>(), Mock.all<ServerData>()], 3],
[[Mock.all<ServerData>(), Mock.all<ServerData>(), Mock.all<ServerData>(), Mock.all<ServerData>()], 4],
[[mockServer()], 2],
[[mockServer(), mockServer()], 2],
[[mockServer(), mockServer(), mockServer()], 3],
[[mockServer(), mockServer(), mockServer(), mockServer()], 4],
])('renders expected amount of items', (duplicatedServers, expectedItems) => {
setUp(duplicatedServers);
expect(screen.queryAllByRole('listitem')).toHaveLength(expectedItems);
@@ -26,7 +25,7 @@ describe('<DuplicatedServersModal />', () => {
it.each([
[
[Mock.all<ServerData>()],
[mockServer()],
{
header: 'Duplicated server',
firstParagraph: 'There is already a server with:',
@@ -35,7 +34,7 @@ describe('<DuplicatedServersModal />', () => {
},
],
[
[Mock.all<ServerData>(), Mock.all<ServerData>()],
[mockServer(), mockServer()],
{
header: 'Duplicated servers',
firstParagraph: 'The next servers already exist:',
@@ -54,10 +53,10 @@ describe('<DuplicatedServersModal />', () => {
it.each([
[[]],
[[Mock.of<ServerData>({ url: 'url', apiKey: 'apiKey' })]],
[[mockServer({ url: 'url', apiKey: 'apiKey' })]],
[[
Mock.of<ServerData>({ url: 'url_1', apiKey: 'apiKey_1' }),
Mock.of<ServerData>({ url: 'url_2', apiKey: 'apiKey_2' }),
mockServer({ url: 'url_1', apiKey: 'apiKey_1' }),
mockServer({ url: 'url_2', apiKey: 'apiKey_2' }),
]],
])('displays provided server data', (duplicatedServers) => {
setUp(duplicatedServers);

View File

@@ -1,5 +1,5 @@
import { fireEvent, screen, waitFor } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ServersMap, ServerWithId } from '../../../src/servers/data';
import type {
ImportServersBtnProps } from '../../../src/servers/helpers/ImportServersBtn';
@@ -10,10 +10,10 @@ import type { ServersImporter } from '../../../src/servers/services/ServersImpor
import { renderWithEvents } from '../../__helpers__/setUpTest';
describe('<ImportServersBtn />', () => {
const onImportMock = jest.fn();
const createServersMock = jest.fn();
const importServersFromFile = jest.fn().mockResolvedValue([]);
const serversImporterMock = Mock.of<ServersImporter>({ importServersFromFile });
const onImportMock = vi.fn();
const createServersMock = vi.fn();
const importServersFromFile = vi.fn().mockResolvedValue([]);
const serversImporterMock = fromPartial<ServersImporter>({ importServersFromFile });
const ImportServersBtn = createImportServersBtn(serversImporterMock);
const setUp = (props: Partial<ImportServersBtnProps> = {}, servers: ServersMap = {}) => renderWithEvents(
<ImportServersBtn
@@ -24,8 +24,6 @@ describe('<ImportServersBtn />', () => {
/>,
);
afterEach(jest.clearAllMocks);
it('shows tooltip on button hover', async () => {
const { user } = setUp();
@@ -67,8 +65,8 @@ describe('<ImportServersBtn />', () => {
['Save anyway', true],
['Discard', false],
])('creates expected servers depending on selected option in modal', async (btnName, savesDuplicatedServers) => {
const existingServer = Mock.of<ServerWithId>({ id: 'abc', url: 'existingUrl', apiKey: 'existingApiKey' });
const newServer = Mock.of<ServerWithId>({ url: 'newUrl', apiKey: 'newApiKey' });
const existingServer = fromPartial<ServerWithId>({ id: 'abc', url: 'existingUrl', apiKey: 'existingApiKey' });
const newServer = fromPartial<ServerWithId>({ url: 'newUrl', apiKey: 'newApiKey' });
const { container, user } = setUp({}, { abc: existingServer });
const input = container.querySelector('[type=file]');
importServersFromFile.mockResolvedValue([existingServer, newServer]);

View File

@@ -1,6 +1,6 @@
import { render, screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { NonReachableServer, NotFoundServer } from '../../../src/servers/data';
import { ServerError as createServerError } from '../../../src/servers/helpers/ServerError';
@@ -9,7 +9,7 @@ describe('<ServerError />', () => {
it.each([
[
Mock.all<NotFoundServer>(),
fromPartial<NotFoundServer>({}),
{
found: ['Could not find this Shlink server.'],
notFound: [
@@ -20,7 +20,7 @@ describe('<ServerError />', () => {
},
],
[
Mock.of<NonReachableServer>({ id: 'abc123' }),
fromPartial<NonReachableServer>({ id: 'abc123' }),
{
found: [
'Oops! Could not connect to this Shlink server.',

View File

@@ -2,11 +2,9 @@ import { fireEvent, render, screen } from '@testing-library/react';
import { ServerForm } from '../../../src/servers/helpers/ServerForm';
describe('<ServerForm />', () => {
const onSubmit = jest.fn();
const onSubmit = vi.fn();
const setUp = () => render(<ServerForm onSubmit={onSubmit}>Something</ServerForm>);
afterEach(jest.resetAllMocks);
it('renders components', () => {
setUp();
@@ -18,7 +16,7 @@ describe('<ServerForm />', () => {
setUp();
expect(onSubmit).not.toHaveBeenCalled();
fireEvent.submit(screen.getByRole('form'), { preventDefault: jest.fn() });
fireEvent.submit(screen.getByRole('form'), { preventDefault: vi.fn() });
expect(onSubmit).toHaveBeenCalled();
});
});

View File

@@ -1,14 +1,12 @@
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { HttpClient } from '../../../src/common/services/HttpClient';
import { fetchServers } from '../../../src/servers/reducers/remoteServers';
describe('remoteServersReducer', () => {
afterEach(jest.clearAllMocks);
describe('fetchServers', () => {
const dispatch = jest.fn();
const fetchJson = jest.fn();
const httpClient = Mock.of<HttpClient>({ fetchJson });
const dispatch = vi.fn();
const fetchJson = vi.fn();
const httpClient = fromPartial<HttpClient>({ fetchJson });
it.each([
[
@@ -81,7 +79,7 @@ describe('remoteServersReducer', () => {
fetchJson.mockResolvedValue(mockedValue);
const doFetchServers = fetchServers(httpClient);
await doFetchServers()(dispatch, jest.fn(), {});
await doFetchServers()(dispatch, vi.fn(), {});
expect(dispatch).toHaveBeenCalledTimes(3);
expect(dispatch).toHaveBeenNthCalledWith(2, expect.objectContaining({ payload: expectedNewServers }));

View File

@@ -1,4 +1,4 @@
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import { v4 as uuid } from 'uuid';
import type { ShlinkApiClient } from '../../../src/api/services/ShlinkApiClient';
import type { ShlinkState } from '../../../src/container/types';
@@ -13,28 +13,25 @@ import {
} from '../../../src/servers/reducers/selectedServer';
describe('selectedServerReducer', () => {
const dispatch = jest.fn();
const health = jest.fn();
const buildApiClient = jest.fn().mockReturnValue(Mock.of<ShlinkApiClient>({ health }));
const dispatch = vi.fn();
const health = vi.fn();
const buildApiClient = vi.fn().mockReturnValue(fromPartial<ShlinkApiClient>({ health }));
const selectServer = selectServerCreator(buildApiClient);
const { reducer } = selectedServerReducerCreator(selectServer);
afterEach(jest.clearAllMocks);
describe('reducer', () => {
it('returns default when action is RESET_SELECTED_SERVER', () =>
expect(reducer(null, resetSelectedServer())).toBeNull());
it('returns selected server when action is SELECT_SERVER', () => {
const payload = Mock.of<RegularServer>({ id: 'abc123' });
const payload = fromPartial<RegularServer>({ id: 'abc123' });
expect(reducer(null, selectServer.fulfilled(payload, '', ''))).toEqual(payload);
});
});
describe('selectServer', () => {
const version = '1.19.0';
const createGetStateMock = (id: string) => jest.fn().mockReturnValue({
const createGetStateMock = (id: string) => vi.fn().mockReturnValue({
servers: {
[id]: { id },
},
@@ -66,7 +63,7 @@ describe('selectedServerReducer', () => {
it('dispatches error when health endpoint fails', async () => {
const id = uuid();
const getState = createGetStateMock(id);
const expectedSelectedServer = Mock.of<NonReachableServer>({ id, serverNotReachable: true });
const expectedSelectedServer = fromPartial<NonReachableServer>({ id, serverNotReachable: true });
health.mockRejectedValue({});
@@ -78,7 +75,7 @@ describe('selectedServerReducer', () => {
it('dispatches error when server is not found', async () => {
const id = uuid();
const getState = jest.fn(() => Mock.of<ShlinkState>({ servers: {} }));
const getState = vi.fn(() => fromPartial<ShlinkState>({ servers: {} }));
const expectedSelectedServer: NotFoundServer = { serverNotFound: true };
await selectServer(id)(dispatch, getState, {});
@@ -90,16 +87,16 @@ describe('selectedServerReducer', () => {
});
describe('selectServerListener', () => {
const getState = jest.fn(() => ({}));
const loadMercureInfo = jest.fn();
const getState = vi.fn(() => ({}));
const loadMercureInfo = vi.fn();
const { middleware } = selectServerListener(selectServer, loadMercureInfo);
it.each([
[Mock.of<ReachableServer>({ version: '1.2.3' }), 1],
[Mock.of<NotFoundServer>({ serverNotFound: true }), 0],
[Mock.of<NonReachableServer>({ serverNotReachable: true }), 0],
[fromPartial<ReachableServer>({ version: '1.2.3' }), 1],
[fromPartial<NotFoundServer>({ serverNotFound: true }), 0],
[fromPartial<NonReachableServer>({ serverNotReachable: true }), 0],
])('dispatches loadMercureInfo when provided server is reachable', (payload, expectedCalls) => {
middleware({ dispatch, getState })(jest.fn())({
middleware({ dispatch, getState })(vi.fn())({
payload,
type: selectServer.fulfilled.toString(),
});
@@ -109,8 +106,8 @@ describe('selectedServerReducer', () => {
});
it('does not dispatch loadMercureInfo when action is not of the proper type', () => {
middleware({ dispatch, getState })(jest.fn())({
payload: Mock.of<ReachableServer>({ version: '1.2.3' }),
middleware({ dispatch, getState })(vi.fn())({
payload: fromPartial<ReachableServer>({ version: '1.2.3' }),
type: 'something_else',
});

View File

@@ -1,6 +1,6 @@
import { fromPartial } from '@total-typescript/shoehorn';
import { dissoc, values } from 'ramda';
import { Mock } from 'ts-mockery';
import type { RegularServer, ServerWithId } from '../../../src/servers/data';
import type { RegularServer, ServersMap, ServerWithId } from '../../../src/servers/data';
import {
createServers,
deleteServer,
@@ -10,13 +10,11 @@ import {
} from '../../../src/servers/reducers/servers';
describe('serversReducer', () => {
const list = {
abc123: Mock.of<RegularServer>({ id: 'abc123' }),
def456: Mock.of<RegularServer>({ id: 'def456' }),
const list: ServersMap = {
abc123: fromPartial({ id: 'abc123' }),
def456: fromPartial({ id: 'def456' }),
};
afterEach(jest.clearAllMocks);
describe('reducer', () => {
it('returns edited server when action is EDIT_SERVER', () =>
expect(serversReducer(list, editServer('abc123', { name: 'foo' }))).toEqual({
@@ -31,12 +29,12 @@ describe('serversReducer', () => {
}));
it('removes server when action is DELETE_SERVER', () =>
expect(serversReducer(list, deleteServer(Mock.of<ServerWithId>({ id: 'abc123' })))).toEqual({
expect(serversReducer(list, deleteServer(fromPartial<ServerWithId>({ id: 'abc123' })))).toEqual({
def456: { id: 'def456' },
}));
it('appends server when action is CREATE_SERVERS', () =>
expect(serversReducer(list, createServers([Mock.of<ServerWithId>({ id: 'ghi789' })]))).toEqual({
expect(serversReducer(list, createServers([fromPartial<ServerWithId>({ id: 'ghi789' })]))).toEqual({
abc123: { id: 'abc123' },
def456: { id: 'def456' },
ghi789: { id: 'ghi789' },
@@ -46,7 +44,7 @@ describe('serversReducer', () => {
[true],
[false],
])('returns state as it is when trying to set auto-connect on invalid server', (autoConnect) =>
expect(serversReducer(list, setAutoConnect(Mock.of<ServerWithId>({ id: 'invalid' }), autoConnect))).toEqual({
expect(serversReducer(list, setAutoConnect(fromPartial<ServerWithId>({ id: 'invalid' }), autoConnect))).toEqual({
abc123: { id: 'abc123' },
def456: { id: 'def456' },
}));
@@ -59,7 +57,7 @@ describe('serversReducer', () => {
expect(serversReducer(
listWithDisabledAutoConnect,
setAutoConnect(Mock.of<ServerWithId>({ id: 'abc123' }), false),
setAutoConnect(fromPartial<ServerWithId>({ id: 'abc123' }), false),
)).toEqual({
abc123: { id: 'abc123', autoConnect: false },
def456: { id: 'def456' },
@@ -74,7 +72,7 @@ describe('serversReducer', () => {
expect(serversReducer(
listWithEnabledAutoConnect,
setAutoConnect(Mock.of<ServerWithId>({ id: 'def456' }), true),
setAutoConnect(fromPartial<ServerWithId>({ id: 'def456' }), true),
)).toEqual({
abc123: { id: 'abc123', autoConnect: false },
def456: { id: 'def456', autoConnect: true },
@@ -94,7 +92,7 @@ describe('serversReducer', () => {
describe('deleteServer', () => {
it('returns expected action', () => {
const serverToDelete = Mock.of<RegularServer>({ id: 'abc123' });
const serverToDelete = fromPartial<RegularServer>({ id: 'abc123' });
const { payload } = deleteServer(serverToDelete);
expect(payload).toEqual({ id: 'abc123' });
@@ -122,7 +120,7 @@ describe('serversReducer', () => {
[true],
[false],
])('returns expected action', (autoConnect) => {
const serverToEdit = Mock.of<RegularServer>({ id: 'abc123' });
const serverToEdit = fromPartial<RegularServer>({ id: 'abc123' });
const { payload } = setAutoConnect(serverToEdit, autoConnect);
expect(payload).toEqual({ serverId: 'abc123', autoConnect });

View File

@@ -1,11 +1,11 @@
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import { ServersExporter } from '../../../src/servers/services/ServersExporter';
import type { LocalStorage } from '../../../src/utils/services/LocalStorage';
import { appendChild, removeChild, windowMock } from '../../__mocks__/Window.mock';
describe('ServersExporter', () => {
const storageMock = Mock.of<LocalStorage>({
get: jest.fn(() => ({
const storageMock = fromPartial<LocalStorage>({
get: vi.fn(() => ({
abc123: {
id: 'abc123',
name: 'foo',
@@ -16,22 +16,20 @@ describe('ServersExporter', () => {
name: 'bar',
autoConnect: false,
},
})),
} as any)),
});
const erroneousToCsv = jest.fn(() => {
const erroneousToCsv = vi.fn(() => {
throw new Error('');
});
const createCsvjsonMock = (throwError = false) => (throwError ? erroneousToCsv : jest.fn(() => ''));
beforeEach(jest.clearAllMocks);
const createCsvjsonMock = (throwError = false) => (throwError ? erroneousToCsv : vi.fn(() => ''));
describe('exportServers', () => {
let originalConsole: Console;
const error = jest.fn();
const error = vi.fn();
beforeEach(() => {
originalConsole = global.console;
global.console = Mock.of<Console>({ error });
global.console = fromPartial<Console>({ error });
(global as any).Blob = class Blob {};
(global as any).URL = { createObjectURL: () => '' };
});

View File

@@ -1,21 +1,19 @@
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { RegularServer } from '../../../src/servers/data';
import { ServersImporter } from '../../../src/servers/services/ServersImporter';
describe('ServersImporter', () => {
const servers: RegularServer[] = [Mock.all<RegularServer>(), Mock.all<RegularServer>()];
const csvjsonMock = jest.fn().mockResolvedValue(servers);
const readAsText = jest.fn();
const fileReaderMock = Mock.of<FileReader>({
const servers: RegularServer[] = [fromPartial<RegularServer>({}), fromPartial<RegularServer>({})];
const csvjsonMock = vi.fn().mockResolvedValue(servers);
const readAsText = vi.fn();
const fileReaderMock = fromPartial<FileReader>({
readAsText,
addEventListener: (_eventName: string, listener: (e: ProgressEvent<FileReader>) => void) => listener(
Mock.of<ProgressEvent<FileReader>>({ target: { result: '' } }),
),
addEventListener: ((_eventName: string, listener: (e: ProgressEvent<FileReader>) => void) => listener(
fromPartial({ target: { result: '' } }),
)) as any,
});
const importer = new ServersImporter(csvjsonMock, () => fileReaderMock);
beforeEach(jest.clearAllMocks);
describe('importServersFromFile', () => {
it('rejects with error if no file was provided', async () => {
await expect(importer.importServersFromFile()).rejects.toEqual(
@@ -28,7 +26,7 @@ describe('ServersImporter', () => {
csvjsonMock.mockRejectedValue(expectedError);
await expect(importer.importServersFromFile(Mock.of<File>({ type: 'text/html' }))).rejects.toEqual(expectedError);
await expect(importer.importServersFromFile(fromPartial({ type: 'text/html' }))).rejects.toEqual(expectedError);
});
it.each([
@@ -57,7 +55,7 @@ describe('ServersImporter', () => {
])('rejects with error if provided file does not parse to valid list of servers', async (parsedObject) => {
csvjsonMock.mockResolvedValue(parsedObject);
await expect(importer.importServersFromFile(Mock.of<File>({ type: 'text/html' }))).rejects.toEqual(
await expect(importer.importServersFromFile(fromPartial({ type: 'text/html' }))).rejects.toEqual(
new Error('Provided file does not have the right format.'),
);
});
@@ -78,7 +76,7 @@ describe('ServersImporter', () => {
csvjsonMock.mockResolvedValue(expectedServers);
const result = await importer.importServersFromFile(Mock.all<File>());
const result = await importer.importServersFromFile(fromPartial({}));
expect(result).toEqual(expectedServers);
expect(readAsText).toHaveBeenCalledTimes(1);

View File

@@ -1,25 +1,22 @@
import { screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import { RealTimeUpdatesSettings } from '../../src/settings/RealTimeUpdatesSettings';
import type {
RealTimeUpdatesSettings as RealTimeUpdatesSettingsOptions,
Settings,
} from '../../src/settings/reducers/settings';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<RealTimeUpdatesSettings />', () => {
const toggleRealTimeUpdates = jest.fn();
const setRealTimeUpdatesInterval = jest.fn();
const toggleRealTimeUpdates = vi.fn();
const setRealTimeUpdatesInterval = vi.fn();
const setUp = (realTimeUpdates: Partial<RealTimeUpdatesSettingsOptions> = {}) => renderWithEvents(
<RealTimeUpdatesSettings
settings={Mock.of<Settings>({ realTimeUpdates })}
settings={fromPartial({ realTimeUpdates })}
toggleRealTimeUpdates={toggleRealTimeUpdates}
setRealTimeUpdatesInterval={setRealTimeUpdatesInterval}
/>,
);
afterEach(jest.clearAllMocks);
it('renders enabled real time updates as expected', () => {
setUp({ enabled: true });

View File

@@ -1,20 +1,18 @@
import { screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import type { Settings, ShortUrlCreationSettings as ShortUrlsSettings } from '../../src/settings/reducers/settings';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShortUrlCreationSettings as ShortUrlsSettings } from '../../src/settings/reducers/settings';
import { ShortUrlCreationSettings } from '../../src/settings/ShortUrlCreationSettings';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<ShortUrlCreationSettings />', () => {
const setShortUrlCreationSettings = jest.fn();
const setShortUrlCreationSettings = vi.fn();
const setUp = (shortUrlCreation?: ShortUrlsSettings) => renderWithEvents(
<ShortUrlCreationSettings
settings={Mock.of<Settings>({ shortUrlCreation })}
settings={fromPartial({ shortUrlCreation })}
setShortUrlCreationSettings={setShortUrlCreationSettings}
/>,
);
afterEach(jest.clearAllMocks);
it.each([
[{ validateUrls: true }, true],
[{ validateUrls: false }, false],

View File

@@ -1,18 +1,16 @@
import { screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import type { Settings, ShortUrlsListSettings as ShortUrlsSettings } from '../../src/settings/reducers/settings';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShortUrlsListSettings as ShortUrlsSettings } from '../../src/settings/reducers/settings';
import { ShortUrlsListSettings } from '../../src/settings/ShortUrlsListSettings';
import type { ShortUrlsOrder } from '../../src/short-urls/data';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<ShortUrlsListSettings />', () => {
const setSettings = jest.fn();
const setSettings = vi.fn();
const setUp = (shortUrlsList?: ShortUrlsSettings) => renderWithEvents(
<ShortUrlsListSettings settings={Mock.of<Settings>({ shortUrlsList })} setShortUrlsListSettings={setSettings} />,
<ShortUrlsListSettings settings={fromPartial({ shortUrlsList })} setShortUrlsListSettings={setSettings} />,
);
afterEach(jest.clearAllMocks);
it.each([
[undefined, 'Order by: Created at - DESC'],
[{}, 'Order by: Created at - DESC'],

View File

@@ -1,18 +1,16 @@
import { screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import type { Settings, TagsSettings as TagsSettingsOptions } from '../../src/settings/reducers/settings';
import { fromPartial } from '@total-typescript/shoehorn';
import type { TagsSettings as TagsSettingsOptions } from '../../src/settings/reducers/settings';
import { TagsSettings } from '../../src/settings/TagsSettings';
import type { TagsOrder } from '../../src/tags/data/TagsListChildrenProps';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<TagsSettings />', () => {
const setTagsSettings = jest.fn();
const setTagsSettings = vi.fn();
const setUp = (tags?: TagsSettingsOptions) => renderWithEvents(
<TagsSettings settings={Mock.of<Settings>({ tags })} setTagsSettings={setTagsSettings} />,
<TagsSettings settings={fromPartial({ tags })} setTagsSettings={setTagsSettings} />,
);
afterEach(jest.clearAllMocks);
it('renders expected amount of groups', () => {
setUp();

View File

@@ -1,18 +1,16 @@
import { screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import type { Settings, UiSettings } from '../../src/settings/reducers/settings';
import { fromPartial } from '@total-typescript/shoehorn';
import type { UiSettings } from '../../src/settings/reducers/settings';
import { UserInterfaceSettings } from '../../src/settings/UserInterfaceSettings';
import type { Theme } from '../../src/utils/theme';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<UserInterfaceSettings />', () => {
const setUiSettings = jest.fn();
const setUiSettings = vi.fn();
const setUp = (ui?: UiSettings) => renderWithEvents(
<UserInterfaceSettings settings={Mock.of<Settings>({ ui })} setUiSettings={setUiSettings} />,
<UserInterfaceSettings settings={fromPartial({ ui })} setUiSettings={setUiSettings} />,
);
afterEach(jest.clearAllMocks);
it.each([
[{ theme: 'dark' as Theme }, true],
[{ theme: 'light' as Theme }, false],

View File

@@ -1,17 +1,15 @@
import { screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { Settings } from '../../src/settings/reducers/settings';
import { VisitsSettings } from '../../src/settings/VisitsSettings';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<VisitsSettings />', () => {
const setVisitsSettings = jest.fn();
const setVisitsSettings = vi.fn();
const setUp = (settings: Partial<Settings> = {}) => renderWithEvents(
<VisitsSettings settings={Mock.of<Settings>(settings)} setVisitsSettings={setVisitsSettings} />,
<VisitsSettings settings={fromPartial(settings)} setVisitsSettings={setVisitsSettings} />,
);
afterEach(jest.clearAllMocks);
it('renders expected components', () => {
setUp();
@@ -21,10 +19,10 @@ describe('<VisitsSettings />', () => {
});
it.each([
[Mock.all<Settings>(), 'Last 30 days'],
[Mock.of<Settings>({ visits: {} }), 'Last 30 days'],
[fromPartial<Settings>({}), 'Last 30 days'],
[fromPartial<Settings>({ visits: {} }), 'Last 30 days'],
[
Mock.of<Settings>({
fromPartial<Settings>({
visits: {
defaultInterval: 'last7Days',
},
@@ -32,7 +30,7 @@ describe('<VisitsSettings />', () => {
'Last 7 days',
],
[
Mock.of<Settings>({
fromPartial<Settings>({
visits: {
defaultInterval: 'today',
},
@@ -63,17 +61,17 @@ describe('<VisitsSettings />', () => {
it.each([
[
Mock.all<Settings>(),
fromPartial<Settings>({}),
/The visits coming from potential bots will be included.$/,
/The visits coming from potential bots will be excluded.$/,
],
[
Mock.of<Settings>({ visits: { excludeBots: false } }),
fromPartial<Settings>({ visits: { excludeBots: false } }),
/The visits coming from potential bots will be included.$/,
/The visits coming from potential bots will be excluded.$/,
],
[
Mock.of<Settings>({ visits: { excludeBots: true } }),
fromPartial<Settings>({ visits: { excludeBots: true } }),
/The visits coming from potential bots will be excluded.$/,
/The visits coming from potential bots will be included.$/,
],

View File

@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`<UserInterfaceSettings /> shows different icons based on theme 1`] = `
exports[`<UserInterfaceSettings /> > shows different icons based on theme 1`] = `
<svg
aria-hidden="true"
class="svg-inline--fa fa-moon user-interface__theme-icon"
@@ -18,7 +18,7 @@ exports[`<UserInterfaceSettings /> shows different icons based on theme 1`] = `
</svg>
`;
exports[`<UserInterfaceSettings /> shows different icons based on theme 2`] = `
exports[`<UserInterfaceSettings /> > shows different icons based on theme 2`] = `
<svg
aria-hidden="true"
class="svg-inline--fa fa-sun user-interface__theme-icon"
@@ -36,7 +36,7 @@ exports[`<UserInterfaceSettings /> shows different icons based on theme 2`] = `
</svg>
`;
exports[`<UserInterfaceSettings /> shows different icons based on theme 3`] = `
exports[`<UserInterfaceSettings /> > shows different icons based on theme 3`] = `
<svg
aria-hidden="true"
class="svg-inline--fa fa-sun user-interface__theme-icon"

View File

@@ -1,4 +1,4 @@
import { Mock } from 'ts-mockery';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShlinkState } from '../../../src/container/types';
import { migrateDeprecatedSettings } from '../../../src/settings/helpers';
@@ -9,7 +9,7 @@ describe('settings-helpers', () => {
});
it('updates settings as expected', () => {
const state = Mock.of<ShlinkState>({
const state = fromPartial<ShlinkState>({
settings: {
visits: {
defaultInterval: 'last180days' as any,

View File

@@ -1,6 +1,5 @@
import { render, screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import type { Settings } from '../../src/settings/reducers/settings';
import { fromPartial } from '@total-typescript/shoehorn';
import { CreateShortUrl as createShortUrlsCreator } from '../../src/short-urls/CreateShortUrl';
import type { ShortUrlCreation } from '../../src/short-urls/reducers/shortUrlCreation';
@@ -8,8 +7,8 @@ describe('<CreateShortUrl />', () => {
const ShortUrlForm = () => <span>ShortUrlForm</span>;
const CreateShortUrlResult = () => <span>CreateShortUrlResult</span>;
const shortUrlCreation = { validateUrls: true };
const shortUrlCreationResult = Mock.all<ShortUrlCreation>();
const createShortUrl = jest.fn(async () => Promise.resolve());
const shortUrlCreationResult = fromPartial<ShortUrlCreation>({});
const createShortUrl = vi.fn(async () => Promise.resolve());
const CreateShortUrl = createShortUrlsCreator(ShortUrlForm, CreateShortUrlResult);
const setUp = () => render(
<CreateShortUrl
@@ -17,7 +16,7 @@ describe('<CreateShortUrl />', () => {
createShortUrl={createShortUrl}
selectedServer={null}
resetCreateShortUrl={() => {}}
settings={Mock.of<Settings>({ shortUrlCreation })}
settings={fromPartial({ shortUrlCreation })}
/>,
);

View File

@@ -1,8 +1,6 @@
import { render, screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { Settings } from '../../src/settings/reducers/settings';
import type { ShortUrl } from '../../src/short-urls/data';
import { EditShortUrl as createEditShortUrl } from '../../src/short-urls/EditShortUrl';
import type { ShortUrlDetail } from '../../src/short-urls/reducers/shortUrlDetail';
import type { ShortUrlEdition } from '../../src/short-urls/reducers/shortUrlEdition';
@@ -13,12 +11,12 @@ describe('<EditShortUrl />', () => {
const setUp = (detail: Partial<ShortUrlDetail> = {}, edition: Partial<ShortUrlEdition> = {}) => render(
<MemoryRouter>
<EditShortUrl
settings={Mock.of<Settings>({ shortUrlCreation })}
settings={fromPartial({ shortUrlCreation })}
selectedServer={null}
shortUrlDetail={Mock.of<ShortUrlDetail>(detail)}
shortUrlEdition={Mock.of<ShortUrlEdition>(edition)}
getShortUrlDetail={jest.fn()}
editShortUrl={jest.fn(async () => Promise.resolve())}
shortUrlDetail={fromPartial(detail)}
shortUrlEdition={fromPartial(edition)}
getShortUrlDetail={vi.fn()}
editShortUrl={vi.fn(async () => Promise.resolve())}
/>
</MemoryRouter>,
);
@@ -38,7 +36,7 @@ describe('<EditShortUrl />', () => {
});
it('renders form when detail properly loads', () => {
setUp({ shortUrl: Mock.of<ShortUrl>({ meta: {} }) });
setUp({ shortUrl: fromPartial({ meta: {} }) });
expect(screen.getByText('ShortUrlForm')).toBeInTheDocument();
expect(screen.queryByText('Loading...')).not.toBeInTheDocument();

View File

@@ -1,12 +1,12 @@
import { render, screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { ShlinkPaginator } from '../../src/api/types';
import { Paginator } from '../../src/short-urls/Paginator';
import { ELLIPSIS } from '../../src/utils/helpers/pagination';
describe('<Paginator />', () => {
const buildPaginator = (pagesCount?: number) => Mock.of<ShlinkPaginator>({ pagesCount, currentPage: 1 });
const buildPaginator = (pagesCount?: number) => fromPartial<ShlinkPaginator>({ pagesCount, currentPage: 1 });
const setUp = (paginator?: ShlinkPaginator, currentQueryString?: string) => render(
<MemoryRouter>
<Paginator serverId="abc123" paginator={paginator} currentQueryString={currentQueryString} />

View File

@@ -1,7 +1,7 @@
import { screen } from '@testing-library/react';
import type { UserEvent } from '@testing-library/user-event/setup/setup';
import { fromPartial } from '@total-typescript/shoehorn';
import { formatISO } from 'date-fns';
import { Mock } from 'ts-mockery';
import type { ReachableServer, SelectedServer } from '../../src/servers/data';
import type { Mode } from '../../src/short-urls/ShortUrlForm';
import { ShortUrlForm as createShortUrlForm } from '../../src/short-urls/ShortUrlForm';
@@ -10,7 +10,7 @@ import type { OptionalString } from '../../src/utils/utils';
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<ShortUrlForm />', () => {
const createShortUrl = jest.fn(async () => Promise.resolve());
const createShortUrl = vi.fn(async () => Promise.resolve());
const ShortUrlForm = createShortUrlForm(() => <span>TagsSelector</span>, () => <span>DomainSelector</span>);
const setUp = (selectedServer: SelectedServer = null, mode: Mode = 'create', title?: OptionalString) =>
renderWithEvents(
@@ -23,8 +23,6 @@ describe('<ShortUrlForm />', () => {
/>,
);
afterEach(jest.clearAllMocks);
it.each([
[
async (user: UserEvent) => {
@@ -51,7 +49,7 @@ describe('<ShortUrlForm />', () => {
ios: 'https://ios.com',
},
},
Mock.of<ReachableServer>({ version: '3.5.0' }),
fromPartial<ReachableServer>({ version: '3.5.0' }),
],
])('saves short URL with data set in form controls', async (extraFields, extraExpectedValues, selectedServer) => {
const { user } = setUp(selectedServer);
@@ -102,7 +100,7 @@ describe('<ShortUrlForm />', () => {
[undefined, false, undefined],
['old title', false, null],
])('sends expected title based on original and new values', async (originalTitle, withNewTitle, expectedSentTitle) => {
const { user } = setUp(Mock.of<ReachableServer>({ version: '2.6.0' }), 'create', originalTitle);
const { user } = setUp(fromPartial({ version: '2.6.0' }), 'create', originalTitle);
await user.type(screen.getByPlaceholderText('URL to be shortened'), 'https://long-domain.com/foo/bar');
await user.clear(screen.getByPlaceholderText('Title'));
@@ -117,10 +115,10 @@ describe('<ShortUrlForm />', () => {
});
it.each([
[Mock.of<ReachableServer>({ version: '3.0.0' }), false],
[Mock.of<ReachableServer>({ version: '3.4.0' }), false],
[Mock.of<ReachableServer>({ version: '3.5.0' }), true],
[Mock.of<ReachableServer>({ version: '3.6.0' }), true],
[fromPartial<ReachableServer>({ version: '3.0.0' }), false],
[fromPartial<ReachableServer>({ version: '3.4.0' }), false],
[fromPartial<ReachableServer>({ version: '3.5.0' }), true],
[fromPartial<ReachableServer>({ version: '3.6.0' }), true],
])('shows device-specific long URLs only for servers supporting it', (selectedServer, fieldsExist) => {
setUp(selectedServer);
const placeholders = ['Android-specific redirection', 'iOS-specific redirection', 'Desktop-specific redirection'];

View File

@@ -1,25 +1,24 @@
import { screen, waitFor } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { endOfDay, formatISO, startOfDay } from 'date-fns';
import { MemoryRouter, useLocation, useNavigate } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { ReachableServer, SelectedServer } from '../../src/servers/data';
import type { Settings } from '../../src/settings/reducers/settings';
import { ShortUrlsFilteringBar as filteringBarCreator } from '../../src/short-urls/ShortUrlsFilteringBar';
import { formatDate } from '../../src/utils/helpers/date';
import type { DateRange } from '../../src/utils/helpers/dateIntervals';
import { renderWithEvents } from '../__helpers__/setUpTest';
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
useParams: jest.fn().mockReturnValue({ serverId: '1' }),
useNavigate: jest.fn(),
useLocation: jest.fn().mockReturnValue({}),
vi.mock('react-router-dom', async () => ({
...(await vi.importActual<any>('react-router-dom')),
useParams: vi.fn().mockReturnValue({ serverId: '1' }),
useNavigate: vi.fn(),
useLocation: vi.fn().mockReturnValue({}),
}));
describe('<ShortUrlsFilteringBar />', () => {
const ShortUrlsFilteringBar = filteringBarCreator(() => <>ExportShortUrlsBtn</>, () => <>TagsSelector</>);
const navigate = jest.fn();
const handleOrderBy = jest.fn();
const navigate = vi.fn();
const handleOrderBy = vi.fn();
const now = new Date();
const setUp = (search = '', selectedServer?: SelectedServer) => {
(useLocation as any).mockReturnValue({ search });
@@ -28,17 +27,15 @@ describe('<ShortUrlsFilteringBar />', () => {
return renderWithEvents(
<MemoryRouter>
<ShortUrlsFilteringBar
selectedServer={selectedServer ?? Mock.all<SelectedServer>()}
selectedServer={selectedServer ?? fromPartial({})}
order={{}}
handleOrderBy={handleOrderBy}
settings={Mock.of<Settings>({ visits: {} })}
settings={fromPartial({ visits: {} })}
/>
</MemoryRouter>,
);
};
afterEach(jest.clearAllMocks);
it('renders expected children components', () => {
setUp();
@@ -74,12 +71,12 @@ describe('<ShortUrlsFilteringBar />', () => {
});
it.each([
['tags=foo,bar,baz', Mock.of<ReachableServer>({ version: '3.0.0' }), true],
['tags=foo,bar', Mock.of<ReachableServer>({ version: '3.1.0' }), true],
['tags=foo', Mock.of<ReachableServer>({ version: '3.0.0' }), false],
['', Mock.of<ReachableServer>({ version: '3.0.0' }), false],
['tags=foo,bar,baz', Mock.of<ReachableServer>({ version: '2.10.0' }), false],
['', Mock.of<ReachableServer>({ version: '2.10.0' }), false],
['tags=foo,bar,baz', fromPartial<ReachableServer>({ version: '3.0.0' }), true],
['tags=foo,bar', fromPartial<ReachableServer>({ version: '3.1.0' }), true],
['tags=foo', fromPartial<ReachableServer>({ version: '3.0.0' }), false],
['', fromPartial<ReachableServer>({ version: '3.0.0' }), false],
['tags=foo,bar,baz', fromPartial<ReachableServer>({ version: '2.10.0' }), false],
['', fromPartial<ReachableServer>({ version: '2.10.0' }), false],
])(
'renders tags mode toggle if the server supports it and there is more than one tag selected',
(search, selectedServer, shouldHaveComponent) => {
@@ -98,7 +95,7 @@ describe('<ShortUrlsFilteringBar />', () => {
['&tagsMode=all', 'With all the tags.'],
['&tagsMode=any', 'With any of the tags.'],
])('expected tags mode tooltip title', async (initialTagsMode, expectedToggleText) => {
const { user } = setUp(`tags=foo,bar${initialTagsMode}`, Mock.of<ReachableServer>({ version: '3.0.0' }));
const { user } = setUp(`tags=foo,bar${initialTagsMode}`, fromPartial({ version: '3.0.0' }));
await user.hover(screen.getByLabelText('Change tags mode'));
expect(await screen.findByRole('tooltip')).toHaveTextContent(expectedToggleText);
@@ -109,7 +106,7 @@ describe('<ShortUrlsFilteringBar />', () => {
['&tagsMode=all', 'tagsMode=any'],
['&tagsMode=any', 'tagsMode=all'],
])('redirects to first page when tags mode changes', async (initialTagsMode, expectedRedirectTagsMode) => {
const { user } = setUp(`tags=foo,bar${initialTagsMode}`, Mock.of<ReachableServer>({ version: '3.0.0' }));
const { user } = setUp(`tags=foo,bar${initialTagsMode}`, fromPartial({ version: '3.0.0' }));
expect(navigate).not.toHaveBeenCalled();
await user.click(screen.getByLabelText('Change tags mode'));
@@ -127,7 +124,7 @@ describe('<ShortUrlsFilteringBar />', () => {
['excludePastValidUntil=false', /Exclude enabled in the past/, 'excludePastValidUntil=true'],
['excludePastValidUntil=true', /Exclude enabled in the past/, 'excludePastValidUntil=false'],
])('allows to toggle filters through filtering dropdown', async (search, menuItemName, expectedQuery) => {
const { user } = setUp(search, Mock.of<ReachableServer>({ version: '3.4.0' }));
const { user } = setUp(search, fromPartial({ version: '3.4.0' }));
const toggleFilter = async (name: RegExp) => {
await user.click(screen.getByRole('button', { name: 'Filters' }));
await waitFor(() => screen.findByRole('menu'));

View File

@@ -1,36 +1,35 @@
import { screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter, useNavigate } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { MercureBoundProps } from '../../src/mercure/helpers/boundToMercureHub';
import type { ReachableServer } from '../../src/servers/data';
import type { Settings } from '../../src/settings/reducers/settings';
import type { ShortUrl, ShortUrlsOrder } from '../../src/short-urls/data';
import type { ShortUrlsOrder } from '../../src/short-urls/data';
import type { ShortUrlsList as ShortUrlsListModel } from '../../src/short-urls/reducers/shortUrlsList';
import { ShortUrlsList as createShortUrlsList } from '../../src/short-urls/ShortUrlsList';
import type { ShortUrlsTableType } from '../../src/short-urls/ShortUrlsTable';
import type { SemVer } from '../../src/utils/helpers/version';
import { renderWithEvents } from '../__helpers__/setUpTest';
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
useNavigate: jest.fn().mockReturnValue(jest.fn()),
useLocation: jest.fn().mockReturnValue({ search: '?tags=test%20tag&search=example.com' }),
vi.mock('react-router-dom', async () => ({
...(await vi.importActual<any>('react-router-dom')),
useNavigate: vi.fn().mockReturnValue(vi.fn()),
useLocation: vi.fn().mockReturnValue({ search: '?tags=test%20tag&search=example.com' }),
}));
describe('<ShortUrlsList />', () => {
const ShortUrlsTable: ShortUrlsTableType = ({ onTagClick }) => <span onClick={() => onTagClick?.('foo')}>ShortUrlsTable</span>;
const ShortUrlsFilteringBar = () => <span>ShortUrlsFilteringBar</span>;
const listShortUrlsMock = jest.fn();
const navigate = jest.fn();
const shortUrlsList = Mock.of<ShortUrlsListModel>({
const listShortUrlsMock = vi.fn();
const navigate = vi.fn();
const shortUrlsList = fromPartial<ShortUrlsListModel>({
shortUrls: {
data: [
Mock.of<ShortUrl>({
{
shortCode: 'testShortCode',
shortUrl: 'https://www.example.com/testShortUrl',
longUrl: 'https://www.example.com/testLongUrl',
tags: ['test tag'],
}),
},
],
pagination: { pagesCount: 3 },
},
@@ -39,11 +38,11 @@ describe('<ShortUrlsList />', () => {
const setUp = (settings: Partial<Settings> = {}, version: SemVer = '3.0.0') => renderWithEvents(
<MemoryRouter>
<ShortUrlsList
{...Mock.of<MercureBoundProps>({ mercureInfo: { loading: true } })}
{...fromPartial<MercureBoundProps>({ mercureInfo: { loading: true } })}
listShortUrls={listShortUrlsMock}
shortUrlsList={shortUrlsList}
selectedServer={Mock.of<ReachableServer>({ id: '1', version })}
settings={Mock.of<Settings>(settings)}
selectedServer={fromPartial({ id: '1', version })}
settings={fromPartial(settings)}
/>
</MemoryRouter>,
);
@@ -52,8 +51,6 @@ describe('<ShortUrlsList />', () => {
(useNavigate as any).mockReturnValue(navigate);
});
afterEach(jest.clearAllMocks);
it('wraps expected components', () => {
setUp();
@@ -81,9 +78,9 @@ describe('<ShortUrlsList />', () => {
});
it.each([
[Mock.of<ShortUrlsOrder>({ field: 'visits', dir: 'ASC' }), 'visits', 'ASC'],
[Mock.of<ShortUrlsOrder>({ field: 'title', dir: 'DESC' }), 'title', 'DESC'],
[Mock.all<ShortUrlsOrder>(), undefined, undefined],
[fromPartial<ShortUrlsOrder>({ field: 'visits', dir: 'ASC' }), 'visits', 'ASC'],
[fromPartial<ShortUrlsOrder>({ field: 'title', dir: 'DESC' }), 'title', 'DESC'],
[fromPartial<ShortUrlsOrder>({}), undefined, undefined],
])('has expected initial ordering based on settings', (defaultOrdering, field, dir) => {
setUp({ shortUrlsList: { defaultOrdering } });
expect(listShortUrlsMock).toHaveBeenCalledWith(expect.objectContaining({
@@ -92,23 +89,23 @@ describe('<ShortUrlsList />', () => {
});
it.each([
[Mock.of<Settings>({
[fromPartial<Settings>({
shortUrlsList: {
defaultOrdering: { field: 'visits', dir: 'ASC' },
},
}), '3.3.0' as SemVer, { field: 'visits', dir: 'ASC' }],
[Mock.of<Settings>({
[fromPartial<Settings>({
shortUrlsList: {
defaultOrdering: { field: 'visits', dir: 'ASC' },
},
visits: { excludeBots: true },
}), '3.3.0' as SemVer, { field: 'visits', dir: 'ASC' }],
[Mock.of<Settings>({
[fromPartial<Settings>({
shortUrlsList: {
defaultOrdering: { field: 'visits', dir: 'ASC' },
},
}), '3.4.0' as SemVer, { field: 'visits', dir: 'ASC' }],
[Mock.of<Settings>({
[fromPartial<Settings>({
shortUrlsList: {
defaultOrdering: { field: 'visits', dir: 'ASC' },
},

View File

@@ -1,6 +1,6 @@
import { fireEvent, screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import type { ReachableServer, SelectedServer } from '../../src/servers/data';
import { fromPartial } from '@total-typescript/shoehorn';
import type { SelectedServer } from '../../src/servers/data';
import type { ShortUrlsOrderableFields } from '../../src/short-urls/data';
import { SHORT_URLS_ORDERABLE_FIELDS } from '../../src/short-urls/data';
import type { ShortUrlsList } from '../../src/short-urls/reducers/shortUrlsList';
@@ -8,15 +8,13 @@ import { ShortUrlsTable as shortUrlsTableCreator } from '../../src/short-urls/Sh
import { renderWithEvents } from '../__helpers__/setUpTest';
describe('<ShortUrlsTable />', () => {
const shortUrlsList = Mock.all<ShortUrlsList>();
const orderByColumn = jest.fn();
const shortUrlsList = fromPartial<ShortUrlsList>({});
const orderByColumn = vi.fn();
const ShortUrlsTable = shortUrlsTableCreator(() => <span>ShortUrlsRow</span>);
const setUp = (server: SelectedServer = null) => renderWithEvents(
<ShortUrlsTable shortUrlsList={shortUrlsList} selectedServer={server} orderByColumn={() => orderByColumn} />,
);
afterEach(jest.resetAllMocks);
it('should render inner table by default', () => {
setUp();
expect(screen.getByRole('table')).toBeInTheDocument();
@@ -56,7 +54,7 @@ describe('<ShortUrlsTable />', () => {
});
it('should render composed title column', () => {
setUp(Mock.of<ReachableServer>({ version: '2.0.0' }));
setUp(fromPartial({ version: '2.0.0' }));
const { innerHTML } = screen.getAllByRole('columnheader')[2];

View File

@@ -1,21 +1,18 @@
import { screen } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import type { ShortUrl } from '../../../src/short-urls/data';
import { fromPartial } from '@total-typescript/shoehorn';
import { CreateShortUrlResult as createResult } from '../../../src/short-urls/helpers/CreateShortUrlResult';
import type { ShortUrlCreation } from '../../../src/short-urls/reducers/shortUrlCreation';
import type { TimeoutToggle } from '../../../src/utils/helpers/hooks';
import { renderWithEvents } from '../../__helpers__/setUpTest';
describe('<CreateShortUrlResult />', () => {
const copyToClipboard = jest.fn();
const useTimeoutToggle = jest.fn(() => [false, copyToClipboard]) as TimeoutToggle;
const copyToClipboard = vi.fn();
const useTimeoutToggle = vi.fn(() => [false, copyToClipboard]) as TimeoutToggle;
const CreateShortUrlResult = createResult(useTimeoutToggle);
const setUp = (creation: ShortUrlCreation) => renderWithEvents(
<CreateShortUrlResult resetCreateShortUrl={() => {}} creation={creation} />,
);
afterEach(jest.clearAllMocks);
it('renders an error when error is true', () => {
setUp({ error: true, saved: false, saving: false });
expect(screen.getByText('An error occurred while creating the URL :(')).toBeInTheDocument();
@@ -28,14 +25,14 @@ describe('<CreateShortUrlResult />', () => {
it('renders a result message when result is provided', () => {
setUp(
{ result: Mock.of<ShortUrl>({ shortUrl: 'https://s.test/abc123' }), saving: false, saved: true, error: false },
{ result: fromPartial({ shortUrl: 'https://s.test/abc123' }), saving: false, saved: true, error: false },
);
expect(screen.getByText(/The short URL is/)).toHaveTextContent('Great! The short URL is https://s.test/abc123');
});
it('Invokes tooltip timeout when copy to clipboard button is clicked', async () => {
const { user } = setUp(
{ result: Mock.of<ShortUrl>({ shortUrl: 'https://s.test/abc123' }), saving: false, saved: true, error: false },
{ result: fromPartial({ shortUrl: 'https://s.test/abc123' }), saving: false, saved: true, error: false },
);
expect(copyToClipboard).not.toHaveBeenCalled();

View File

@@ -1,6 +1,6 @@
import { screen, waitFor } from '@testing-library/react';
import { Mock } from 'ts-mockery';
import type { InvalidShortUrlDeletion, ProblemDetailsError } from '../../../src/api/types/errors';
import { fromPartial } from '@total-typescript/shoehorn';
import type { InvalidShortUrlDeletion } from '../../../src/api/types/errors';
import { ErrorTypeV2, ErrorTypeV3 } from '../../../src/api/types/errors';
import type { ShortUrl } from '../../../src/short-urls/data';
import { DeleteShortUrlModal } from '../../../src/short-urls/helpers/DeleteShortUrlModal';
@@ -9,36 +9,34 @@ import { renderWithEvents } from '../../__helpers__/setUpTest';
import { TestModalWrapper } from '../../__helpers__/TestModalWrapper';
describe('<DeleteShortUrlModal />', () => {
const shortUrl = Mock.of<ShortUrl>({
const shortUrl = fromPartial<ShortUrl>({
tags: [],
shortCode: 'abc123',
longUrl: 'https://long-domain.com/foo/bar',
});
const deleteShortUrl = jest.fn().mockResolvedValue(undefined);
const shortUrlDeleted = jest.fn();
const deleteShortUrl = vi.fn().mockResolvedValue(undefined);
const shortUrlDeleted = vi.fn();
const setUp = (shortUrlDeletion: Partial<ShortUrlDeletion>) => renderWithEvents(
<TestModalWrapper
renderModal={(args) => (
<DeleteShortUrlModal
{...args}
shortUrl={shortUrl}
shortUrlDeletion={Mock.of<ShortUrlDeletion>(shortUrlDeletion)}
shortUrlDeletion={fromPartial(shortUrlDeletion)}
deleteShortUrl={deleteShortUrl}
shortUrlDeleted={shortUrlDeleted}
resetDeleteShortUrl={jest.fn()}
resetDeleteShortUrl={vi.fn()}
/>
)}
/>,
);
afterEach(jest.clearAllMocks);
it('shows generic error when non-threshold error occurs', () => {
setUp({
loading: false,
error: true,
shortCode: 'abc123',
errorData: Mock.of<ProblemDetailsError>({ type: 'OTHER_ERROR' }),
errorData: fromPartial({ type: 'OTHER_ERROR' }),
});
expect(screen.getByText('Something went wrong while deleting the URL :(').parentElement).not.toHaveClass(
'bg-warning',
@@ -46,8 +44,8 @@ describe('<DeleteShortUrlModal />', () => {
});
it.each([
[Mock.of<InvalidShortUrlDeletion>({ type: ErrorTypeV3.INVALID_SHORT_URL_DELETION })],
[Mock.of<InvalidShortUrlDeletion>({ type: ErrorTypeV2.INVALID_SHORT_URL_DELETION })],
[fromPartial<InvalidShortUrlDeletion>({ type: ErrorTypeV3.INVALID_SHORT_URL_DELETION })],
[fromPartial<InvalidShortUrlDeletion>({ type: ErrorTypeV2.INVALID_SHORT_URL_DELETION })],
])('shows specific error when threshold error occurs', (errorData) => {
setUp({ loading: false, error: true, shortCode: 'abc123', errorData });
expect(screen.getByText('Something went wrong while deleting the URL :(').parentElement).toHaveClass('bg-warning');

View File

@@ -1,25 +1,24 @@
import { screen } from '@testing-library/react';
import { fromPartial } from '@total-typescript/shoehorn';
import { MemoryRouter } from 'react-router-dom';
import { Mock } from 'ts-mockery';
import type { ReportExporter } from '../../../src/common/services/ReportExporter';
import type { NotFoundServer, ReachableServer, SelectedServer } from '../../../src/servers/data';
import type { NotFoundServer, SelectedServer } from '../../../src/servers/data';
import type { ShortUrl } from '../../../src/short-urls/data';
import { ExportShortUrlsBtn as createExportShortUrlsBtn } from '../../../src/short-urls/helpers/ExportShortUrlsBtn';
import { renderWithEvents } from '../../__helpers__/setUpTest';
describe('<ExportShortUrlsBtn />', () => {
const listShortUrls = jest.fn();
const buildShlinkApiClient = jest.fn().mockReturnValue({ listShortUrls });
const exportShortUrls = jest.fn();
const reportExporter = Mock.of<ReportExporter>({ exportShortUrls });
const listShortUrls = vi.fn();
const buildShlinkApiClient = vi.fn().mockReturnValue({ listShortUrls });
const exportShortUrls = vi.fn();
const reportExporter = fromPartial<ReportExporter>({ exportShortUrls });
const ExportShortUrlsBtn = createExportShortUrlsBtn(buildShlinkApiClient, reportExporter);
const setUp = (amount?: number, selectedServer?: SelectedServer) => renderWithEvents(
<MemoryRouter>
<ExportShortUrlsBtn selectedServer={selectedServer ?? Mock.all<SelectedServer>()} amount={amount} />
<ExportShortUrlsBtn selectedServer={selectedServer ?? fromPartial({})} amount={amount} />
</MemoryRouter>,
);
afterEach(jest.clearAllMocks);
it.each([
[undefined, '0'],
[1, '1'],
@@ -31,7 +30,7 @@ describe('<ExportShortUrlsBtn />', () => {
it.each([
[null],
[Mock.of<NotFoundServer>()],
[fromPartial<NotFoundServer>({})],
])('does nothing on click if selected server is not reachable', async (selectedServer) => {
const { user } = setUp(0, selectedServer);
@@ -49,11 +48,29 @@ describe('<ExportShortUrlsBtn />', () => {
[385, 20],
])('loads proper amount of pages based on the amount of results', async (amount, expectedPageLoads) => {
listShortUrls.mockResolvedValue({ data: [] });
const { user } = setUp(amount, Mock.of<ReachableServer>({ id: '123' }));
const { user } = setUp(amount, fromPartial({ id: '123' }));
await user.click(screen.getByRole('button'));
expect(listShortUrls).toHaveBeenCalledTimes(expectedPageLoads);
expect(exportShortUrls).toHaveBeenCalled();
});
it('maps short URLs for exporting', async () => {
listShortUrls.mockResolvedValue({
data: [fromPartial<ShortUrl>({
shortUrl: 'https://s.test/short-code',
tags: [],
})],
});
const { user } = setUp(undefined, fromPartial({ id: '123' }));
await user.click(screen.getByRole('button'));
expect(exportShortUrls).toHaveBeenCalledWith([expect.objectContaining({
shortUrl: 'https://s.test/short-code',
domain: 's.test',
shortCode: 'short-code',
})]);
});
});

Some files were not shown because too many files have changed in this diff Show More