-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add @/modules/profile unit tests (#35)
* add profile EditField tests * add profile EditAvatar tests * add profile Avatar tests
- Loading branch information
1 parent
b361cc0
commit c9ea869
Showing
3 changed files
with
149 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,50 @@ | ||
import { render, waitFor } from '@testing-library/react'; | ||
|
||
import Avatar from '@/modules/profile/components/Avatar'; | ||
|
||
const profileKey = 'profileKey'; | ||
const address = '0x0000000000000000000000000000000000000000'; | ||
const mockDownloadProfilePicture = jest.fn(); | ||
|
||
jest.mock('@/modules/common/hooks', () => ({ | ||
__esModule: true, | ||
useAppContext: jest.fn(() => ({ profileKey, profile: {} })), | ||
})); | ||
|
||
jest.mock('@/modules/file/utils/image', () => ({ | ||
__esModule: true, | ||
downloadProfilePicture: jest.fn((...args) => Promise.resolve(mockDownloadProfilePicture(...args))), | ||
})); | ||
|
||
describe('Profile', () => { | ||
const image = { | ||
original: { | ||
mimeType: 'image/png', | ||
}, | ||
}; | ||
|
||
it('Verify that skeleton is rendered as default', async () => { | ||
const { container } = render(<Avatar />); | ||
|
||
const avatar = container.querySelector('span.MuiSkeleton-root'); | ||
expect(avatar).toBeInTheDocument(); | ||
}); | ||
|
||
it('Verify that skeleton is rendered if uploading', async () => { | ||
const { container } = render(<Avatar uploading={true} />); | ||
|
||
const avatar = container.querySelector('span.MuiSkeleton-root'); | ||
expect(avatar).toBeInTheDocument(); | ||
}); | ||
|
||
it('Verify that skeleton is removed after downloading', async () => { | ||
const { container } = render(<Avatar profile={{ address, image }} />); | ||
|
||
await waitFor(() => expect(container.querySelector('span.MuiSkeleton-root')).not.toBeInTheDocument()); | ||
|
||
expect(mockDownloadProfilePicture).toHaveBeenCalledWith(profileKey, address, image.original.mimeType); | ||
|
||
const avatar = container.querySelector('div.MuiAvatar-root'); | ||
expect(avatar).toBeInTheDocument(); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,43 @@ | ||
import { render, screen, waitFor } from '@testing-library/react'; | ||
|
||
import EditAvatar from '@/modules/profile/components/EditAvatar'; | ||
|
||
const pic = 'pic'; | ||
const file = 'file'; | ||
const address = '0x0000000000000000000000000000000000000000'; | ||
const mockUpdateProfileImage = jest.fn(); | ||
|
||
jest.mock('@/modules/common/hooks', () => ({ | ||
__esModule: true, | ||
useAppContext: jest.fn(() => ({ profileKey: null, profile: { address }, setProfile: jest.fn() })), | ||
})); | ||
|
||
jest.mock('@/modules/file/utils/image', () => ({ | ||
__esModule: true, | ||
uploadImage: jest.fn(() => Promise.resolve(file)), | ||
})); | ||
|
||
jest.mock('@/modules/file/utils/bucket', () => ({ | ||
__esModule: true, | ||
default: { | ||
upload: jest.fn(() => Promise.resolve(pic)), | ||
}, | ||
})); | ||
|
||
jest.mock('@/modules/profile/utils/ceramic', () => ({ | ||
__esModule: true, | ||
updateProfileImage: jest.fn((...args) => Promise.resolve(mockUpdateProfileImage(...args))), | ||
})); | ||
|
||
describe('Profile', () => { | ||
it('Verify that EditAvatar component can be rendered', async () => { | ||
render(<EditAvatar />); | ||
|
||
const editAvatar = screen.getByRole('button'); | ||
expect(editAvatar).toBeInTheDocument(); | ||
|
||
editAvatar.click(); | ||
|
||
await waitFor(() => expect(mockUpdateProfileImage).toHaveBeenCalledWith(address, pic, file)); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,56 @@ | ||
import { render, screen, fireEvent, waitFor } from '@testing-library/react'; | ||
|
||
import EditField from '@/modules/profile/components/EditField'; | ||
|
||
const address = '0x0000000000000000000000000000000000000000'; | ||
const mockUpdateProfile = jest.fn(); | ||
const mockSetProfile = jest.fn(); | ||
|
||
jest.mock('@/modules/common/hooks', () => ({ | ||
__esModule: true, | ||
useAppContext: jest.fn(() => ({ profile: { address }, setProfile: mockSetProfile })), | ||
})); | ||
|
||
jest.mock('@/modules/profile/utils/ceramic', () => ({ | ||
__esModule: true, | ||
updateProfile: jest.fn((...args) => mockUpdateProfile(...args)), | ||
})); | ||
|
||
describe('Profile', () => { | ||
const name = 'name'; | ||
const label = 'label'; | ||
const value = 'value'; | ||
|
||
it('Verify that name & label props are required', () => { | ||
expect(() => render(<EditField />)).toThrowError(); | ||
expect(() => render(<EditField name={name} />)).toThrowError(); | ||
expect(() => render(<EditField label={label} />)).toThrowError(); | ||
}); | ||
|
||
it('Verify that EditField component can be rendered', async () => { | ||
render(<EditField name={name} label={label} />); | ||
|
||
const editField = screen.getByRole('textbox'); | ||
expect(editField).toBeInTheDocument(); | ||
|
||
fireEvent.change(editField, { target: { value} }); | ||
fireEvent.blur(editField); | ||
|
||
await waitFor(() => expect(mockUpdateProfile).toHaveBeenCalledWith(address, name, value)); | ||
}); | ||
|
||
it('Verify that the validation errors are caught properly', async () => { | ||
render(<EditField name={name} label={label} />); | ||
|
||
const error = `${label} is required`; | ||
|
||
const editField = screen.getByRole('textbox'); | ||
expect(editField).toBeInTheDocument(); | ||
expect(screen.queryByText(error)).not.toBeInTheDocument(); | ||
|
||
await waitFor(() => fireEvent.change(editField, { target: { value } })); | ||
await waitFor(() => fireEvent.change(editField, { target: { value: '' } })); | ||
|
||
expect(screen.getByText(error)).toBeInTheDocument(); | ||
}); | ||
}); |
c9ea869
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Successfully deployed to the following URLs: