실전 코드로 배우는 Vue.js

389

CHAPTER 11

Vue 테스트

/** tests/PizzaCard.test.ts */

describe('PizzaCard', () => {

it('should emit add-to-cart event when add to cart button is clicked', () =>

{

//...

expect(wrapper.emitted()['add-to-cart']).toBeTruthy();

expect(wrapper.emitted()['add-to-cart'][0]).toEqual([

{ id: pizza.id, quantity: 1 }

]);

});

});

TIP

피니아 저장소가 사용된 컴포넌트 테스트

@

pinia

/

testing

패키지의

createTestingPinia

()

로 테스트용 피니아 인스턴스를 생성하고, 마운트 단계에

서 전역 플러그인으로 컴포넌트에 추가할 수 있다. 이런 방식으로 저장소를 모의할 수 있으며 실제 저장소 인스턴스

없이 컴포넌트를 테스트할 수 있다.

이제 테스트는 문제없이 통과할 것이다. 지금까지 테스트의 기본기를 배우며

Vitest

와

Vue

테스트 유틸로 컴포넌트와 컴포저블을 테스트했다. 다음 절에서는

GUI

로

Vitest

를 다루는

방법을 살펴볼 것이다

11.911.9

VitestVitest

와 와

GUIGUI

터미널이나 명령줄 ...