Thream/website
Archived
2
2
Fork 0
Code Issues Pull Requests Releases Activity

chore: remove jest -> cypress for unit tests

Browse Source
This commit is contained in:
Divlo
2022-08-23 21:51:20 +02:00
parent d8cedd7b77
commit 7ad3d226dc
87 changed files with 2668 additions and 7876 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
components/design/Button/Button.test.tsx
View File

@ -1,10 +0,0 @@
import { render } from '@testing-library/react'
import { Button } from '.'
describe('<Button />', () => {
it('should render', () => {
const { getByText } = render(<Button>Submit</Button>)
expect(getByText('Submit')).toBeInTheDocument()
})
})

10
components/design/Checkbox/Checkbox.test.tsx
View File

@ -1,10 +0,0 @@
import { render } from '@testing-library/react'
import { Checkbox } from './Checkbox'
describe('<Checkbox />', () => {
it('should render successfully', () => {
const { baseElement } = render(<Checkbox label='Checkbox' />)
expect(baseElement).toBeTruthy()
})
})

10
components/design/Divider/Divider.test.tsx
View File

@ -1,10 +0,0 @@
import { render } from '@testing-library/react'
import { Divider } from '.'
describe('<Divider />', () => {
it('should render successfully', () => {
const { baseElement } = render(<Divider />)
expect(baseElement).toBeTruthy()
})
})

34
components/design/FormState/FormState.test.tsx
View File

@ -1,34 +0,0 @@
import { render } from '@testing-library/react'
import { FormState } from '.'
describe('<FormState />', () => {
it('should return nothing if the state is idle', () => {
const { container } = render(<FormState state='idle' />)
expect(container.innerHTML.length).toEqual(0)
})
it('should return nothing if the message is null', () => {
const { container } = render(<FormState state='error' />)
expect(container.innerHTML.length).toEqual(0)
})
it('should render the <Loader /> if state is loading', () => {
const { getByTestId } = render(<FormState state='loading' />)
expect(getByTestId('loader')).toBeInTheDocument()
})
it('should render the success message if state is success', () => {
const message = 'Success Message'
const { getByText } = render(
<FormState state='success' message={message} />
)
expect(getByText(message)).toBeInTheDocument()
})
it('should render the error message if state is error', () => {
const message = 'Error Message'
const { getByText } = render(<FormState state='error' message={message} />)
expect(getByText(message)).toBeInTheDocument()
})
})

2
components/design/FormState/FormState.tsx
View File

