프론트엔드/단위 테스트15 VTU API 공식 문서 사이트 API Reference | Vue Test Utils for Vue 3 (2.0.0-rc.18) (vuejs.org) API Reference | Vue Test Utils for Vue 3 (2.0.0-rc.18) API Reference mount Creates a Wrapper that contains the mounted and rendered Vue component to test. Signature: interface MountingOptions { attachTo?: HTMLElement | string attrs?: Record data?: () => {} extends Data ? any : Data extends object ? Partial : a next.vue-test-utils.. 2022. 1. 23. VTU 첫 테스트 및 에러 해결(버전 문제) 공식문서 Getting Started | Vue Test Utils for Vue 3 (2.0.0-rc.18) (vuejs.org) Getting Started | Vue Test Utils for Vue 3 (2.0.0-rc.18) Getting Started Welcome to Vue Test Utils, the official testing utility library for Vue.js! This is the documentation for Vue Test Utils v2, which targets Vue 3. In short: What is Vue Test Utils? Vue Test Utils (VTU) is a set of utility functions aimed to next.vue-te.. 2022. 1. 21. 모의(Mock) 함수 단위 테스트는 최소한의 단위를 최소한의 시간을 드려서 하는게 좋다 따라서 시간이 걸리는 로직을 단순화 시키는데 이때 사용 되는것이 모의 함수 이다. 기존 코드 example.js // export 키워드를 붙여서 외부에서 테스트할수 있도록 설정 export function double(num) { // num 데이터가 없는 경우 if(!num) { return 0 } return num * 2 } // 기본값은 최대 5초 따라서 그 이상은 test코드 부분에서 설정해주어야 한다. export function asyncFn() { return new Promise((resolve) => { setTimeout(() => { resolve('Done!') }, 5000) }) } example.test.js.. 2022. 1. 20. 비동기 테스트 매개변수 done 이용방법: 비동기 함수가 언제 종료되는지 명시해주는 용도 return 키워드 이용방법: retrun 키워드를 붙여주는 것으로 테스트환경에서는 이부분을 비동기로 처리해야한다고 인지한다. resolves 브릿지 이용방법: return 키워드와 함께 사용해주어야 한다. async/await 키워드 이용방법: 콜백 자체를 비동기로 처리 (이 방법을 추천) example.js 코드 추가 // 기본값은 최대 5초 따라서 그 이상은 test코드 부분에서 설정해주어야 한다. export function asyncFn() { return new Promise((resolve) => { setTimeout(() => { resolve('Done!') }, 5000) }) } example.test.js .. 2022. 1. 19. Jest Matchers 이해 Matcher: 일치도구 공식 문서 사이트 Expect · Jest (jestjs.io) Expect · Jest When you're writing tests, you often need to check that values meet certain conditions. expect gives you access to a number of "matchers" that let you validate different things. jestjs.io 자주 사용하는 메소드 toBe(): 원시형 데이터 비교 toEqual(): 객체와 같은 참조형 데이터 비교 테스트 코드 작성 import { TestWatcher } from 'jest' const userA = { name: 'Happy', age: 85 } .. 2022. 1. 18. Jest Globals 공식문서 사이트 Globals · Jest (jestjs.io) Globals · Jest In your test files, Jest puts each of these methods and objects into the global environment. You don't have to require or import anything to use them. However, if you prefer explicit imports, you can do import {describe, expect, test} from '@jest/globals'. jestjs.io example.test.js 파일 수정 import {double} from './example' describe('그룹1', () => { /.. 2022. 1. 17. 이전 1 2 3 다음
