nezumi/react-training
1
0
Fork 0
mirror of https://github.com/Nezumi-2711/react-training.git synced 2026-09-22 13:38:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #35 from Nez27/feat/unit-test-for-function

Browse Source 
Add unit test for all function available
This commit is contained in:
Loi Phan
2023-11-30 23:30:59 +07:00
committed by GitHub
parent 63c2fd8524 5d8c5e6a29
commit 7c6c33d455
50 changed files with 1814 additions and 679 deletions
Download Patch File Download Diff File Expand all files Collapse all files
hotel-management/package.json
+2 -1
View File
@@ -8,7 +8,8 @@
"build": "tsc && vite build",
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"preview": "vite preview",
"test": "jest --coverage"
"test-ci": "jest --coverage",
"test": "jest --runTestsByPath"
},
"coverageReporters": [
"html"
hotel-management/src/App.test.tsx
+69
View File
@@ -0,0 +1,69 @@
import { render, act, RenderResult } from '@testing-library/react';
import * as userServices from '@service/userServices';
import * as roomServices from '@service/roomServices';
import App from './App';
jest.mock('@service/userServices');
jest.mock('@service/roomServices');
describe('App', () => {
let wrapper: RenderResult | null = null;
beforeEach(async () => {
await act(async () => {
wrapper = render(<App />);
});
});
test('should render correctly', () => {
expect(wrapper).toMatchSnapshot();
});
test('Should init room, user data', async () => {
const mockGetUserNotBooked = jest.spyOn(userServices, 'getAllUsers');
const mockGetRoomAvailable = jest.spyOn(roomServices, 'getAllRooms');
mockGetUserNotBooked.mockResolvedValue({
data: [
{
id: 1,
name: 'Nezumi',
phone: '0324432321',
isBooked: true,
isDelete: true,
},
{
id: 1,
name: 'Loi Phan',
phone: '0324432123',
isBooked: true,
isDelete: true,
},
],
count: 2,
});
mockGetRoomAvailable.mockResolvedValue({
data: [
{
id: 1,
name: 'Room 1',
price: 230,
status: true,
isDelete: true,
},
{
id: 2,
name: 'Room 2',
price: 242,
status: true,
isDelete: true
},
],
count: 2
});
expect(mockGetUserNotBooked).toHaveBeenCalled();
expect(mockGetRoomAvailable).toHaveBeenCalled();
});
});
hotel-management/src/__snapshots__/App.test.tsx.snap
+84
View File
@@ -0,0 +1,84 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`App should render correctly 1`] = `
{
"asFragment": [Function],
"baseElement": <body>
<div>
<div
class="sc-jrsKJM iDdaat"
>
<div
class="sc-pNWRh lfNGxm"
/>
</div>
<div
style="position: fixed; z-index: 2000; top: 16px; left: 16px; right: 16px; bottom: 16px; pointer-events: none; margin: 8px;"
/>
</div>
</body>,
"container": <div>
<div
class="sc-jrsKJM iDdaat"
>
<div
class="sc-pNWRh lfNGxm"
/>
</div>
<div
style="position: fixed; z-index: 2000; top: 16px; left: 16px; right: 16px; bottom: 16px; pointer-events: none; margin: 8px;"
/>
</div>,
"debug": [Function],
"findAllByAltText": [Function],
"findAllByDisplayValue": [Function],
"findAllByLabelText": [Function],
"findAllByPlaceholderText": [Function],
"findAllByRole": [Function],
"findAllByTestId": [Function],
"findAllByText": [Function],
"findAllByTitle": [Function],
"findByAltText": [Function],
"findByDisplayValue": [Function],
"findByLabelText": [Function],
"findByPlaceholderText": [Function],
"findByRole": [Function],
"findByTestId": [Function],
"findByText": [Function],
"findByTitle": [Function],
"getAllByAltText": [Function],
"getAllByDisplayValue": [Function],
"getAllByLabelText": [Function],
"getAllByPlaceholderText": [Function],
"getAllByRole": [Function],
"getAllByTestId": [Function],
"getAllByText": [Function],
"getAllByTitle": [Function],
"getByAltText": [Function],
"getByDisplayValue": [Function],
"getByLabelText": [Function],
"getByPlaceholderText": [Function],
"getByRole": [Function],
"getByTestId": [Function],
"getByText": [Function],
"getByTitle": [Function],
"queryAllByAltText": [Function],
"queryAllByDisplayValue": [Function],
"queryAllByLabelText": [Function],
"queryAllByPlaceholderText": [Function],
"queryAllByRole": [Function],
"queryAllByTestId": [Function],
"queryAllByText": [Function],
"queryAllByTitle": [Function],
"queryByAltText": [Function],
"queryByDisplayValue": [Function],
"queryByLabelText": [Function],
"queryByPlaceholderText": [Function],
"queryByRole": [Function],
"queryByTestId": [Function],
"queryByText": [Function],
"queryByTitle": [Function],
"rerender": [Function],
"unmount": [Function],
}
`;
hotel-management/src/components/AppLayout/AppLayout.test.tsx
+8 -3
View File
@@ -3,12 +3,17 @@ import { BrowserRouter } from 'react-router-dom';
// Components
import AppLayout from '.';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
describe('AppLayout', () => {
const queryClient = new QueryClient();
const wrapper = renderer.create(
<BrowserRouter>
<AppLayout />
</BrowserRouter>
<QueryClientProvider client={queryClient}>
<BrowserRouter>
<AppLayout />
</BrowserRouter>
</QueryClientProvider>
);
test('Should render correctly', () => {
hotel-management/src/components/AppLayout/__snapshots__/AppLayout.test.tsx.snap
+8 -9
View File
@@ -9,7 +9,6 @@ exports[`AppLayout Should render correctly 1`] = `
>
<p>
Hi,
Admin
!
</p>
<ul
@@ -24,6 +23,7 @@ exports[`AppLayout Should render correctly 1`] = `
}
}
isHaveChildren={false}
onClick={[Function]}
style={
{
"backgroundColor": undefined,
@@ -60,12 +60,14 @@ exports[`AppLayout Should render correctly 1`] = `
<li>
<button
className="sc-bdnyFh bxHnoO"
disabled={false}
iconStyle={
{
"size": "23px",
}
}
isHaveChildren={false}
onClick={[Function]}
style={
{
"backgroundColor": undefined,
@@ -105,7 +107,8 @@ exports[`AppLayout Should render correctly 1`] = `
className="sc-jSFipO ejTmsl"
>
<h1
className="sc-gKAaef hNxcoF"
className="sc-gKAaef kdwrvt"
onClick={[Function]}
>
Hotel Management
</h1>
@@ -114,7 +117,7 @@ exports[`AppLayout Should render correctly 1`] = `
>
<a
className="sc-eCAqax hQZHUY"
href="/dashboard"
href="/booking"
onClick={[Function]}
>
<svg
@@ -132,15 +135,11 @@ exports[`AppLayout Should render correctly 1`] = `
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M0 0h24v24H0z"
fill="none"
/>
<path
d="M11 21H5c-1.1 0-2-.9-2-2V5c0-1.1.9-2 2-2h6v18zm2 0h6c1.1 0 2-.9 2-2v-7h-8v9zm8-11V5c0-1.1-.9-2-2-2h-6v7h8z"
d="M5 22h14c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2h-2V2h-2v2H9V2H7v2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2zM5 7h14v2H5V7z"
/>
</svg>
<span>
Dashboard
Booking
</span>
</a>
<a
hotel-management/src/components/ConfirmMessage/ConfirmMessage.test.tsx
+21 -8
View File
@@ -1,20 +1,33 @@
import renderer from 'react-test-renderer';
// Components
import ConfirmMessage from '.';
import { RenderResult, fireEvent, render } from '@testing-library/react';
describe('ConfirmMessage testing snapshot', () => {
const message = 'Hello World!';
const handleOnConfirm = jest.fn();
const handleOnCloseModal = jest.fn();
let wrapper: RenderResult | null = null;
const wrapper = renderer.create(
<ConfirmMessage
message={message}
onConfirm={handleOnConfirm}
/>
);
beforeEach(() => {
wrapper = render(
<ConfirmMessage
message={message}
onConfirm={handleOnConfirm}
onCloseModal={handleOnCloseModal}
/>
);
});
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
});
test('handleOnConfirm should be call', () => {
const confirmBtn = wrapper!.getByText('Yes');
fireEvent.click(confirmBtn);
expect(handleOnConfirm).toHaveBeenCalled();
expect(handleOnCloseModal).toHaveBeenCalled();
});
});
hotel-management/src/components/ConfirmMessage/__snapshots__/ConfirmMessage.test.tsx.snap
+102 -24
View File
@@ -1,28 +1,106 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`ConfirmMessage Should render correctly 1`] = `
<div
className="sc-bdnyFh dukbvo"
>
<p>
Hello World!
</p>
<div>
<button
className="sc-gtsqUy eZzwwl"
disabled={true}
onClick={[MockFunction]}
variations="danger"
exports[`ConfirmMessage testing snapshot Should render correctly 1`] = `
{
"asFragment": [Function],
"baseElement": <body>
<div>
<div
class="sc-bdnyFh jIONew"
>
<p>
Hello World!
</p>
<div>
<button
class="sc-gtsqUy hSoKBM"
variations="danger"
>
Yes
</button>
<button
class="sc-gtsqUy hesuRJ"
variations="secondary"
>
No
</button>
</div>
</div>
</div>
</body>,
"container": <div>
<div
class="sc-bdnyFh jIONew"
>
Delete
</button>
<button
className="sc-gtsqUy JDRgw"
disabled={true}
variations="secondary"
>
Cancel
</button>
</div>
</div>
<p>
Hello World!
</p>
<div>
<button
class="sc-gtsqUy hSoKBM"
variations="danger"
>
Yes
</button>
<button
class="sc-gtsqUy hesuRJ"
variations="secondary"
>
No
</button>
</div>
</div>
</div>,
"debug": [Function],
"findAllByAltText": [Function],
"findAllByDisplayValue": [Function],
"findAllByLabelText": [Function],
"findAllByPlaceholderText": [Function],
"findAllByRole": [Function],
"findAllByTestId": [Function],
"findAllByText": [Function],
"findAllByTitle": [Function],
"findByAltText": [Function],
"findByDisplayValue": [Function],
"findByLabelText": [Function],
"findByPlaceholderText": [Function],
"findByRole": [Function],
"findByTestId": [Function],
"findByText": [Function],
"findByTitle": [Function],
"getAllByAltText": [Function],
"getAllByDisplayValue": [Function],
"getAllByLabelText": [Function],
"getAllByPlaceholderText": [Function],
"getAllByRole": [Function],
"getAllByTestId": [Function],
"getAllByText": [Function],
"getAllByTitle": [Function],
"getByAltText": [Function],
"getByDisplayValue": [Function],
"getByLabelText": [Function],
"getByPlaceholderText": [Function],
"getByRole": [Function],
"getByTestId": [Function],
"getByText": [Function],
"getByTitle": [Function],
"queryAllByAltText": [Function],
"queryAllByDisplayValue": [Function],
"queryAllByLabelText": [Function],
"queryAllByPlaceholderText": [Function],
"queryAllByRole": [Function],
"queryAllByTestId": [Function],
"queryAllByText": [Function],
"queryAllByTitle": [Function],
"queryByAltText": [Function],
"queryByDisplayValue": [Function],
"queryByLabelText": [Function],
"queryByPlaceholderText": [Function],
"queryByRole": [Function],
"queryByTestId": [Function],
"queryByText": [Function],
"queryByTitle": [Function],
"rerender": [Function],
"unmount": [Function],
}
`;
hotel-management/src/components/Form/__snapshots__/Form.test.tsx.snap
+14 -12
View File
@@ -2,56 +2,58 @@
exports[`Form Should render correctly 1`] = `
<form
className="sc-bdnyFh bzxSLR"
className="sc-gtsqUy jMGskL"
onSubmit={[MockFunction]}
>
<div
className="sc-dlniIP gZHESL"
className="sc-hKFymg ivIEWo"
direction="horizontal"
>
<label
className="sc-hKFymg ddFGOI"
className="sc-eCAqax dnXnhF"
>
Name
</label>
<div>
<input
className="sc-jSFipO enjwJE"
className="sc-iCoHzw csWeiH"
id="name"
type="text"
/>
<p
className="sc-eCAqax bvOWPP"
className="sc-jSFipO iOcxfq"
>
This is error message
</p>
</div>
</div>
<div
className="sc-dlniIP gZHESL"
className="sc-hKFymg ivIEWo"
direction="horizontal"
>
<label
className="sc-hKFymg ddFGOI"
className="sc-eCAqax dnXnhF"
>
Price
</label>
<div>
<input
className="sc-jSFipO enjwJE"
className="sc-iCoHzw csWeiH"
id="price"
type="text"
/>
<p
className="sc-eCAqax bvOWPP"
className="sc-jSFipO iOcxfq"
>
This is error message
</p>
</div>
</div>
<div
className="sc-gtsqUy idhRSV"
className="sc-dlniIP hBqqvG"
>
<button
className="sc-gKAaef sc-jrsKJM gifCOZ KLoQf"
className="sc-bdnyFh sc-gKAaef bEtbaY fRlVwz"
disabled={true}
name="submit"
type="submit"
@@ -60,7 +62,7 @@ exports[`Form Should render correctly 1`] = `
Confirm
</button>
<button
className="sc-gKAaef sc-jrsKJM gbgZUe KLoQf"
className="sc-bdnyFh sc-gKAaef buXbPz fRlVwz"
onClick={[MockFunction]}
type="button"
variations="secondary"
hotel-management/src/components/Header/Header.test.tsx
+11 -1
View File
@@ -2,9 +2,19 @@ import renderer from 'react-test-renderer';
// Components
import Header from '.';
import { BrowserRouter } from 'react-router-dom';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
describe('Header', () => {
const wrapper = renderer.create(<Header accountName="Nezumi" />);
const queryClient = new QueryClient();
const wrapper = renderer.create(
<QueryClientProvider client={queryClient}>
<BrowserRouter>
<Header accountName="Nezumi" />
</BrowserRouter>
</QueryClientProvider>
);
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
hotel-management/src/components/Header/__snapshots__/Header.test.tsx.snap
+3
View File
@@ -21,6 +21,7 @@ exports[`Header Should render correctly 1`] = `
}
}
isHaveChildren={false}
onClick={[Function]}
style={
{
"backgroundColor": undefined,
@@ -57,12 +58,14 @@ exports[`Header Should render correctly 1`] = `
<li>
<button
className="sc-bdnyFh bxHnoO"
disabled={false}
iconStyle={
{
"size": "23px",
}
}
isHaveChildren={false}
onClick={[Function]}
style={
{
"backgroundColor": undefined,
hotel-management/src/components/HeaderMenu/HeaderMenu.test.tsx
+11 -1
View File
@@ -2,9 +2,19 @@ import renderer from 'react-test-renderer';
// Components
import HeaderMenu from '.';
import { BrowserRouter } from 'react-router-dom';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
describe('HeaderMenu', () => {
const wrapper = renderer.create(<HeaderMenu />);
const queryClient = new QueryClient();
const wrapper = renderer.create(
<QueryClientProvider client={queryClient}>
<BrowserRouter>
<HeaderMenu />
</BrowserRouter>
</QueryClientProvider>
);
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
hotel-management/src/components/HeaderMenu/__snapshots__/HeaderMenu.test.tsx.snap
+3
View File
@@ -13,6 +13,7 @@ exports[`HeaderMenu Should render correctly 1`] = `
}
}
isHaveChildren={false}
onClick={[Function]}
style={
{
"backgroundColor": undefined,
@@ -49,12 +50,14 @@ exports[`HeaderMenu Should render correctly 1`] = `
<li>
<button
className="sc-bdnyFh bxHnoO"
disabled={false}
iconStyle={
{
"size": "23px",
}
}
isHaveChildren={false}
onClick={[Function]}
style={
{
"backgroundColor": undefined,
hotel-management/src/components/Menus/Menus.test.tsx
+47 -18
View File
@@ -1,31 +1,60 @@
import renderer from 'react-test-renderer';
// Components
import Menus from '.';
import { RiEditBoxFill, RiDeleteBin2Line } from 'react-icons/ri';
import { RenderResult, fireEvent, render } from '@testing-library/react';
describe('Menus', () => {
const id = '123';
const handleOnClick = jest.fn();
const wrapper = renderer.create(
<Menus>
<Menus.Menu>
<Menus.Toggle id={id} />
let wrapper: RenderResult | null = null;
<Menus.List id={id.toString()}>
<Menus.Button onClick={handleOnClick} icon={<RiEditBoxFill />}>
Edit
</Menus.Button>
<Menus.Button onClick={handleOnClick} icon={<RiDeleteBin2Line />}>
Delete
</Menus.Button>
</Menus.List>
</Menus.Menu>
</Menus>
);
beforeEach(() => {
wrapper = render(
<Menus>
<Menus.Menu>
<Menus.Toggle id={id} />
test('Should render correctly', () => {
<Menus.List id={id.toString()}>
<Menus.Button onClick={handleOnClick} icon={<RiEditBoxFill />}>
Edit
</Menus.Button>
<Menus.Button onClick={handleOnClick} icon={<RiDeleteBin2Line />}>
Delete
</Menus.Button>
</Menus.List>
</Menus.Menu>
</Menus>
);
});
test('Should render correctly', async () => {
expect(wrapper).toMatchSnapshot();
});
test('Should show context menu', async () => {
const btn = await wrapper!.findByRole('button');
fireEvent.click(btn);
const editBtn = wrapper!.getByText('Edit');
expect(editBtn).toBeInTheDocument();
fireEvent.click(btn);
expect(editBtn).not.toBeInTheDocument();
});
test('HandleOnClick should work', async () => {
const btn = await wrapper!.findByRole('button');
fireEvent.click(btn);
const editBtn = wrapper!.getByText('Edit');
fireEvent.click(editBtn);
expect(handleOnClick).toHaveBeenCalled();
});
});
hotel-management/src/components/Menus/__snapshots__/Menus.test.tsx.snap
+109 -30
View File
@@ -1,35 +1,114 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Menus Should render correctly 1`] = `
<div
className="sc-gtsqUy lbsvcs"
>
<button
aria-label="Menu item 123"
className="sc-hKFymg cjUckY"
onClick={[Function]}
>
<svg
aria-hidden="true"
fill="currentColor"
height="1em"
stroke="currentColor"
strokeWidth="0"
style={
{
"color": undefined,
}
}
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
{
"asFragment": [Function],
"baseElement": <body>
<div>
<div
class="sc-gtsqUy lbsvcs"
>
<button
aria-label="Menu item 123"
class="sc-hKFymg cjUckY"
>
<svg
aria-hidden="true"
fill="currentColor"
height="1em"
stroke="currentColor"
stroke-width="0"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
clip-rule="evenodd"
d="M10.5 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zm0 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zm0 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0z"
fill-rule="evenodd"
/>
</svg>
</button>
</div>
</div>
</body>,
"container": <div>
<div
class="sc-gtsqUy lbsvcs"
>
<path
clipRule="evenodd"
d="M10.5 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zm0 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zm0 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0z"
fillRule="evenodd"
/>
</svg>
</button>
</div>
<button
aria-label="Menu item 123"
class="sc-hKFymg cjUckY"
>
<svg
aria-hidden="true"
fill="currentColor"
height="1em"
stroke="currentColor"
stroke-width="0"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
clip-rule="evenodd"
d="M10.5 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zm0 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zm0 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0z"
fill-rule="evenodd"
/>
</svg>
</button>
</div>
</div>,
"debug": [Function],
"findAllByAltText": [Function],
"findAllByDisplayValue": [Function],
"findAllByLabelText": [Function],
"findAllByPlaceholderText": [Function],
"findAllByRole": [Function],
"findAllByTestId": [Function],
"findAllByText": [Function],
"findAllByTitle": [Function],
"findByAltText": [Function],
"findByDisplayValue": [Function],
"findByLabelText": [Function],
"findByPlaceholderText": [Function],
"findByRole": [Function],
"findByTestId": [Function],
"findByText": [Function],
"findByTitle": [Function],
"getAllByAltText": [Function],
"getAllByDisplayValue": [Function],
"getAllByLabelText": [Function],
"getAllByPlaceholderText": [Function],
"getAllByRole": [Function],
"getAllByTestId": [Function],
"getAllByText": [Function],
"getAllByTitle": [Function],
"getByAltText": [Function],
"getByDisplayValue": [Function],
"getByLabelText": [Function],
"getByPlaceholderText": [Function],
"getByRole": [Function],
"getByTestId": [Function],
"getByText": [Function],
"getByTitle": [Function],
"queryAllByAltText": [Function],
"queryAllByDisplayValue": [Function],
"queryAllByLabelText": [Function],
"queryAllByPlaceholderText": [Function],
"queryAllByRole": [Function],
"queryAllByTestId": [Function],
"queryAllByText": [Function],
"queryAllByTitle": [Function],
"queryByAltText": [Function],
"queryByDisplayValue": [Function],
"queryByLabelText": [Function],
"queryByPlaceholderText": [Function],
"queryByRole": [Function],
"queryByTestId": [Function],
"queryByText": [Function],
"queryByTitle": [Function],
"rerender": [Function],
"unmount": [Function],
}
`;
hotel-management/src/components/Modal/__snapshots__/Modal.test.tsx.snap
+1 -1
View File
@@ -2,7 +2,7 @@
exports[`Modal Should render correctly 1`] = `
<button
className="sc-eCAqax jeAcqZ"
className="sc-eCAqax iNUTro"
onClick={[Function]}
variations="primary"
>
hotel-management/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+3 -7
View File
@@ -6,7 +6,7 @@ exports[`Nav Should render correctly 1`] = `
>
<a
className="sc-gtsqUy gbSQWi"
href="/dashboard"
href="/booking"
onClick={[Function]}
>
<svg
@@ -24,15 +24,11 @@ exports[`Nav Should render correctly 1`] = `
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M0 0h24v24H0z"
fill="none"
/>
<path
d="M11 21H5c-1.1 0-2-.9-2-2V5c0-1.1.9-2 2-2h6v18zm2 0h6c1.1 0 2-.9 2-2v-7h-8v9zm8-11V5c0-1.1-.9-2-2-2h-6v7h8z"
d="M5 22h14c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2h-2V2h-2v2H9V2H7v2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2zM5 7h14v2H5V7z"
/>
</svg>
<span>
Dashboard
Booking
</span>
</a>
<a
hotel-management/src/components/OrderBy/Order.test.tsx
-28
View File
@@ -1,28 +0,0 @@
import renderer from 'react-test-renderer';
import { BrowserRouter } from 'react-router-dom';
// Components
import Order from '.';
describe('Order', () => {
const options = [
{
value: 'Value 1',
label: 'Option 1',
},
{
value: 'Value 2',
label: 'Option 2',
},
];
const wrapper = renderer.create(
<BrowserRouter>
<Order options={options} />
</BrowserRouter>
);
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
});
});
hotel-management/src/components/OrderBy/OrderBy.test.tsx
+56
View File
@@ -0,0 +1,56 @@
import { useState } from 'react';
import { RenderResult, fireEvent, render } from '@testing-library/react';
import { MemoryRouter } from 'react-router-dom';
// Components
import OrderBy from '.';
let mockSearchParam = '';
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
useSearchParams: () => {
const [params, setParams] = useState(new URLSearchParams(mockSearchParam));
return [
params,
(newParams: string) => {
mockSearchParam = newParams;
setParams(new URLSearchParams(newParams));
},
];
},
}));
describe('Order', () => {
const options = [
{
value: 'value1',
label: 'Option 1',
},
{
value: 'value2',
label: 'Option 2',
},
];
let wrapper: RenderResult | null = null;
beforeEach(() => {
wrapper = render(
<MemoryRouter>
<OrderBy options={options} />
</MemoryRouter>
);
});
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
});
test('handleClick should work correctly', async () => {
const nameButton = wrapper!.getByText('Option 2');
fireEvent.click(nameButton);
expect(mockSearchParam.toString()).toEqual('orderBy=value2');
});
});
hotel-management/src/components/OrderBy/__snapshots__/Order.test.tsx.snap
-24
View File
@@ -1,24 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Order Should render correctly 1`] = `
<div
className="sc-bdnyFh aZFGz"
>
<button
active={true}
className="sc-gtsqUy fohQqJ"
disabled={true}
onClick={[Function]}
>
Option 1
</button>
<button
active={false}
className="sc-gtsqUy bwnpRq"
disabled={false}
onClick={[Function]}
>
Option 2
</button>
</div>
`;
hotel-management/src/components/OrderBy/__snapshots__/OrderBy.test.tsx.snap
+94
View File
@@ -0,0 +1,94 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Order Should render correctly 1`] = `
{
"asFragment": [Function],
"baseElement": <body>
<div>
<div
class="sc-bdnyFh aZFGz"
>
<button
class="sc-gtsqUy bOTmZQ"
disabled=""
>
Option 1
</button>
<button
class="sc-gtsqUy bwnpRq"
>
Option 2
</button>
</div>
</div>
</body>,
"container": <div>
<div
class="sc-bdnyFh aZFGz"
>
<button
class="sc-gtsqUy bOTmZQ"
disabled=""
>
Option 1
</button>
<button
class="sc-gtsqUy bwnpRq"
>
Option 2
</button>
</div>
</div>,
"debug": [Function],
"findAllByAltText": [Function],
"findAllByDisplayValue": [Function],
"findAllByLabelText": [Function],
"findAllByPlaceholderText": [Function],
"findAllByRole": [Function],
"findAllByTestId": [Function],
"findAllByText": [Function],
"findAllByTitle": [Function],
"findByAltText": [Function],
"findByDisplayValue": [Function],
"findByLabelText": [Function],
"findByPlaceholderText": [Function],
"findByRole": [Function],
"findByTestId": [Function],
"findByText": [Function],
"findByTitle": [Function],
"getAllByAltText": [Function],
"getAllByDisplayValue": [Function],
"getAllByLabelText": [Function],
"getAllByPlaceholderText": [Function],
"getAllByRole": [Function],
"getAllByTestId": [Function],
"getAllByText": [Function],
"getAllByTitle": [Function],
"getByAltText": [Function],
"getByDisplayValue": [Function],
"getByLabelText": [Function],
"getByPlaceholderText": [Function],
"getByRole": [Function],
"getByTestId": [Function],
"getByText": [Function],
"getByTitle": [Function],
"queryAllByAltText": [Function],
"queryAllByDisplayValue": [Function],
"queryAllByLabelText": [Function],
"queryAllByPlaceholderText": [Function],
"queryAllByRole": [Function],
"queryAllByTestId": [Function],
"queryAllByText": [Function],
"queryAllByTitle": [Function],
"queryByAltText": [Function],
"queryByDisplayValue": [Function],
"queryByLabelText": [Function],
"queryByPlaceholderText": [Function],
"queryByRole": [Function],
"queryByTestId": [Function],
"queryByText": [Function],
"queryByTitle": [Function],
"rerender": [Function],
"unmount": [Function],
}
`;
hotel-management/src/components/Search/Search.test.tsx
+58 -9
View File
@@ -1,18 +1,67 @@
import renderer from 'react-test-renderer';
import { BrowserRouter } from 'react-router-dom';
import { useState } from 'react';
// Components
import Search from '.';
import {
RenderResult,
fireEvent,
render,
act,
} from '@testing-library/react';
let mockSearchParam = '';
jest.useFakeTimers();
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
useSearchParams: () => {
const [params, setParams] = useState(new URLSearchParams(mockSearchParam));
return [
params,
(newParams: string) => {
mockSearchParam = newParams;
setParams(new URLSearchParams(newParams));
},
];
},
}));
describe('Search', () => {
const placeHolder = 'Search placeholder...';
const wrapper = renderer.create(
<BrowserRouter>
<Search setPlaceHolder={placeHolder} />
</BrowserRouter>
);
// const placeHolder = 'Search placeholder...';
// let wrapper: RenderResult | null = null;
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
// beforeEach(() => {
// wrapper = render(
// <BrowserRouter>
// <Search setPlaceHolder={placeHolder} />
// </BrowserRouter>
// );
// });
// test('Should render correctly', () => {
// expect(wrapper).toMatchSnapshot();
// });
test('Should add query to url after 1 second', async () => {
let wrapper: RenderResult | null = null;
act(() => {
wrapper = render(
<BrowserRouter>
<Search setPlaceHolder={'Search placeholder...'} />
</BrowserRouter>
);
});
const searchField = await wrapper!.findByPlaceholderText(
'Search placeholder...'
);
act(() => {
fireEvent.change(searchField, { target: { value: 'abc' } });
});
// jest.advanceTimersByTime(1000);
});
});
hotel-management/src/components/Search/__snapshots__/Search.test.tsx.snap
-9
View File
@@ -1,9 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Search Should render correctly 1`] = `
<input
className="sc-bdnyFh eAgOPb"
onChange={[Function]}
placeholder="Search placeholder..."
/>
`;
hotel-management/src/components/Select/__snapshots__/Select.test.tsx.snap
+4 -1
View File
@@ -3,16 +3,19 @@
exports[`Select Should render correctly 1`] = `
<select
aria-label="Sort"
className="sc-bdnyFh dqXTRP"
className="sc-bdnyFh hPOEsG"
disabled={false}
onChange={[MockFunction]}
value="Temp value"
>
<option
data-testid="select-option"
value="Value 1"
>
Option 1
</option>
<option
data-testid="select-option"
value="Value 2"
>
Option 2
hotel-management/src/components/Select/index.tsx
+1 -1
View File
@@ -46,7 +46,7 @@ const Select = ({
: { onChange: onChange })}
>
{options.map((option) => (
<option value={option.value} key={option.value}>
<option value={option.value} key={option.value} data-testid='select-option'>
{option.label}
</option>
))}
hotel-management/src/components/Sidebar/__snapshots__/Sidebar.test.tsx.snap
+5 -8
View File
@@ -5,7 +5,8 @@ exports[`Sidebar Should render correctly 1`] = `
className="sc-dlniIP dfcuiS"
>
<h1
className="sc-hKFymg iQEJzQ"
className="sc-hKFymg OpLao"
onClick={[Function]}
>
Hotel Management
</h1>
@@ -14,7 +15,7 @@ exports[`Sidebar Should render correctly 1`] = `
>
<a
className="sc-gtsqUy gbSQWi"
href="/dashboard"
href="/booking"
onClick={[Function]}
>
<svg
@@ -32,15 +33,11 @@ exports[`Sidebar Should render correctly 1`] = `
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M0 0h24v24H0z"
fill="none"
/>
<path
d="M11 21H5c-1.1 0-2-.9-2-2V5c0-1.1.9-2 2-2h6v18zm2 0h6c1.1 0 2-.9 2-2v-7h-8v9zm8-11V5c0-1.1-.9-2-2-2h-6v7h8z"
d="M5 22h14c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2h-2V2h-2v2H9V2H7v2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2zM5 7h14v2H5V7z"
/>
</svg>
<span>
Dashboard
Booking
</span>
</a>
<a
hotel-management/src/components/SortBy/SortBy.test.tsx
+36 -9
View File
@@ -1,27 +1,54 @@
import renderer from 'react-test-renderer';
import { BrowserRouter } from 'react-router-dom';
import { useState } from 'react';
import { render, fireEvent, RenderResult } from '@testing-library/react';
// Components
import SortBy from '.';
let mockSearchParam = '';
jest.mock('react-router-dom', () => ({
...jest.requireActual('react-router-dom'),
useSearchParams: () => {
const [params, setParams] = useState(new URLSearchParams(mockSearchParam));
return [
params,
(newParams: string) => {
mockSearchParam = newParams;
setParams(new URLSearchParams(newParams));
},
];
},
}));
describe('SortBy', () => {
const options = [
{
label: 'Option 1',
value: 'Value 1',
value: 'Value1',
},
{
label: 'Option 2',
value: 'Value 2',
value: 'Value2',
},
];
const wrapper = renderer.create(
<BrowserRouter>
<SortBy options={options} />
</BrowserRouter>
);
let wrapper: RenderResult | null = null;
beforeEach(() => {
wrapper = render(
<BrowserRouter>
<SortBy options={options} />
</BrowserRouter>
);
});
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
});
test('handleClick should work correctly', () => {
const select = wrapper!.getByLabelText('Sort') as HTMLSelectElement;
fireEvent.change(select, { target: { value: 'Value2' } });
expect(mockSearchParam.toString()).toEqual('sortBy=Value2');
});
});
hotel-management/src/components/SortBy/__snapshots__/SortBy.test.tsx.snap
+94 -17
View File
@@ -1,21 +1,98 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`SortBy Should render correctly 1`] = `
<select
aria-label="Sort"
className="sc-bdnyFh dqXTRP"
onChange={[Function]}
value=""
>
<option
value="Value 1"
>
Option 1
</option>
<option
value="Value 2"
>
Option 2
</option>
</select>
{
"asFragment": [Function],
"baseElement": <body>
<div>
<select
aria-label="Sort"
class="sc-bdnyFh hPOEsG"
>
<option
data-testid="select-option"
value="Value1"
>
Option 1
</option>
<option
data-testid="select-option"
value="Value2"
>
Option 2
</option>
</select>
</div>
</body>,
"container": <div>
<select
aria-label="Sort"
class="sc-bdnyFh hPOEsG"
>
<option
data-testid="select-option"
value="Value1"
>
Option 1
</option>
<option
data-testid="select-option"
value="Value2"
>
Option 2
</option>
</select>
</div>,
"debug": [Function],
"findAllByAltText": [Function],
"findAllByDisplayValue": [Function],
"findAllByLabelText": [Function],
"findAllByPlaceholderText": [Function],
"findAllByRole": [Function],
"findAllByTestId": [Function],
"findAllByText": [Function],
"findAllByTitle": [Function],
"findByAltText": [Function],
"findByDisplayValue": [Function],
"findByLabelText": [Function],
"findByPlaceholderText": [Function],
"findByRole": [Function],
"findByTestId": [Function],
"findByText": [Function],
"findByTitle": [Function],
"getAllByAltText": [Function],
"getAllByDisplayValue": [Function],
"getAllByLabelText": [Function],
"getAllByPlaceholderText": [Function],
"getAllByRole": [Function],
"getAllByTestId": [Function],
"getAllByText": [Function],
"getAllByTitle": [Function],
"getByAltText": [Function],
"getByDisplayValue": [Function],
"getByLabelText": [Function],
"getByPlaceholderText": [Function],
"getByRole": [Function],
"getByTestId": [Function],
"getByText": [Function],
"getByTitle": [Function],
"queryAllByAltText": [Function],
"queryAllByDisplayValue": [Function],
"queryAllByLabelText": [Function],
"queryAllByPlaceholderText": [Function],
"queryAllByRole": [Function],
"queryAllByTestId": [Function],
"queryAllByText": [Function],
"queryAllByTitle": [Function],
"queryByAltText": [Function],
"queryByDisplayValue": [Function],
"queryByLabelText": [Function],
"queryByPlaceholderText": [Function],
"queryByRole": [Function],
"queryByTestId": [Function],
"queryByText": [Function],
"queryByTitle": [Function],
"rerender": [Function],
"unmount": [Function],
}
`;
hotel-management/src/constants/commons.ts
+1 -1
View File
@@ -53,7 +53,7 @@ const FORM = {
};
const REGEX = {
PHONE: /(84|0[3|5|7|8|9])+([0-9]{8})\b/g,
PHONE: /(0[3|5|7|8|9])+([0-9]{8})\b/g,
NAME: /^[a-zA-Z]{2,}(?: [a-zA-Z]+){0,2}$/gm,
NUMBER: /^[0-9]*$/,
PASSWORD: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[#$@!%&*?])[A-Za-z\d#$@!%&*?]{8,16}$/
hotel-management/src/contexts/__tests__/userRoomAvailableContext.test.tsx
+129
View File
@@ -0,0 +1,129 @@
import { reducer } from '@context/UserRoomAvailableContext';
import { IDataState } from '@type/common';
jest.mock('@service/userServices');
jest.mock('@service/roomServices');
describe('userRoomAvailableContext', () => {
let initialState: {
roomsAvailable: IDataState[];
usersAvailable: IDataState[];
};
const sampleRooms = [
{
id: 2,
name: 'Room 2',
},
{
id: 3,
name: 'Room 3',
},
];
const sampleUsers = [
{
id: 2,
name: 'Loi Phan',
},
{
id: 3,
name: 'Van A',
},
];
beforeEach(() => {
initialState = {
roomsAvailable: [
{
id: 1,
name: 'Room 1',
},
],
usersAvailable: [
{
id: 1,
name: 'Nezumi',
},
],
};
});
test('Should init user correctly', async () => {
const state = reducer(initialState, {
type: 'initUser',
payload: sampleUsers,
});
expect(state.usersAvailable.length).toEqual(2);
});
test('Should add user correctly', async () => {
const state = reducer(initialState, {
type: 'addUser',
payload: [{ id: 2, name: 'Test Name' }],
});
expect(state.usersAvailable.length).toEqual(2);
});
test('Should remove user correctly', async () => {
const state = reducer(initialState, {
type: 'removeUser',
payload: [{ id: 1 }],
});
expect(state.usersAvailable.length).toEqual(0);
});
test('Should update user correctly', async () => {
const state = reducer(initialState, {
type: 'updateUserName',
payload: [{ id: 1, name: 'Update name' }],
});
expect(state.usersAvailable[0]).toEqual({
id: 1,
name: 'Update name'
});
});
test('Should init room correctly', async () => {
const state = reducer(initialState, {
type: 'initRoom',
payload: sampleRooms,
});
expect(state.roomsAvailable.length).toEqual(2);
});
test('Should add room correctly', async () => {
const state = reducer(initialState, {
type: 'addRoom',
payload: [{ id: 2, name: 'Test Room' }],
});
expect(state.roomsAvailable.length).toEqual(2);
});
test('Should remove room correctly', async () => {
const state = reducer(initialState, {
type: 'removeRoom',
payload: [{ id: 1 }],
});
expect(state.roomsAvailable.length).toEqual(0);
});
test('Should update room correctly', async () => {
const state = reducer(initialState, {
type: 'updateRoomName',
payload: [{ id: 1, name: 'Update name' }],
});
expect(state.roomsAvailable[0]).toEqual({
id: 1,
name: 'Update name'
});
});
});
hotel-management/src/helpers/__tests__/helpers.test.ts
+10
View File
@@ -0,0 +1,10 @@
// Helpers
import { formatCurrency } from '@helper/helper';
describe('formatCurrency', () => {
test('Should format correctly', () => {
const result = formatCurrency(5000);
expect(result).toEqual('$5,000.00');
});
});
hotel-management/src/helpers/__tests__/validators.test.ts
+90
View File
@@ -0,0 +1,90 @@
// Constants
import { REGEX } from '@constant/commons';
// Helpers
import {
isValidDiscount,
isValidRegex,
isValidString,
} from '@helper/validators';
describe('isValidPhone', () => {
const isValidPhone = (phone: string) =>
isValidRegex(new RegExp(REGEX.PHONE), phone);
test('Should is valid phone', () => {
const case_1 = isValidPhone('0321123212');
const case_2 = isValidPhone('0533245422');
const case_3 = isValidPhone('0723342321');
const case_4 = isValidPhone('0823654321');
const case_5 = isValidPhone('0943212343');
expect(case_1).toBeTruthy();
expect(case_2).toBeTruthy();
expect(case_3).toBeTruthy();
expect(case_4).toBeTruthy();
expect(case_5).toBeTruthy();
});
test('Should is not valid phone', () => {
const case_1 = isValidPhone('0327212321Abc');
const case_2 = isValidPhone('0021432123');
const case_3 = isValidPhone('@325542321');
const case_4 = isValidPhone('A321443232');
const case_5 = isValidPhone('ValidPhone');
const case_6 = isValidPhone('000');
expect(case_1).toBeFalsy();
expect(case_2).toBeFalsy();
expect(case_3).toBeFalsy();
expect(case_4).toBeFalsy();
expect(case_5).toBeFalsy();
expect(case_6).toBeFalsy();
});
});
describe('isValidDiscount', () => {
test('Should is valid discount', () => {
const case_1 = isValidDiscount(99.99);
const case_2 = isValidDiscount(50);
const case_3 = isValidDiscount(0);
const case_4 = isValidDiscount(100);
expect(case_1).toBeTruthy();
expect(case_2).toBeTruthy();
expect(case_3).toBeTruthy();
expect(case_4).toBeTruthy();
});
test('Should is not valid discount', () => {
const case_1 = isValidDiscount(-1);
const case_2 = isValidDiscount(-0.99);
const case_3 = isValidDiscount(101);
expect(case_1).toBeFalsy();
expect(case_2).toBeFalsy();
expect(case_3).toBeFalsy();
});
});
describe('Should is valid string', () => {
test('Is valid string', () => {
const case_1 = isValidString('Phan Huu Loi');
const case_2 = isValidString('Nezumi');
expect(case_1).toBeTruthy();
expect(case_2).toBeTruthy();
});
test('Should is not valid string', () => {
const case_1 = isValidString('Le');
const case_2 = isValidString('1tét');
const case_3 = isValidString('@!');
const case_4 = isValidString(' ');
expect(case_1).toBeFalsy();
expect(case_2).toBeFalsy();
expect(case_3).toBeFalsy();
expect(case_4).toBeFalsy();
});
});
hotel-management/src/hooks/__tests__/rooms.test.tsx
+132
View File
@@ -0,0 +1,132 @@
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { act, renderHook, waitFor } from '@testing-library/react';
import { MemoryRouter } from 'react-router-dom';
import { ReactNode } from 'react';
// Hooks
import { useRooms } from '@hook/rooms/useRooms';
import { useCreateRoom } from '@hook/rooms/useCreateRoom';
import { useUpdateRoom } from '@hook/rooms/useUpdateRoom';
import { useSetIsDeleteRoom } from '@hook/rooms/useSetIsDeleteRoom';
// Types
import { IRoom } from '@type/room';
const mockUseRooms = jest.fn(useRooms);
const mockUseCreateRoom = jest.fn(useCreateRoom);
const mockUseUpdateRoom = jest.fn(useUpdateRoom);
const mockUseDeleteRoom = jest.fn(useSetIsDeleteRoom);
interface IWrapper {
children: ReactNode;
}
const sampleData: IRoom = {
id: 999,
name: 'Room name test',
price: 9999,
status: true,
isDelete: true,
};
const queryClient = new QueryClient({
defaultOptions: {
queries: {
retry: false,
},
},
});
const wrapper = ({ children }: IWrapper) => {
return (
<QueryClientProvider client={queryClient}>
<MemoryRouter>{children}</MemoryRouter>
</QueryClientProvider>
);
};
describe('Room hooks', () => {
test('Should fetch data correctly', async () => {
mockUseRooms.mockImplementation(() => ({
rooms: [
{
id: 1,
name: 'Nezumi',
price: 2500,
status: true,
isDelete: true,
},
{
id: 2,
name: 'Loi Phan',
price: 8500,
status: false,
isDelete: true,
},
],
isLoading: false,
count: 2
}));
const { result } = renderHook(() => mockUseRooms(), { wrapper });
await waitFor(() =>
expect(result.current.rooms?.length).toBeGreaterThan(0)
);
});
test('Should create room correctly', async () => {
mockUseCreateRoom.mockImplementation(() => ({
createRoom: () => {
sampleData;
},
isCreating: false,
isSuccess: true,
}));
const { result } = renderHook(() => mockUseCreateRoom(), { wrapper });
act(() => {
result.current.createRoom(sampleData);
});
await waitFor(() => result.current.isSuccess);
expect(result.current.isSuccess).toBeTruthy();
});
test('Should edit room correctly', async () => {
mockUseUpdateRoom.mockImplementation(() => ({
updateRoom: () => {
sampleData;
},
isUpdating: false,
isSuccess: true,
}));
const { result } = renderHook(() => mockUseUpdateRoom(), { wrapper });
act(() => {
const testMethod = async () => {
result.current.updateRoom(sampleData);
await waitFor(() => expect(result.current.isSuccess).toBeTruthy());
};
testMethod();
});
});
test('Should delete room correctly', async () => {
mockUseDeleteRoom.mockImplementation(() => ({
setIsDeleteRoom: () => {
sampleData
},
isDeleting: false,
isSuccess: true,
}));
const { result } = renderHook(() => mockUseDeleteRoom(), { wrapper });
act(() => {
const testMethod = async () => {
result.current.setIsDeleteRoom(sampleData.id);
await waitFor(() => expect(result.current.isSuccess).toBeTruthy());
};
testMethod();
});
});
});
hotel-management/src/hooks/__tests__/useDebounce.test.tsx
+47
View File
@@ -0,0 +1,47 @@
import { fireEvent, render } from '@testing-library/react';
import { useState } from 'react';
import { act } from 'react-test-renderer';
// Hooks
import { useDebounce } from '@hook/useDebounce';
jest.useFakeTimers();
const TestComponent = ({ initialValue = 0 }: { initialValue?: number }) => {
const [value, setValue] = useState(initialValue);
const debouncedValue = useDebounce<number>(value, 1000);
return (
<div>
<button onClick={() => setValue(value + 1)}>Increment</button>
<span data-testid={'debouncedValue'}>{debouncedValue}</span>
<span data-testid={'value'}>{value}</span>
</div>
);
};
describe('useDebouncedValue', function () {
test('Debounce value should not change before 1 second', () => {
const { getByTestId, getByText } = render(<TestComponent />);
const incrementButton = getByText('Increment');
const debouncedValue = getByTestId('debouncedValue');
const value = getByTestId('value');
const clickAndWaitTime = (passedTime: number) => {
act(() => {
fireEvent.click(incrementButton);
jest.advanceTimersByTime(passedTime);
});
};
clickAndWaitTime(100);
expect(debouncedValue.textContent).toBe('0');
expect(value.textContent).toBe('1');
clickAndWaitTime(1000);
expect(debouncedValue.textContent).toBe('1');
expect(value.textContent).toBe('2');
});
});
hotel-management/src/hooks/__tests__/useOutsideClick.test.tsx
+33
View File
@@ -0,0 +1,33 @@
import { fireEvent, render, renderHook, screen } from '@testing-library/react';
// Hooks
import { useOutsideClick } from '@hook/useOutsideClick';
describe('useOutsideClick', () => {
test('Call handler when click outside element', () => {
// Arrange
const handler = jest.fn();
const ref = renderHook(() => useOutsideClick<HTMLDivElement>(handler))
.result.current;
render(<div ref={ref}></div>);
fireEvent.click(document);
// Assert
expect(handler).toHaveBeenCalledTimes(1);
});
test('Not call handler when click outside element', () => {
// Arrange
const handler = jest.fn();
const ref = renderHook(() => useOutsideClick<HTMLDivElement>(handler))
.result.current;
render(<div ref={ref} data-testid="test-element"></div>);
// Act
fireEvent.click(screen.getByTestId('test-element'));
// Assert
expect(handler).not.toHaveBeenCalled();
});
});
hotel-management/src/hooks/__tests__/users.test.tsx
+111
View File
@@ -0,0 +1,111 @@
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { renderHook, waitFor } from '@testing-library/react';
import { ReactNode } from 'react';
import { MemoryRouter } from 'react-router-dom';
import { act } from 'react-test-renderer';
// Hooks
import { useCreateUser } from '@hook/users/useCreateUser';
import { useUpdateUser } from '@hook/users/useUpdateUser';
import { useUsers } from '@hook/users/useUsers';
// Types
import { IUser } from '@type/user';
const mockUseUsers = jest.fn(useUsers);
const mockUseCreateUser = jest.fn(useCreateUser);
const mockUseUpdateUser = jest.fn(useUpdateUser);
interface IWrapper {
children: ReactNode;
}
const sampleData: IUser = {
id: 999,
name: 'User name test',
phone: '123456789',
isBooked: true,
isDelete: true,
};
const queryClient = new QueryClient({
defaultOptions: {
queries: {
retry: false,
},
},
});
const wrapper = ({ children }: IWrapper) => {
return (
<QueryClientProvider client={queryClient}>
<MemoryRouter>{children}</MemoryRouter>
</QueryClientProvider>
);
};
describe('Users hook', () => {
test('Should fetch user data correctly', async () => {
mockUseUsers.mockImplementation(() => ({
users: [
{
id: 1,
name: 'Nezumi',
phone: '0123456678',
isBooked: true,
isDelete: true,
},
{
id: 2,
name: 'Loi Phan',
phone: '0123456678',
isBooked: false,
isDelete: true,
},
],
isLoading: false,
count: 2,
}));
const { result } = renderHook(() => mockUseUsers(), { wrapper });
await waitFor(() => expect(result.current.users?.length).toEqual(2));
});
test('Should create user correctly', async () => {
mockUseCreateUser.mockImplementation(() => ({
createUser: () => {
sampleData;
},
isCreating: false,
isSuccess: true,
}));
const { result } = renderHook(() => mockUseCreateUser(), { wrapper });
act(() => {
const testMethod = async () => {
result.current.createUser(sampleData);
await waitFor(() => expect(result.current.isSuccess).toBeTruthy());
};
testMethod();
});
});
test('Should update user correctly', async () => {
mockUseUpdateUser.mockImplementation(() => ({
updateUser: () => {
sampleData;
},
isUpdating: false,
isSuccess: true,
}));
const { result } = renderHook(() => mockUseUpdateUser(), { wrapper });
act(() => {
const testMethod = async () => {
result.current.updateUser(sampleData);
await waitFor(() => expect(result.current.isSuccess).toBeTruthy());
};
testMethod();
});
});
});
hotel-management/src/pages/Room/__tests__/RoomForm.test.tsx
-22
View File
@@ -1,22 +0,0 @@
import { BrowserRouter } from 'react-router-dom';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import renderer from 'react-test-renderer';
// Components
import RoomForm from '../RoomForm';
describe('RoomForm', () => {
const queryClient = new QueryClient();
const wrapper = renderer.create(
<QueryClientProvider client={queryClient}>
<BrowserRouter>
<RoomForm />
</BrowserRouter>
</QueryClientProvider>
);
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
});
});
hotel-management/src/pages/Room/__tests__/RoomRow.test.tsx
-29
View File
@@ -1,29 +0,0 @@
import renderer from 'react-test-renderer';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
// Types
import { IRoom } from '@type/room';
// Components
import RoomRow from '../RoomRow';
describe('RoomRow', () => {
const tempRoom: IRoom = {
id: 1,
name: 'Temp Room',
price: 250,
status: true,
isDelete: true,
};
const queryClient = new QueryClient();
const wrapper = renderer.create(
<QueryClientProvider client={queryClient}>
<RoomRow room={tempRoom} key={tempRoom.id} />
</QueryClientProvider>
);
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
});
});
hotel-management/src/pages/Room/__tests__/RoomTable.test.tsx
-22
View File
@@ -1,22 +0,0 @@
import renderer from 'react-test-renderer';
import { BrowserRouter } from 'react-router-dom';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
// Components
import RoomTable from '../RoomTable';
describe('RoomTable', () => {
const queryClient = new QueryClient();
const wrapper = renderer.create(
<BrowserRouter>
<QueryClientProvider client={queryClient}>
<RoomTable />
</QueryClientProvider>
</BrowserRouter>
);
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
});
});
hotel-management/src/pages/Room/__tests__/__snapshots__/RoomForm.test.tsx.snap
-67
View File
@@ -1,67 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`RoomForm Should render correctly 1`] = `
<form
className="sc-dlniIP bCPNqw"
onSubmit={[Function]}
>
<div
className="sc-eCAqax eozPUK"
>
<label
className="sc-jSFipO cMYxin"
>
Name
</label>
<div>
<input
className="sc-gtsqUy fGZPSU"
id="name"
name="name"
onBlur={[Function]}
onChange={[Function]}
type="text"
/>
</div>
</div>
<div
className="sc-eCAqax eozPUK"
>
<label
className="sc-jSFipO cMYxin"
>
Price
</label>
<div>
<input
className="sc-gtsqUy fGZPSU"
id="price"
name="price"
onBlur={[Function]}
onChange={[Function]}
type="text"
/>
</div>
</div>
<div
className="sc-hKFymg dteuGK"
>
<button
className="sc-bdnyFh sc-iCoHzw hHmoPp jAHgeA"
disabled={false}
name="submit"
type="submit"
variations="primary"
>
Add
</button>
<button
className="sc-bdnyFh sc-iCoHzw bjdOKm jAHgeA"
type="button"
variations="secondary"
>
Close
</button>
</div>
</form>
`;
hotel-management/src/pages/Room/__tests__/__snapshots__/RoomRow.test.tsx.snap
-53
View File
@@ -1,53 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`RoomRow Should render correctly 1`] = `
<div
className="sc-crzpnZ sc-bqGGcD gIMFtm jqrNRF"
>
<div>
1
</div>
<div>
Temp Room
</div>
<div>
$250.00
</div>
<div>
Unavailable
</div>
<div>
<div
className="sc-fnVZQs CCxtf"
>
<button
aria-label="Menu item 1"
className="sc-bkbjWr fCztjK"
onClick={[Function]}
>
<svg
aria-hidden="true"
fill="currentColor"
height="1em"
stroke="currentColor"
strokeWidth="0"
style={
{
"color": undefined,
}
}
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
clipRule="evenodd"
d="M10.5 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zm0 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zm0 6a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0z"
fillRule="evenodd"
/>
</svg>
</button>
</div>
</div>
</div>
`;
hotel-management/src/pages/Room/__tests__/__snapshots__/RoomTable.test.tsx.snap
-63
View File
@@ -1,63 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`RoomTable Should render correctly 1`] = `
<div
className="sc-iJCSeZ crZyCc"
type="vertical"
>
<div
className="sc-lmgPJu cuMSiO"
>
<div
className="sc-crzpnZ iahNiP"
>
<button
active={true}
className="sc-dItHI guVVWw"
disabled={true}
onClick={[Function]}
>
Ascending
</button>
<button
active={false}
className="sc-dItHI fIRqtD"
disabled={false}
onClick={[Function]}
>
Descending
</button>
</div>
<select
aria-label="Sort"
className="sc-iqAbyq czAJZn"
onChange={[Function]}
value=""
>
<option
value="id"
>
Sort by id
</option>
<option
value="name"
>
Sort by name
</option>
<option
value="price"
>
Sort by price
</option>
</select>
<input
className="sc-kEqXeH jMVPeG"
onChange={[Function]}
placeholder="Search by name..."
/>
</div>
<div
className="sc-giAruI hMNXks"
/>
</div>
`;
hotel-management/src/pages/Room/__tests__/__snapshots__/index.test.tsx.snap
-84
View File
@@ -1,84 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Room Should render correctly 1`] = `
<main
className="sc-iwaiBT gPCYSC"
>
<div
className="sc-iJCSeZ jDHUlN"
type="horizontal"
>
<h2
className="sc-cxNGUP ffcGOQ"
>
List Room
</h2>
<button
className="sc-bqGGcD cVmQmy"
onClick={[Function]}
variations="primary"
>
Add room
</button>
</div>
<div
className="sc-iJCSeZ crZyCc"
type="vertical"
>
<div
className="sc-lmgPJu cuMSiO"
>
<div
className="sc-crzpnZ iahNiP"
>
<button
active={true}
className="sc-dItHI guVVWw"
disabled={true}
onClick={[Function]}
>
Ascending
</button>
<button
active={false}
className="sc-dItHI fIRqtD"
disabled={false}
onClick={[Function]}
>
Descending
</button>
</div>
<select
aria-label="Sort"
className="sc-iqAbyq czAJZn"
onChange={[Function]}
value=""
>
<option
value="id"
>
Sort by id
</option>
<option
value="name"
>
Sort by name
</option>
<option
value="price"
>
Sort by price
</option>
</select>
<input
className="sc-kEqXeH jMVPeG"
onChange={[Function]}
placeholder="Search by name..."
/>
</div>
<div
className="sc-giAruI hMNXks"
/>
</div>
</main>
`;
hotel-management/src/pages/Room/__tests__/index.test.tsx
-22
View File
@@ -1,22 +0,0 @@
import Room from '..';
import { BrowserRouter } from 'react-router-dom';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
// Components
import renderer from 'react-test-renderer';
describe('Room', () => {
const queryClient = new QueryClient();
const wrapper = renderer.create(
<QueryClientProvider client={queryClient}>
<BrowserRouter>
<Room />
</BrowserRouter>
</QueryClientProvider>
);
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
});
});
hotel-management/src/pages/User/__tests__/UserForm.test.tsx
+60 -9
View File
@@ -1,22 +1,73 @@
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { BrowserRouter } from 'react-router-dom';
import renderer from 'react-test-renderer';
// Components
import UserForm from '../UserForm';
import {
RenderResult,
fireEvent,
render,
waitFor,
} from '@testing-library/react';
const createUser = jest.fn();
jest.mock('@hook/users/useCreateUser.ts', () => ({
...jest.requireActual('@hook/users/useCreateUser.ts'),
useCreateUser: jest.fn(() => ({
isCreating: false,
createUser,
})),
}));
jest.mock('@hook/users/useUpdateUser', () => ({
...jest.requireActual('@hook/users/useUpdateUser'),
useUpdateUser: () => ({
isUpdating: false,
updateUser: jest.fn(),
}),
}));
describe('UserForm', () => {
const queryClient = new QueryClient();
const wrapper = renderer.create(
<QueryClientProvider client={queryClient}>
<BrowserRouter>
<UserForm />
</BrowserRouter>
</QueryClientProvider>
);
let wrapper: RenderResult | null = null;
beforeEach(() => {
wrapper = render(
<QueryClientProvider client={queryClient}>
<BrowserRouter>
<UserForm />
</BrowserRouter>
</QueryClientProvider>
);
});
test('Should render correctly', () => {
expect(wrapper).toMatchSnapshot();
});
test('Should submit correctly', async () => {
const nameField = wrapper!.container.querySelector('#name');
const phoneField = wrapper!.container.querySelector('#phone');
const submitBtn = wrapper!.getByText('Add').closest('button');
let result: {
name: string;
phone: string;
};
createUser.mockImplementationOnce((newUser, { onSuccess }) => {
result = newUser;
onSuccess();
});
fireEvent.input(nameField!, { target: { value: 'Nezumi' } });
fireEvent.input(phoneField!, { target: { value: '0327764321' } });
fireEvent.submit(submitBtn!);
await waitFor(() => {
expect(createUser).toHaveBeenCalled();
expect(result).toEqual({ name: 'Nezumi', phone: '0327764321' });
});
});
});
hotel-management/src/pages/User/__tests__/__snapshots__/UserForm.test.tsx.snap
+177 -60
View File
@@ -1,67 +1,184 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`UserForm Should render correctly 1`] = `
<form
className="sc-gtsqUy jMGskL"
onSubmit={[Function]}
>
<div
className="sc-hKFymg frexHr"
>
<label
className="sc-eCAqax dnXnhF"
>
Full Name
</label>
{
"asFragment": [Function],
"baseElement": <body>
<div>
<input
className="sc-bdnyFh gejiRq"
id="name"
name="name"
onBlur={[Function]}
onChange={[Function]}
type="text"
/>
<form
class="sc-dlniIP bCPNqw"
>
<div
class="sc-eCAqax dgDilB"
direction="horizontal"
>
<label
class="sc-jSFipO cMYxin"
>
Full Name
</label>
<div>
<input
class="sc-bdnyFh gXSWSo"
id="name"
name="name"
type="text"
/>
</div>
</div>
<div
class="sc-eCAqax dgDilB"
direction="horizontal"
>
<label
class="sc-jSFipO cMYxin"
>
Phone
</label>
<div>
<input
class="sc-bdnyFh gXSWSo"
id="phone"
name="phone"
type="text"
/>
</div>
</div>
<div
class="sc-hKFymg dteuGK"
>
<button
class="sc-gtsqUy sc-iCoHzw iXmfC cwhbgM"
disabled=""
name="submit"
type="submit"
variations="primary"
>
Add
</button>
<button
class="sc-gtsqUy sc-iCoHzw hesuRJ cwhbgM"
type="button"
variations="secondary"
>
Close
</button>
</div>
</form>
</div>
</div>
<div
className="sc-hKFymg frexHr"
>
<label
className="sc-eCAqax dnXnhF"
</body>,
"container": <div>
<form
class="sc-dlniIP bCPNqw"
>
Phone
</label>
<div>
<input
className="sc-bdnyFh gejiRq"
id="phone"
name="phone"
onBlur={[Function]}
onChange={[Function]}
type="text"
/>
</div>
</div>
<div
className="sc-dlniIP hBqqvG"
>
<button
className="sc-gKAaef sc-jrsKJM gifCOZ KLoQf"
disabled={true}
name="submit"
type="submit"
variations="primary"
>
Add
</button>
<button
className="sc-gKAaef sc-jrsKJM gbgZUe KLoQf"
type="button"
variations="secondary"
>
Close
</button>
</div>
</form>
<div
class="sc-eCAqax dgDilB"
direction="horizontal"
>
<label
class="sc-jSFipO cMYxin"
>
Full Name
</label>
<div>
<input
class="sc-bdnyFh gXSWSo"
id="name"
name="name"
type="text"
/>
</div>
</div>
<div
class="sc-eCAqax dgDilB"
direction="horizontal"
>
<label
class="sc-jSFipO cMYxin"
>
Phone
</label>
<div>
<input
class="sc-bdnyFh gXSWSo"
id="phone"
name="phone"
type="text"
/>
</div>
</div>
<div
class="sc-hKFymg dteuGK"
>
<button
class="sc-gtsqUy sc-iCoHzw iXmfC cwhbgM"
disabled=""
name="submit"
type="submit"
variations="primary"
>
Add
</button>
<button
class="sc-gtsqUy sc-iCoHzw hesuRJ cwhbgM"
type="button"
variations="secondary"
>
Close
</button>
</div>
</form>
</div>,
"debug": [Function],
"findAllByAltText": [Function],
"findAllByDisplayValue": [Function],
"findAllByLabelText": [Function],
"findAllByPlaceholderText": [Function],
"findAllByRole": [Function],
"findAllByTestId": [Function],
"findAllByText": [Function],
"findAllByTitle": [Function],
"findByAltText": [Function],
"findByDisplayValue": [Function],
"findByLabelText": [Function],
"findByPlaceholderText": [Function],
"findByRole": [Function],
"findByTestId": [Function],
"findByText": [Function],
"findByTitle": [Function],
"getAllByAltText": [Function],
"getAllByDisplayValue": [Function],
"getAllByLabelText": [Function],
"getAllByPlaceholderText": [Function],
"getAllByRole": [Function],
"getAllByTestId": [Function],
"getAllByText": [Function],
"getAllByTitle": [Function],
"getByAltText": [Function],
"getByDisplayValue": [Function],
"getByLabelText": [Function],
"getByPlaceholderText": [Function],
"getByRole": [Function],
"getByTestId": [Function],
"getByText": [Function],
"getByTitle": [Function],
"queryAllByAltText": [Function],
"queryAllByDisplayValue": [Function],
"queryAllByLabelText": [Function],
"queryAllByPlaceholderText": [Function],
"queryAllByRole": [Function],
"queryAllByTestId": [Function],
"queryAllByText": [Function],
"queryAllByTitle": [Function],
"queryByAltText": [Function],
"queryByDisplayValue": [Function],
"queryByLabelText": [Function],
"queryByPlaceholderText": [Function],
"queryByRole": [Function],
"queryByTestId": [Function],
"queryByText": [Function],
"queryByTitle": [Function],
"rerender": [Function],
"unmount": [Function],
}
`;
hotel-management/src/pages/User/__tests__/__snapshots__/UserRow.test.tsx.snap
+2 -2
View File
@@ -18,11 +18,11 @@ exports[`UserRow Should render correctly 1`] = `
</div>
<div>
<div
className="sc-jrsKJM cdPhia"
className="sc-kEqXeH jLboIv"
>
<button
aria-label="Menu item 1"
className="sc-iqAbyq fyjyXl"
className="sc-crzpnZ gdsCet"
onClick={[Function]}
>
<svg
hotel-management/src/pages/User/__tests__/__snapshots__/UserTable.test.tsx.snap
+12 -10
View File
@@ -2,26 +2,24 @@
exports[`UserTable Should render correctly 1`] = `
<div
className="sc-iJCSeZ crZyCc"
className="sc-giAruI eEOXtt"
type="vertical"
>
<div
className="sc-lmgPJu cuMSiO"
className="sc-iJCSeZ boUFen"
>
<div
className="sc-crzpnZ iahNiP"
className="sc-dItHI exgtuU"
>
<button
active={true}
className="sc-dItHI guVVWw"
className="sc-bqGGcD entqcN"
disabled={true}
onClick={[Function]}
>
Ascending
</button>
<button
active={false}
className="sc-dItHI fIRqtD"
className="sc-bqGGcD graLyf"
disabled={false}
onClick={[Function]}
>
@@ -30,34 +28,38 @@ exports[`UserTable Should render correctly 1`] = `
</div>
<select
aria-label="Sort"
className="sc-iqAbyq czAJZn"
className="sc-crzpnZ iXFhDe"
disabled={false}
onChange={[Function]}
value=""
>
<option
data-testid="select-option"
value="id"
>
Sort by id
</option>
<option
data-testid="select-option"
value="name"
>
Sort by name
</option>
<option
data-testid="select-option"
value="price"
>
Sort by price
</option>
</select>
<input
className="sc-kEqXeH jMVPeG"
className="sc-iqAbyq kOrhXJ"
onChange={[Function]}
placeholder="Search by name..."
/>
</div>
<div
className="sc-giAruI hMNXks"
className="sc-ezyZrH dFKszz"
/>
</div>
`;
hotel-management/src/pages/User/__tests__/__snapshots__/index.test.tsx.snap
+16 -14
View File
@@ -2,19 +2,19 @@
exports[`User Should render correctly 1`] = `
<main
className="sc-fKgKDd iDHRyD"
className="sc-lmgPJu fmDjvX"
>
<div
className="sc-lmgPJu bFEqIE"
className="sc-cxNGUP cGfCbe"
type="horizontal"
>
<h2
className="sc-bCwene htGYaf"
className="sc-iJCSeZ jfWGKb"
>
List User
</h2>
<button
className="sc-kfYpNk QIeuT"
className="sc-iemXqs gdUlEE"
onClick={[Function]}
variations="primary"
>
@@ -22,26 +22,24 @@ exports[`User Should render correctly 1`] = `
</button>
</div>
<div
className="sc-lmgPJu hehIVl"
className="sc-cxNGUP hDpxxT"
type="vertical"
>
<div
className="sc-iwaiBT eOzYWb"
className="sc-giAruI kILZpe"
>
<div
className="sc-crzpnZ iahNiP"
className="sc-dItHI exgtuU"
>
<button
active={true}
className="sc-dItHI guVVWw"
className="sc-bqGGcD entqcN"
disabled={true}
onClick={[Function]}
>
Ascending
</button>
<button
active={false}
className="sc-dItHI fIRqtD"
className="sc-bqGGcD graLyf"
disabled={false}
onClick={[Function]}
>
@@ -50,34 +48,38 @@ exports[`User Should render correctly 1`] = `
</div>
<select
aria-label="Sort"
className="sc-iqAbyq czAJZn"
className="sc-crzpnZ iXFhDe"
disabled={false}
onChange={[Function]}
value=""
>
<option
data-testid="select-option"
value="id"
>
Sort by id
</option>
<option
data-testid="select-option"
value="name"
>
Sort by name
</option>
<option
data-testid="select-option"
value="phone"
>
Sort by phone
</option>
</select>
<input
className="sc-kEqXeH jMVPeG"
className="sc-iqAbyq kOrhXJ"
onChange={[Function]}
placeholder="Search by phone..."
/>
</div>
<div
className="sc-iJCSeZ gDbWTd"
className="sc-ezyZrH dFKszz"
/>
</div>
</main>
hotel-management/src/services/__tests__/roomService.test.ts
+86
View File
@@ -0,0 +1,86 @@
import { waitFor } from '@testing-library/react';
// Services
import {
createRoom,
setIsDeleteRoom,
getAllRooms,
updateRoom,
} from '@service/roomServices';
// Types
import { IRoom } from '@type/room';
jest.mock('@service/supabaseService');
const mockGetAllRooms = jest.fn(getAllRooms);
const mockUpdateRoom = jest.fn(updateRoom);
const mockCreateRoom = jest.fn(createRoom);
const mockIsDeleteRoom = jest.fn(setIsDeleteRoom);
const sampleData: IRoom = {
id: 999,
name: 'Room name test',
price: 9999,
status: true,
isDelete: true,
};
describe('Rooms service', () => {
test('Should fetch room correctly', async () => {
mockGetAllRooms.mockResolvedValue({
data: [
{
id: 1,
name: 'Nezumi',
price: 2500,
status: true,
isDelete: true,
},
{
id: 2,
name: 'Loi Phan',
price: 8500,
status: false,
isDelete: true,
},
],
count: 2,
});
const result = await mockGetAllRooms({
sortBy: 'name',
orderBy: 'asc',
roomSearch: '',
page: 1,
});
await waitFor(() => expect(result.data.length).toEqual(2));
});
test('Should create room correctly', async () => {
mockCreateRoom.mockResolvedValue(sampleData);
const result = await mockCreateRoom(sampleData);
await waitFor(() => expect(result).toBeTruthy());
});
test('Should update room correctly', async () => {
mockUpdateRoom.mockResolvedValue({
id: 1,
name: 'Nezumi',
price: 2500,
status: true,
isDelete: true,
});
const result = await mockUpdateRoom(sampleData);
await waitFor(() => expect(result).toBeTruthy());
});
test('Should delete room correctly', async () => {
mockIsDeleteRoom.mockResolvedValue(sampleData);
const result = await mockIsDeleteRoom(1);
await waitFor(() => expect(result).toBeTruthy());
});
});
hotel-management/src/services/__tests__/userService.test.ts
+64
View File
@@ -0,0 +1,64 @@
import { waitFor } from '@testing-library/react';
// Services
import { createUser, getAllUsers, updateUser } from '@service/userServices';
// Types
import { IUser } from '@type/user';
const mockGetAllUsers = jest.fn(getAllUsers);
const mockCreateUser = jest.fn(createUser);
const mockUpdateUser = jest.fn(updateUser);
const sampleData: IUser = {
id: 999,
name: 'User name test',
phone: '123456789',
isBooked: true,
isDelete: true,
};
describe('User services', () => {
test('Should fetch user data correctly', async () => {
mockGetAllUsers.mockResolvedValue({
data: [
{
id: 1,
name: 'Nezumi',
phone: '0324422123',
isBooked: true,
isDelete: true,
},
{
id: 2,
name: 'Loi Phan',
phone: '0324422145',
isBooked: false,
isDelete: true,
},
], count: 2
});
const result = await mockGetAllUsers(({
sortBy: 'name',
orderBy: 'asc',
phoneSearch: '',
page: 1,
}));
await waitFor(() => expect(result.data.length).toEqual(2));
});
test('Should create user correctly', async () => {
mockCreateUser.mockResolvedValue(sampleData);
const result = await mockCreateUser(sampleData);
await waitFor(() => expect(result).toBeTruthy());
});
test('Should update user correctly', async () => {
mockUpdateUser.mockResolvedValue(sampleData);
const result = await mockUpdateUser(sampleData);
await waitFor(() => expect(result).toBeTruthy());
});
});