반응형
SMALL
react-hook-form, Formik과 같은 Validation을 도와주는 라이브러리를 사용하는 경우,
Form Submit 자체를 비동기로 하기 때문에
테스팅 시에도 비동기로 테스트 해주어야한다.
// App.spec.tsx
import { Controller, useForm } from "react-hook-form";
import { yupResolver } from "@hookform/resolvers/yup";
...
describe('test', () => {
it('react-hook-form 테스트', async () => {
const TestPage = () => {
const { control } = useForm(...)
return (
<Controller
control={control}
name="time"
render={({field}) => {
return <Input {...field} />
}}
/>
)
}
render(<TestPage />)
const button = screen.getByTestId('test-buttons');
fireEvent.click(button);
// Uncaught Error
await waitFor(() => expect(button).toBeVisible())
})
})
반응형
LIST
'React' 카테고리의 다른 글
React에서 useEffect는 어떻게 이루어져있나? (0) | 2023.03.09 |
---|---|
React에서 useEffect 대신에 useLayoutEffect가 더 좋을까? (0) | 2023.03.09 |
Jest + Testing Library +React에서 scrollTo is not a function 에러를 마주쳤을 때? (0) | 2023.03.01 |
Cypress vs Playwright - 2023년에는 어떤 리액트 테스팅 툴을 써야할까? (Feat. Cypress vs Playwright: Which is best for E2E testing) (1) | 2023.03.01 |
리액트 성능 향상 - 13. Layout Shift (0) | 2023.01.13 |