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

Commit5ed8232

Browse files
committed
test: Add tests and storybook
1 parent73ed5cd commit5ed8232

File tree

3 files changed

+82
-1
lines changed

3 files changed

+82
-1
lines changed
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
importBoxfrom"@material-ui/core/Box"
2+
import{Story}from"@storybook/react"
3+
importReactfrom"react"
4+
import{UserDropdown,UserDropdownProps}from"./UserDropdown"
5+
6+
exportdefault{
7+
title:"Page/UserDropdown",
8+
component:UserDropdown,
9+
argTypes:{
10+
onSignOut:{action:"Sign Out"},
11+
},
12+
}
13+
14+
constTemplate:Story<UserDropdownProps>=(args:UserDropdownProps)=>(
15+
<Boxstyle={{backgroundColor:"#000",width:88}}>
16+
<UserDropdown{...args}/>
17+
</Box>
18+
)
19+
20+
exportconstExample=Template.bind({})
21+
Example.args={
22+
user:{id:"1",username:"CathyCoder",email:"cathy@coder.com",created_at:"dawn"},
23+
onSignOut:()=>{
24+
returnPromise.resolve()
25+
},
26+
}
Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import{screen}from"@testing-library/react"
2+
importReactfrom"react"
3+
import{render}from"../../test_helpers"
4+
import{MockUser}from"../../test_helpers/entities"
5+
import{UserDropdown,UserDropdownProps}from"./UserDropdown"
6+
7+
constrenderAndClick=async(props:Partial<UserDropdownProps>={})=>{
8+
render(<UserDropdownuser={props.user??MockUser}onSignOut={props.onSignOut??jest.fn()}/>)
9+
consttrigger=awaitscreen.findByTestId("user-dropdown-trigger")
10+
trigger.click()
11+
}
12+
13+
describe("UserDropdown",()=>{
14+
describe("when the trigger is clicked",()=>{
15+
it("opens the menu",async()=>{
16+
awaitrenderAndClick()
17+
expect(screen.getByText(/account/i)).toBeDefined()
18+
expect(screen.getByText(/documentation/i)).toBeDefined()
19+
expect(screen.getByText(/signout/i)).toBeDefined()
20+
})
21+
})
22+
23+
describe("when the menu is open",()=>{
24+
describe("and sign out is clicked",()=>{
25+
it("calls the onSignOut function",async()=>{
26+
constonSignOut=jest.fn()
27+
awaitrenderAndClick({ onSignOut})
28+
screen.getByText(/signout/i).click()
29+
expect(onSignOut).toBeCalledTimes(1)
30+
})
31+
})
32+
})
33+
34+
it("has the correct link for the documentation item",async()=>{
35+
awaitrenderAndClick()
36+
37+
constlink=screen.getByText(/documentation/i).closest("a")
38+
if(!link){
39+
thrownewError("Anchor tag not found for the documentation menu item")
40+
}
41+
42+
expect(link.getAttribute("href")).toBe("https://coder.com/docs")
43+
})
44+
45+
it("has the correct link for the account item",async()=>{
46+
awaitrenderAndClick()
47+
48+
constlink=screen.getByText(/account/i).closest("a")
49+
if(!link){
50+
thrownewError("Anchor tag not found for the account menu item")
51+
}
52+
53+
expect(link.getAttribute("href")).toBe("/preferences")
54+
})
55+
})

‎site/src/components/Navbar/UserDropdown.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ export const UserDropdown: React.FC<UserDropdownProps> = ({ user, onSignOut }: U
3535
return(
3636
<>
3737
<div>
38-
<MenuItemonClick={handleDropdownClick}>
38+
<MenuItemonClick={handleDropdownClick}data-testid="user-dropdown-trigger">
3939
<divclassName={styles.inner}>
4040
<Badgeoverlap="circle">
4141
<UserAvatarusername={user.username}/>

0 commit comments

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