@ -16,7 +16,7 @@ export const FormState: React.FC<FormStateProps> = (props) => {
if (state === 'loading') {
return (
<div data-testid='loader' className='mt-8 flex justify-center'>
<div data-cy='loader' className='mt-8 flex justify-center'>
<Loader />
</div>
)

15
components/design/IconButton/IconButton.test.tsx
View File

@ -1,15 +0,0 @@
import { render } from '@testing-library/react'
import { CogIcon } from '@heroicons/react/solid'
import { IconButton } from './IconButton'
describe('<IconButton />', () => {
it('should render successfully', () => {
const { baseElement } = render(
<IconButton className='h-10 w-10'>
<CogIcon />
</IconButton>
)
expect(baseElement).toBeTruthy()
})
})

10
components/design/IconLink/IconLink.test.tsx
View File

@ -1,10 +0,0 @@
import { render } from '@testing-library/react'
import { IconLink } from './IconLink'
describe('<IconLink />', () => {
it('should render successfully', () => {
const { baseElement } = render(<IconLink href='' />)
expect(baseElement).toBeTruthy()
})
})

52
components/design/Input/Input.test.tsx
View File

@ -1,52 +0,0 @@
import { render, fireEvent } from '@testing-library/react'
import { Input, getInputType } from '.'
describe('<Input />', () => {
it('should render the label', () => {
const labelContent = 'label content'
const { getByText } = render(<Input label={labelContent} />)
expect(getByText(labelContent)).toBeInTheDocument()
})
it('should not render forgot password link', () => {
const { queryByTestId } = render(
<Input type='text' label='content' showForgotPassword />
)
const forgotPasswordLink = queryByTestId('forgot-password-link')
expect(forgotPasswordLink).not.toBeInTheDocument()
})
it('should render forgot password link', () => {
const { queryByTestId } = render(
<Input type='password' label='content' showForgotPassword />
)
const forgotPasswordLink = queryByTestId('forgot-password-link')
expect(forgotPasswordLink).toBeInTheDocument()
})
it('should not render the eye icon if the input is not of type "password"', () => {
const { queryByTestId } = render(<Input type='text' label='content' />)
const passwordEye = queryByTestId('password-eye')
expect(passwordEye).not.toBeInTheDocument()
})
it('should handlePassword with eye icon', async () => {
const { findByTestId } = render(<Input type='password' label='content' />)
const passwordEye = await findByTestId('password-eye')
const input = await findByTestId('input')
expect(input).toHaveAttribute('type', 'password')
fireEvent.click(passwordEye)
expect(input).toHaveAttribute('type', 'text')
})
})
describe('getInputType', () => {
it('should return `text`', () => {
expect(getInputType('password')).toEqual('text')
})
it('should return `password`', () => {
expect(getInputType('text')).toEqual('password')
})
})

5
components/design/Input/Input.tsx
View File

@ -47,7 +47,7 @@ export const Input: React.FC<InputProps> = (props) => {
<Link href='/authentication/forgot-password'>
<a
className='text-center font-headline text-xs text-green-800 hover:underline dark:text-green-400 sm:text-sm'
data-testid='forgot-password-link'
data-cy='forgot-password-link'
>
{t('authentication:forgot-password')}
</a>
@ -56,7 +56,6 @@ export const Input: React.FC<InputProps> = (props) => {
</div>
<div className='relative mt-0'>
<input
data-testid='input'
data-cy={`input-${name ?? 'name'}`}
className='h-11 w-full rounded-lg border border-transparent bg-[#f1f1f1] px-3 font-paragraph leading-10 text-[#2a2a2a] caret-green-600 focus:border focus:shadow-green focus:outline-none'
{...rest}
@ -66,7 +65,7 @@ export const Input: React.FC<InputProps> = (props) => {
/>
{type === 'password' && (
<div
data-testid='password-eye'
data-cy='password-eye'
onClick={handlePassword}
className='password-eye absolute cursor-pointer bg-[#f1f1f1] bg-cover'
/>

20
components/design/Loader/Loader.test.tsx
View File

@ -1,20 +0,0 @@
import { render } from '@testing-library/react'
import { Loader } from '.'
describe('<Loader />', () => {
it('should render with correct width and height', async () => {
const size = 20
const { findByTestId } = render(<Loader width={size} height={size} />)
const progressSpinner = await findByTestId('progress-spinner')
expect(progressSpinner).toHaveStyle(`width: ${size}px`)
expect(progressSpinner).toHaveStyle(`height: ${size}px`)
})
it('should render with default width and height', async () => {
const { findByTestId } = render(<Loader />)
const progressSpinner = await findByTestId('progress-spinner')
expect(progressSpinner).toHaveStyle('width: 50px')
expect(progressSpinner).toHaveStyle('height: 50px')
})
})

2
components/design/Loader/Loader.tsx
View File

@ -9,7 +9,7 @@ export const Loader: React.FC<LoaderProps> = (props) => {
return (
<div className={props.className}>
<div data-testid='progress-spinner' className='progress-spinner'>
<div data-cy='progress-spinner' className='progress-spinner'>
<svg className='progress-spinner-svg' viewBox='25 25 50 50'>
<circle
className='progress-spinner-circle'

10
components/design/Main/Main.test.tsx
View File

@ -1,10 +0,0 @@
import { render } from '@testing-library/react'
import { Main } from '.'
describe('<Main />', () => {
it('should render successfully', () => {
const { baseElement } = render(<Main />)
expect(baseElement).toBeTruthy()
})
})

23
components/design/SocialMediaButton/SocialMediaButton.test.tsx
View File

@ -1,23 +0,0 @@
import { render } from '@testing-library/react'
import { SocialMedia, SocialMediaButton } from '.'
describe('<SocialMediaButton />', () => {
it('should render the social media', async () => {
const socialMedia: SocialMedia = 'Discord'
const { findByAltText } = render(
<SocialMediaButton socialMedia={socialMedia} />
)
const socialMediaButton = await findByAltText(socialMedia)
expect(socialMediaButton).toBeInTheDocument()
})
it('should render with a black text color with Google social media', async () => {
const socialMedia: SocialMedia = 'Google'
const { findByTestId } = render(
<SocialMediaButton socialMedia={socialMedia} />
)
const button = await findByTestId('social-media-button')
expect(button).toHaveStyle('color: #000')
})
})

1
components/design/SocialMediaButton/SocialMediaButton.tsx
View File

@ -54,7 +54,6 @@ export const SocialMediaButton: React.FC<SocialMediaButtonProps> = (props) => {
return (
<>
<button
data-testid='social-media-button'
{...rest}
className={classNames(className, 'button', givenClassName)}
>

10
components/design/Textarea/Textarea.test.tsx
View File

@ -1,10 +0,0 @@
import { render } from '@testing-library/react'
import { Textarea } from './Textarea'
describe('<Textarea />', () => {
it('should render successfully', () => {
const { baseElement } = render(<Textarea label='Textarea' />)
expect(baseElement).toBeTruthy()
})
})