Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit1f113e8

Browse files
committed
test: add tests to the suspend user action
1 parentc2f6e1c commit1f113e8

File tree

9 files changed

+23465
-10
lines changed

9 files changed

+23465
-10
lines changed

‎site/jest.setup.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import"@testing-library/jest-dom"
12
import{server}from"./src/testHelpers/server"
23

34
// Establish API mocking before all tests through MSW.

‎site/package-lock.json

Lines changed: 23318 additions & 0 deletions
Some generated files are not rendered by default. Learn more aboutcustomizing how changed files appear on GitHub.

‎site/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,7 @@
5858
"@storybook/addon-essentials":"6.4.22",
5959
"@storybook/addon-links":"6.4.22",
6060
"@storybook/react":"6.4.22",
61+
"@testing-library/jest-dom":"5.16.4",
6162
"@testing-library/react":"12.1.5",
6263
"@testing-library/user-event":"14.1.1",
6364
"@types/express":"4.17.13",

‎site/src/components/UsersTable/UsersTable.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { Column, Table } from "../Table/Table"
55
import{TableRowMenu}from"../TableRowMenu/TableRowMenu"
66
import{UserCell}from"../UserCell/UserCell"
77

8-
constLanguage={
8+
exportconstLanguage={
99
pageTitle:"Users",
1010
usersTitle:"All users",
1111
emptyMessage:"No users found",
Lines changed: 56 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,65 @@
1-
import{screen}from"@testing-library/react"
1+
import{fireEvent,screen,waitFor,within}from"@testing-library/react"
22
importReactfrom"react"
3-
import{render}from"../../testHelpers"
4-
import{UsersPage}from"./UsersPage"
3+
import*asAPIfrom"../../api"
4+
import{GlobalSnackbar}from"../../components/GlobalSnackbar/GlobalSnackbar"
5+
import{LanguageasUsersTableLanguage}from"../../components/UsersTable/UsersTable"
6+
import{MockUser,MockUser2,render}from"../../testHelpers"
7+
import{LanguageasusersXServiceLanguage}from"../../xServices/users/usersXService"
8+
import{LanguageasUsersPageLanguage,UsersPage}from"./UsersPage"
59

610
describe("Users Page",()=>{
711
it("shows users",async()=>{
812
render(<UsersPage/>)
913
constusers=awaitscreen.findAllByText(/.*@coder.com/)
1014
expect(users.length).toEqual(2)
1115
})
16+
17+
describe("suspend user",()=>{
18+
describe("when it is success",()=>{
19+
it("shows a success message and refresh the page",async()=>{
20+
render(
21+
<>
22+
<UsersPage/>
23+
<GlobalSnackbar/>
24+
</>,
25+
)
26+
27+
// Get the first user in the table
28+
constusers=awaitscreen.findAllByText(/.*@coder.com/)
29+
constfirstUserRow=users[0].closest("tr")
30+
if(!firstUserRow){
31+
thrownewError("Error on get the first user row")
32+
}
33+
34+
// Click on the "more" button to display the "Suspend" option
35+
constmoreButton=within(firstUserRow).getByLabelText("more")
36+
fireEvent.click(moreButton)
37+
constmenu=screen.getByRole("menu")
38+
constsuspendButton=within(menu).getByText(UsersTableLanguage.suspendMenuItem)
39+
fireEvent.click(suspendButton)
40+
41+
// Check if the confirm message is displayed
42+
constconfirmDialog=screen.getByRole("dialog")
43+
expect(confirmDialog).toHaveTextContent("Do you want to suspend the user TestUser?")
44+
45+
// Setup spies to check the actions after
46+
jest.spyOn(API,"suspendUser").mockResolvedValueOnce(MockUser)
47+
jest.spyOn(API,"getUsers").mockImplementationOnce(()=>Promise.resolve([MockUser,MockUser2]))
48+
49+
// Click on the "Confirm" button
50+
constconfirmButton=within(confirmDialog).getByText(UsersPageLanguage.suspendDialogAction)
51+
fireEvent.click(confirmButton)
52+
53+
// Check if the success message
54+
awaitscreen.findByText(usersXServiceLanguage.suspendUserSuccess)
55+
56+
// Check if the API was called correctly
57+
expect(API.suspendUser).toBeCalledTimes(1)
58+
expect(API.suspendUser).toBeCalledWith(MockUser.id)
59+
60+
// Check if the users list was refetched
61+
awaitwaitFor(()=>expect(API.getUsers).toBeCalledTimes(1))
62+
})
63+
})
64+
})
1265
})

‎site/src/pages/UsersPage/UsersPage.tsx

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,11 @@ import { FullScreenLoader } from "../../components/Loader/FullScreenLoader"
77
import{XServiceContext}from"../../xServices/StateContext"
88
import{UsersPageView}from"./UsersPageView"
99

10+
exportconstLanguage={
11+
suspendDialogTitle:"Suspend user",
12+
suspendDialogAction:"Suspend",
13+
}
14+
1015
exportconstUsersPage:React.FC=()=>{
1116
constxServices=useContext(XServiceContext)
1217
const[usersState,usersSend]=useActor(xServices.usersXService)
@@ -45,8 +50,8 @@ export const UsersPage: React.FC = () => {
4550
hideCancel={false}
4651
open={usersState.matches("confirmUserSuspension")}
4752
confirmLoading={usersState.matches("suspendingUser")}
48-
title="Suspend user"
49-
confirmText="Suspend"
53+
title={Language.suspendDialogTitle}
54+
confirmText={Language.suspendDialogAction}
5055
onConfirm={()=>{
5156
usersSend("CONFIRM_USER_SUSPENSION")
5257
}}

‎site/src/testHelpers/index.tsx

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -30,9 +30,11 @@ export function renderWithAuth(ui: JSX.Element, { route = "/" }: { route?: strin
3030
constrenderResult=wrappedRender(
3131
<MemoryRouterinitialEntries={[route]}>
3232
<XServiceProvider>
33-
<Routes>
34-
<Routepath={route}element={<RequireAuth>{ui}</RequireAuth>}/>
35-
</Routes>
33+
<ThemeProvidertheme={dark}>
34+
<Routes>
35+
<Routepath={route}element={<RequireAuth>{ui}</RequireAuth>}/>
36+
</Routes>
37+
</ThemeProvider>
3638
</XServiceProvider>
3739
</MemoryRouter>,
3840
)

‎site/src/xServices/users/usersXService.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -132,7 +132,10 @@ export const usersMachine = createMachine(
132132
},
133133
{
134134
services:{
135-
getUsers:API.getUsers,
135+
// Passing API.getUsers directly does not invoke the function properly
136+
// when it is mocked. This happen in the UsersPage tests inside of the
137+
// "shows a success message and refresh the page" test case.
138+
getUsers:()=>API.getUsers(),
136139
createUser:(_,event)=>API.createUser(event.user),
137140
suspendUser:(context)=>{
138141
if(!context.userIdToSuspend){

‎site/yarn.lock

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1077,6 +1077,13 @@
10771077
dependencies:
10781078
regenerator-runtime "^0.13.4"
10791079

1080+
"@babel/runtime@^7.9.2":
1081+
version "7.17.9"
1082+
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.9.tgz#d19fbf802d01a8cb6cf053a64e472d42c434ba72"
1083+
integrity sha512-lSiBBvodq29uShpWGNbgFdKYNiFDo5/HIYsaCEY9ff4sb10x9jizo2+pRrSyF4jKZCXqgzuqBOQKbUm90gQwJg==
1084+
dependencies:
1085+
regenerator-runtime "^0.13.4"
1086+
10801087
"@babel/template@^7.12.7", "@babel/template@^7.16.7", "@babel/template@^7.3.3":
10811088
version "7.16.7"
10821089
resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.16.7.tgz#8d126c8701fde4d66b264b3eba3d96f07666d155"
@@ -2727,6 +2734,21 @@
27272734
lz-string "^1.4.4"
27282735
pretty-format "^27.0.2"
27292736

2737+
"@testing-library/jest-dom@5.16.4":
2738+
version "5.16.4"
2739+
resolved "https://registry.yarnpkg.com/@testing-library/jest-dom/-/jest-dom-5.16.4.tgz#938302d7b8b483963a3ae821f1c0808f872245cd"
2740+
integrity sha512-Gy+IoFutbMQcky0k+bqqumXZ1cTGswLsFqmNLzNdSKkU9KGV2u9oXhukCbbJ9/LRPKiqwxEE8VpV/+YZlfkPUA==
2741+
dependencies:
2742+
"@babel/runtime" "^7.9.2"
2743+
"@types/testing-library__jest-dom" "^5.9.1"
2744+
aria-query "^5.0.0"
2745+
chalk "^3.0.0"
2746+
css "^3.0.0"
2747+
css.escape "^1.5.1"
2748+
dom-accessibility-api "^0.5.6"
2749+
lodash "^4.17.15"
2750+
redent "^3.0.0"
2751+
27302752
"@testing-library/react-hooks@8.0.0":
27312753
version "8.0.0"
27322754
resolved "https://registry.yarnpkg.com/@testing-library/react-hooks/-/react-hooks-8.0.0.tgz#7d0164bffce4647f506039de0a97f6fcbd20f4bf"
@@ -2972,6 +2994,14 @@
29722994
dependencies:
29732995
"@types/istanbul-lib-report" "*"
29742996

2997+
"@types/jest@*":
2998+
version "27.5.0"
2999+
resolved "https://registry.yarnpkg.com/@types/jest/-/jest-27.5.0.tgz#e04ed1824ca6b1dd0438997ba60f99a7405d4c7b"
3000+
integrity sha512-9RBFx7r4k+msyj/arpfaa0WOOEcaAZNmN+j80KFbFCoSqCJGHTz7YMAMGQW9Xmqm5w6l5c25vbSjMwlikJi5+g==
3001+
dependencies:
3002+
jest-matcher-utils "^27.0.0"
3003+
pretty-format "^27.0.0"
3004+
29753005
"@types/jest@27.4.1":
29763006
version "27.4.1"
29773007
resolved "https://registry.yarnpkg.com/@types/jest/-/jest-27.4.1.tgz#185cbe2926eaaf9662d340cc02e548ce9e11ab6d"
@@ -3182,6 +3212,13 @@
31823212
resolved "https://registry.yarnpkg.com/@types/tapable/-/tapable-1.0.8.tgz#b94a4391c85666c7b73299fd3ad79d4faa435310"
31833213
integrity sha512-ipixuVrh2OdNmauvtT51o3d8z12p6LtFW9in7U79der/kwejjdNchQC5UMn5u/KxNoM7VHHOs/l8KS8uHxhODQ==
31843214

3215+
"@types/testing-library__jest-dom@^5.9.1":
3216+
version "5.14.3"
3217+
resolved "https://registry.yarnpkg.com/@types/testing-library__jest-dom/-/testing-library__jest-dom-5.14.3.tgz#ee6c7ffe9f8595882ee7bda8af33ae7b8789ef17"
3218+
integrity sha512-oKZe+Mf4ioWlMuzVBaXQ9WDnEm1+umLx0InILg+yvZVBBDmzV5KfZyLrCvadtWcx8+916jLmHafcmqqffl+iIw==
3219+
dependencies:
3220+
"@types/jest" "*"
3221+
31853222
"@types/uglify-js@*":
31863223
version "3.13.1"
31873224
resolved "https://registry.yarnpkg.com/@types/uglify-js/-/uglify-js-3.13.1.tgz#5e889e9e81e94245c75b6450600e1c5ea2878aea"
@@ -5586,6 +5623,20 @@ css-what@^5.1.0:
55865623
resolved "https://registry.yarnpkg.com/css-what/-/css-what-5.1.0.tgz#3f7b707aadf633baf62c2ceb8579b545bb40f7fe"
55875624
integrity sha512-arSMRWIIFY0hV8pIxZMEfmMI47Wj3R/aWpZDDxWYCPEiOMv6tfOrnpDtgxBYPEQD4V0Y/958+1TdC3iWTFcUPw==
55885625

5626+
css.escape@^1.5.1:
5627+
version "1.5.1"
5628+
resolved "https://registry.yarnpkg.com/css.escape/-/css.escape-1.5.1.tgz#42e27d4fa04ae32f931a4b4d4191fa9cddee97cb"
5629+
integrity sha1-QuJ9T6BK4y+TGktNQZH6nN3ul8s=
5630+
5631+
css@^3.0.0:
5632+
version "3.0.0"
5633+
resolved "https://registry.yarnpkg.com/css/-/css-3.0.0.tgz#4447a4d58fdd03367c516ca9f64ae365cee4aa5d"
5634+
integrity sha512-DG9pFfwOrzc+hawpmqX/dHYHJG+Bsdb0klhyi1sDneOgGOXy9wQIC8hzyVp1e4NRYDBdxcylvywPkkXCHAzTyQ==
5635+
dependencies:
5636+
inherits "^2.0.4"
5637+
source-map "^0.6.1"
5638+
source-map-resolve "^0.6.0"
5639+
55895640
cssesc@^3.0.0:
55905641
version "3.0.0"
55915642
resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
@@ -5942,6 +5993,11 @@ doctrine@^3.0.0:
59425993
dependencies:
59435994
esutils "^2.0.2"
59445995

5996+
dom-accessibility-api@^0.5.6:
5997+
version "0.5.14"
5998+
resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.14.tgz#56082f71b1dc7aac69d83c4285eef39c15d93f56"
5999+
integrity sha512-NMt+m9zFMPZe0JcY9gN224Qvk6qLIdqex29clBvc/y75ZBX9YA9wNK3frsYvu2DI1xcCIwxwnX+TlsJ2DSOADg==
6000+
59456001
dom-accessibility-api@^0.5.9:
59466002
version "0.5.11"
59476003
resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.11.tgz#79d5846c4f90eba3e617d9031e921de9324f84ed"
@@ -11694,6 +11750,14 @@ rechoir@^0.7.0:
1169411750
dependencies:
1169511751
resolve "^1.9.0"
1169611752

11753+
redent@^3.0.0:
11754+
version "3.0.0"
11755+
resolved "https://registry.yarnpkg.com/redent/-/redent-3.0.0.tgz#e557b7998316bb53c9f1f56fa626352c6963059f"
11756+
integrity sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==
11757+
dependencies:
11758+
indent-string "^4.0.0"
11759+
strip-indent "^3.0.0"
11760+
1169711761
refractor@^3.1.0:
1169811762
version "3.5.0"
1169911763
resolved "https://registry.yarnpkg.com/refractor/-/refractor-3.5.0.tgz#334586f352dda4beaf354099b48c2d18e0819aec"
@@ -12459,6 +12523,14 @@ source-map-resolve@^0.5.0:
1245912523
source-map-url "^0.4.0"
1246012524
urix "^0.1.0"
1246112525

12526+
source-map-resolve@^0.6.0:
12527+
version "0.6.0"
12528+
resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.6.0.tgz#3d9df87e236b53f16d01e58150fc7711138e5ed2"
12529+
integrity sha512-KXBr9d/fO/bWo97NXsPIAW1bFSBOuCnjbNTBMO7N59hsv5i9yzRDfcYwwt0l04+VqnKC+EwzvJZIP/qkuMgR/w==
12530+
dependencies:
12531+
atob "^2.1.2"
12532+
decode-uri-component "^0.2.0"
12533+
1246212534
source-map-support@0.4.18:
1246312535
version "0.4.18"
1246412536
resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.4.18.tgz#0286a6de8be42641338594e97ccea75f0a2c585f"

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp