Merge pull request 'feat: add tests' (#79) from feature/test into main
All checks were successful
it-academy/dry-wash-pl/pipeline/head This commit looks good

Reviewed-on: #79
Reviewed-by: Primakov Alexandr Alexandrovich <primakovpro@gmail.com>
This commit is contained in:
Ильназ 2025-02-04 19:41:58 +03:00
commit ad1f948641
9 changed files with 5375 additions and 470 deletions

1
__mocks__/file-mock.ts Normal file
View File

@ -0,0 +1 @@
module.exports = 'file';

7
babel.config.js Normal file
View File

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

View File

@ -1,12 +1,13 @@
import globals from "globals";
import pluginJs from "@eslint/js";
import tseslint from "typescript-eslint";
import pluginReact from "eslint-plugin-react";
import globals from 'globals';
import pluginJs from '@eslint/js';
import tseslint from 'typescript-eslint';
import pluginReact from 'eslint-plugin-react';
import stylistic from '@stylistic/eslint-plugin';
import pluginImport from 'eslint-plugin-import';
export default [
{ files: ["**/*.{js,mjs,cjs,ts,jsx,tsx}"] },
{ files: ['**/*.{js,mjs,cjs,ts,jsx,tsx}'] },
{ languageOptions: { globals: globals.browser } },
pluginJs.configs.recommended,
...tseslint.configs.recommended,
@ -14,35 +15,38 @@ export default [
{
plugins: {
'@stylistic': stylistic,
'import': pluginImport,
import: pluginImport,
},
"rules": {
"no-unused-vars": "off",
"@typescript-eslint/no-unused-vars": [
"warn", // or "error"
rules: {
'no-unused-vars': 'off',
'@typescript-eslint/no-unused-vars': [
'warn', // or "error"
{
"argsIgnorePattern": "^_",
"varsIgnorePattern": "^_",
"caughtErrorsIgnorePattern": "^_"
}
argsIgnorePattern: '^_',
varsIgnorePattern: '^_',
caughtErrorsIgnorePattern: '^_',
},
],
"sort-imports": ["off"],
"import/order": [
"error",
'sort-imports': ['off'],
'import/order': [
'error',
{
"groups": [
"builtin",
"external",
"internal",
"parent",
["sibling", "index"]
groups: [
'builtin',
'external',
'internal',
'parent',
['sibling', 'index'],
],
"newlines-between": "always",
}
'newlines-between': 'always',
},
],
semi: ["error", "always"],
semi: ['error', 'always'],
'@stylistic/indent': ['error', 2],
'react/prop-types': 'off'
'react/prop-types': 'off',
},
}
},
{
ignores: ['babel.config.js'],
},
];

View File

@ -0,0 +1,17 @@
module.exports = {
transform: {
'^.+\\.tsx?$': 'babel-jest',
},
coverageProvider: 'v8',
coverageDirectory: 'coverage',
collectCoverageFrom: ['**/src/**/*.{ts,tsx}', '!**/src/app.tsx'],
collectCoverage: true,
clearMocks: true,
moduleNameMapper: {
'\\.(svg|webp)$': '<rootDir>/__mocks__/file',
},
testEnvironmentOptions: {
customExportConditions: [''],
},
testEnvironment: 'jest-fixed-jsdom',
};

5276
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -4,7 +4,7 @@
"description": "<a id=\"readme-top\"></a>",
"main": "./src/index.tsx",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"test": "jest -u",
"start": "brojs server --port=8099 --with-open-browser",
"build": "npm run clean && brojs build --dev",
"build:prod": "npm run clean && brojs build",
@ -18,6 +18,10 @@
"license": "ISC",
"dependencies": {
"@brojs/cli": "^1.8.4",
"@babel/core": "^7.26.7",
"@babel/preset-env": "^7.26.7",
"@babel/preset-react": "^7.26.3",
"@babel/preset-typescript": "^7.26.0",
"@chakra-ui/icons": "^2.2.4",
"@chakra-ui/react": "^2.10.5",
"@emotion/react": "^11.4.1",
@ -26,12 +30,19 @@
"@lottiefiles/react-lottie-player": "^3.5.4",
"@pbe/react-yandex-maps": "^1.2.5",
"@reduxjs/toolkit": "^2.5.0",
"@testing-library/dom": "^10.4.0",
"@testing-library/react": "^16.2.0",
"@types/react": "^18.3.12",
"babel-jest": "^29.7.0",
"dayjs": "^1.11.13",
"express": "^4.21.1",
"framer-motion": "^6.2.8",
"i18next": "^23.16.4",
"jest": "^29.7.0",
"jest-environment-jsdom": "^29.7.0",
"jest-fixed-jsdom": "^0.0.9",
"keycloak-js": "^23.0.7",
"msw": "^2.7.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-hook-form": "^7.53.2",
@ -39,7 +50,9 @@
"react-icons": "^5.3.0",
"react-phone-number-input": "^3.4.9",
"react-redux": "^9.2.0",
"react-router-dom": "^6.27.0"
"react-router-dom": "^6.27.0",
"ts-jest": "^29.2.5",
"ts-node": "^10.9.2"
},
"devDependencies": {
"@eslint/js": "^9.14.0",
@ -50,6 +63,10 @@
"eslint-plugin-react": "^7.37.2",
"globals": "^15.11.0",
"prettier": "3.3.3",
"typescript": "^5.7.3",
"typescript-eslint": "^8.12.2"
},
"jest": {
"preset": "./jest-preset-it/jest-preset.ts"
}
}

View File

@ -0,0 +1,325 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Arm Page render 1`] = `
<div>
<div
class="css-1yeiifd"
>
<div
class="css-1fp6kaj"
>
<h2
class="chakra-heading css-9q1d0h"
>
title
</h2>
<div
class="chakra-stack css-1oen434"
>
<hr
aria-orientation="horizontal"
class="chakra-divider css-1upb9tn"
/>
<a
class="chakra-button css-uxt1e8"
href="/auth/login"
>
orders
</a>
<hr
aria-orientation="horizontal"
class="chakra-divider css-1upb9tn"
/>
<a
class="chakra-button css-uxt1e8"
href="/auth/login"
>
master
</a>
<hr
aria-orientation="horizontal"
class="chakra-divider css-1upb9tn"
/>
</div>
</div>
<div
class="css-sy55x5"
>
<div
class="css-hpgf8j"
>
<h2
class="chakra-heading css-r7q7qr"
>
title
</h2>
<div
class="css-1me9tx"
>
<button
class="chakra-button css-4xx2wk"
type="button"
>
<svg
class="chakra-icon css-onkibi"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
fill="currentColor"
/>
</svg>
</button>
<p
class="chakra-text css-1bntq7d"
>
2/2/2025
</p>
<button
class="chakra-button css-4xx2wk"
type="button"
>
<svg
class="chakra-icon css-onkibi"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"
fill="currentColor"
/>
</svg>
</button>
</div>
<table
class="chakra-table css-0"
>
<thead
class="css-0"
>
<tr
class="css-0"
>
<th
class="css-0"
>
table.header.carNumber
</th>
<th
class="css-0"
>
table.header.orderDate
</th>
<th
class="css-0"
>
table.header.status
</th>
<th
class="css-0"
>
table.header.masters
</th>
<th
class="css-0"
>
table.header.telephone
</th>
<th
class="css-0"
>
table.header.location
</th>
</tr>
</thead>
<tbody
class="css-0"
>
<tr
class="css-0"
>
<td
class="css-12rlgei"
colspan="6"
>
<div
class="chakra-spinner css-1y7joxr"
>
<span
class="css-8b45rq"
>
Loading...
</span>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
`;
exports[`Arm Page render 2`] = `
<div>
<div
class="css-1yeiifd"
>
<div
class="css-1fp6kaj"
>
<h2
class="chakra-heading css-9q1d0h"
>
title
</h2>
<div
class="chakra-stack css-1oen434"
>
<hr
aria-orientation="horizontal"
class="chakra-divider css-1upb9tn"
/>
<a
class="chakra-button css-uxt1e8"
href="/auth/login"
>
orders
</a>
<hr
aria-orientation="horizontal"
class="chakra-divider css-1upb9tn"
/>
<a
class="chakra-button css-uxt1e8"
href="/auth/login"
>
master
</a>
<hr
aria-orientation="horizontal"
class="chakra-divider css-1upb9tn"
/>
</div>
</div>
<div
class="css-sy55x5"
>
<div
class="css-hpgf8j"
>
<h2
class="chakra-heading css-r7q7qr"
>
title
</h2>
<div
class="css-1me9tx"
>
<button
class="chakra-button css-4xx2wk"
type="button"
>
<svg
class="chakra-icon css-onkibi"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
fill="currentColor"
/>
</svg>
</button>
<p
class="chakra-text css-1bntq7d"
>
2/2/2025
</p>
<button
class="chakra-button css-4xx2wk"
type="button"
>
<svg
class="chakra-icon css-onkibi"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"
fill="currentColor"
/>
</svg>
</button>
</div>
<table
class="chakra-table css-0"
>
<thead
class="css-0"
>
<tr
class="css-0"
>
<th
class="css-0"
>
table.header.carNumber
</th>
<th
class="css-0"
>
table.header.orderDate
</th>
<th
class="css-0"
>
table.header.status
</th>
<th
class="css-0"
>
table.header.masters
</th>
<th
class="css-0"
>
table.header.telephone
</th>
<th
class="css-0"
>
table.header.location
</th>
</tr>
</thead>
<tbody
class="css-0"
>
<tr
class="css-0"
>
<td
class="css-12rlgei"
colspan="6"
>
<div
class="chakra-spinner css-1y7joxr"
>
<span
class="css-8b45rq"
>
Loading...
</span>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
`;

View File

@ -0,0 +1,130 @@
import React from 'react';
import {
describe,
it,
expect,
jest,
beforeAll,
afterEach,
afterAll,
} from '@jest/globals';
import { render, screen, waitFor } from '@testing-library/react';
import { http, HttpResponse } from 'msw';
import { setupServer } from 'msw/node';
import { BrowserRouter } from 'react-router-dom';
import Page from '../arm';
const server = setupServer(
http.post('/api/arm/orders', () => {
return HttpResponse.json({
success: true,
body: [
{
id: 'order1',
carNumber: 'A123BC',
startWashTime: '2024-11-24T10:30:00.000Z',
endWashTime: '2024-11-24T16:30:00.000Z',
orderDate: '2024-11-24T08:41:46.366Z',
status: 'pending',
phone: '79001234563',
location: 'Казань, ул. Баумана, 1',
master: {
name: 'Олег Макаров',
phone: '79001234567',
id: '23423442',
},
notes: '',
},
{
id: 'order2',
carNumber: 'A245BC',
startWashTime: '2024-11-24T11:30:00.000Z',
endWashTime: '2024-11-24T17:30:00.000Z',
orderDate: '2024-11-24T07:40:46.366Z',
status: 'progress',
phone: '79001234567',
location: 'Казань, ул. Баумана, 43',
master: [],
notes: '',
},
],
});
}),
http.get('/api/arm/masters', () => {
return HttpResponse.json({
success: true,
body: [
{
id: '4545423234',
name: 'Иван Иванов',
phone: '+7 900 123 45 67',
},
{
name: 'Олег Макаров',
phone: '79001234567',
id: '23423442',
},
{
id: '345354234',
name: 'Иван Галкин',
schedule: [
{
id: 'order1',
startWashTime: '2024-11-24T10:30:00.000Z',
endWashTime: '2024-11-24T16:30:00.000Z',
},
{
id: 'order2',
startWashTime: '2024-11-24T11:30:00.000Z',
endWashTime: '2024-11-24T17:30:00.000Z',
},
],
phone: '+7 900 123 45 67',
},
],
});
}),
);
jest.mock('react-i18next', () => {
return {
useTranslation: () => {
return {
t: (key: never) => `${key}`,
i18n: {},
};
},
};
});
jest.mock('@brojs/cli', () => {
return {
getNavigationValue: () => '/auth/login',
getConfigValue: () => '/api',
};
});
describe('Arm Page', () => {
beforeAll(() => server.listen());
afterEach(() => server.resetHandlers());
afterAll(() => server.close());
it('render ', async () => {
server.events.on('request:start', ({ request }) => {
console.log('Outgoing:', request.method, request.url);
});
const { container } = render(
<BrowserRouter>
<Page mockUser={{ name: 'ilnaz' }} />
</BrowserRouter>,
);
expect(container).toMatchSnapshot();
await waitFor(() => screen.getByText('A123BC'));
expect(container).toMatchSnapshot();
});
});

View File

@ -6,8 +6,12 @@ import LayoutArm from '../../components/LayoutArm';
import authLogin from '../../keycloak';
import { URLs } from '../../__data__/urls';
const Page = () => {
const [user, setUser] = useState(null);
interface PageProps {
mockUser?: { name: string };
}
const Page = ({ mockUser }: PageProps) => {
const [user, setUser] = useState(mockUser || null);
const navigate = useNavigate();