예를 들어 사용자가 키보드 키를 눌러 브라우저에서 상호 작용할 때, 그들은 브라우저가 그들에게 보여주는 UI 계층과 상호 작용한다. 그런 다음 브라우저는 이 입력을 해석하고, 필요한 경우 이에 맞춰 기본 DOM을 변경하고 신뢰할 수 있는 이벤트를 디스패치한다.
UI 계층 및 신뢰할 수 있는 이벤트를 프로그래밍적으로 사용하기란 불가능하다.
따라서
user-event 는 실제 브라우저에서 발생하는 것처럼 사용자 상호 작용을 시뮬레이션하기 위해 차선책으로 UI 계층을 모의 테스트 한다.Starting a session per setup()
setup(options?: Options): UserEventuserEvent.setup() API를 통해 user-event 인스턴스를 구성할 수 있다.
이 인스턴스의 메서드는 하나의 입력 장치 상태(예: 어떤 키를 누르는지)를 공유하고 이를 통해 실제 사용자의 상호 작용과 동일하게 작동하는 여러 개의 연속 상호 작용을 작성할 수 있다.import userEvent from '@testing-library/user-event'
const user = userEvent.setup()
await user.keyboard('[ShiftLeft>]') // 왼쪽 Shift키를 누름 (누른 상태를 유지함)
await user.click(element) // `shiftKey: true` 상태에서 클릭을 수행인스턴스는 동일한 입력 장치 상태를 공유하는 다른 인스턴스를 구성할 수 있는
.setup() API를 제공한다.클립보드 API 는 일반적으로 보안 컨텍스트 외에는 사용할 수 없다. 따라서 클립보드와 관련된 워크플로우를 테스트할 수 있도록
userEvent.setup() 은 window.navigator.clipboard를 stub로 대체한다.Test Stub란?
테스트 스텁(test stub)은 소프트웨어 테스팅에서 사용되는 용어로, 아직 구현되지 않은 코드를 대신하여 테스트를 진행할 수 있게 해주는 코드 조각을 의미한다. 스텁은 테스트하려는 코드와 상호작용하며, 예상된 방식으로 동작한다. 이를 통해 아직 완성되지 않은 코드가 있는 상황에서도 테스트를 계속 진행할 수 있다.
Direct APIs
default export로 API를 직접 호출할 수도 있다. 이렇게 하면 내부적으로
setup을 호출한 다음 생성된 인스턴스에서 메서드를 사용한다.이는 버전 14로의 전환과 간단한 테스트 작성을 용이하게 하기 위해 존재한다.
userEvent.setup()에서 반환된 인스턴스에서 메서드를 사용하는 것을 권장한다.Share article
