-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
test: add subscribe bottom bar test & remove articlePopup test
- Loading branch information
1 parent
c069e41
commit 478b313
Showing
2 changed files
with
103 additions
and
5 deletions.
There are no files selected for viewing
5 changes: 0 additions & 5 deletions
5
src/common/components/ExternalControlOpenDialog/ExternalControlOpenDialog.test.ts
This file was deleted.
Oops, something went wrong.
103 changes: 103 additions & 0 deletions
103
src/main/components/SubscribeBottomBar/SubscribeBottomBar.test.tsx
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,103 @@ | ||
import { render, screen, fireEvent, waitFor } from '@testing-library/react'; | ||
import { describe, it, expect, vi } from 'vitest'; | ||
import SubscribeBottomBar from '.'; | ||
import { EMAIL_PLACEHOLDER, SUBSCRIBE_CONFIRM, SUBSCRIBE_ANNOUCE, SUBSCRIBE_TITLE_FEW, INVALID_EMAIL, SUBSCRIBE_SUCCESS } from '@main/constants/main'; | ||
import { useSubscribeForm } from '@main/hooks/useSubscribeForm'; | ||
import { useForm, Controller, Control, FieldValues, FormProvider } from 'react-hook-form'; | ||
import * as useToastModule from '@shared/components/ui/use-toast'; // import as module | ||
import { useToast } from '@shared/components/ui/use-toast'; | ||
import { EmailSubscribeFormData } from '@main/types'; | ||
|
||
// Mock the useSubscribeForm hook | ||
const mockOnSubmit = vi.fn(); | ||
|
||
vi.mock('@main/hooks/useSubscribeForm', () => ({ | ||
useSubscribeForm: () => { | ||
const form = useForm({ | ||
resolver: async (data) => { | ||
const errors: { email?: { type: string; message: string } } = {}; | ||
if (data.email && !data.email.includes('@')) { | ||
errors.email = { | ||
type: 'manual', | ||
message: INVALID_EMAIL, | ||
}; | ||
} | ||
return { | ||
values: Object.keys(errors).length ? {} : data, | ||
errors: errors, | ||
}; | ||
}, | ||
}); | ||
return { form, onSubmit: mockOnSubmit }; | ||
}, | ||
})); | ||
|
||
// Mock react-hook-form's Controller and FormProvider | ||
vi.mock('react-hook-form', async () => { | ||
const originalModule = await vi.importActual<any>('react-hook-form'); | ||
return { | ||
...originalModule, | ||
Controller: ({ control, name, render }: { control: Control, name: string, render: any }) => render({ | ||
field: { | ||
onChange: vi.fn(), | ||
onBlur: vi.fn(), | ||
value: '', | ||
name, | ||
ref: vi.fn(), | ||
} | ||
}), | ||
FormProvider: ({ children }: { children: React.ReactNode }) => <>{children}</>, | ||
useFormContext: () => ({ | ||
getFieldState: vi.fn(), | ||
formState: { errors: {} }, | ||
}), | ||
}; | ||
}); | ||
|
||
// Mock useToast hook | ||
const mockToast = vi.fn(); | ||
|
||
vi.mock('@shared/components/ui/use-toast', () => ({ | ||
useToast: () => ({ | ||
toast: mockToast, | ||
dismiss: vi.fn(), | ||
toasts: [] | ||
}), | ||
})); | ||
|
||
|
||
describe('구독 유도 바텀 바 테스트', () => { | ||
it('renders correctly', () => { | ||
render(<SubscribeBottomBar />); | ||
|
||
expect(screen.getByText(SUBSCRIBE_TITLE_FEW)).toBeInTheDocument(); | ||
expect(screen.getByPlaceholderText(EMAIL_PLACEHOLDER)).toBeInTheDocument(); | ||
expect(screen.getByText(SUBSCRIBE_CONFIRM)).toBeInTheDocument(); | ||
expect(screen.getByText((content) => content.includes(SUBSCRIBE_ANNOUCE.SUBSCRIBE_CONSEQUENCE))).toBeInTheDocument(); | ||
}); | ||
|
||
it('유효하지 않은 이메일을 사용했을 때 에러 띄우기', async () => { | ||
render(<SubscribeBottomBar />); | ||
|
||
const input = screen.getByPlaceholderText(EMAIL_PLACEHOLDER) as HTMLInputElement; | ||
const submitButton = screen.getByText(SUBSCRIBE_CONFIRM); | ||
|
||
fireEvent.change(input, { target: { value: 'invalid-email' } }); | ||
fireEvent.click(submitButton); | ||
|
||
expect(screen.queryByText(INVALID_EMAIL)).toBeDefined() // 값이 정의되어 있는 경우? | ||
}); | ||
|
||
it('유효한 이메일을 입력했을 때 toast 메시지를 표시', async () => { | ||
|
||
render(<SubscribeBottomBar />); | ||
|
||
const input = screen.getByPlaceholderText(EMAIL_PLACEHOLDER) as HTMLInputElement; | ||
const submitButton = screen.getByText(SUBSCRIBE_CONFIRM); | ||
|
||
fireEvent.change(input, { target: { value: '[email protected]' } }); | ||
fireEvent.click(submitButton); | ||
|
||
expect(screen.queryByText(SUBSCRIBE_SUCCESS)).toBeDefined() | ||
}); | ||
}); |