📚 Reference

• 공식 사이트 1
• 공식 문서 1
• GitHub 1
• 참고 자료 1
• 참고 자료 2
• 참고 자료 3
• 참고 자료 4
• 참고 자료 5

📜 Chapter

‣

@vue/test-utils

‣

‣

‣

‣

Pinia

nextTick()

msw

Vue Test Utils

• VTU
• Test Utils는 Vue 구성 요소를 마운트하고 상호 작용하는 방법을 제공하는 Vue 테스트 라이브러리이다.
• Vue framework 를 테스트하기 위한 라이브러리 이다.
• Component 기반의 랜더링 지원부터 시작해서, user 의 interaction 까지 테스트해볼 수 있다.

Vue 인스턴스 생성

• Vue 생성자를 이용해 Vue 인스턴스를 생성하고 인스턴스 메소드 $mount를 이용하는 방법도 있지만 VTU에서 제공하는 함수를 통해 쉽게 Vue 인스턴스를 생성하고 마운트할 수 있다.

import Vue from 'vue'
import RegisterPage form '@/views/RegisterPage'

// 생성자 기반
const Constructor = Vue.extend(ReigsterPage)
const vm = new Constructor().$mount

// VTU 사용
import { mount } form '@vue/test-utils'

const wrapper = mount(RegisterPage)

• VTU의 mount(), shallowMount() 메소드를 이용해 뷰 인스턴스를 생성하고 마운트할 수 있다.
• 이 메소드는 테스팅을 위한 wrapper 객체를 반환한다.
• 일반적인 Vue 인스턴스와는 다르니 구별해야 한다.