더핑크퐁컴퍼니 기술 블로그 - Medium · 2022. 05. 03.

react-testing-library 의 fireEvent 를 userEvent로 마이그레이션 하기 with Antd

AI 엔지니어링 브리핑

이 글은 Antd를 사용하는 백오피스의 프론트엔드 테스트에서 단순한 이벤트 호출 방식인 fireEvent를 실제 사용자 행동에 더 가깝게 재현하는 userEvent로 바꾼 경험을 설명합니다.

문제 & 배경

문제 & 배경: 기존 테스트는 fireEvent로 클릭이나 입력 이벤트만 직접 발생시켜 실제 사용자가 조작할 때의 전체 흐름과 차이가 생길 수 있었습니다.

기술 & 해결책

기술 & 해결책: 구현 방식이 아니라 화면에 실제로 보이는 결과와 사용자 행동을 검증하는 테스트 방향에 맞춰 userEvent를 사용하고, 예를 들어 클릭 시 호버 등 브라우저에서 함께 일어나는 동작까지 재현하도록 변경했습니다.

교훈 & 주의점

교훈 & 주의점: userEvent는 fireEvent보다 현실적인 상호작용을 표현하지만 모든 API를 다루는 글은 아니므로 세부 동작과 사용법은 공식 문서를 확인해야 합니다.

내용이 비슷해요

내용이 비슷한 글을 먼저 보여드려요. 같은 문제나 해결책을 다룬다는 뜻은 아니에요.