programing

Vue 구성 요소의 Vuex 돌연변이에 대한 호출을 테스트하는 방법

prostudy 2022. 4. 7. 21:13
반응형

Vue 구성 요소의 Vuex 돌연변이에 대한 호출을 테스트하는 방법

다음과 같은 방법을 사용하는 vue 구성 요소가 있다고 가정하십시오.

methods:{
    doSomething(someParameter){
       //maybe do something with that Parameter 
       this.$store.commit("storeSomething",someParameter);

       let someParameter2 = this.transformToSth(someParameter);
       this.$store.commit("storeSomethingElse",someParameter2);
    }
}

이런 시험이 제이에스에서 통하려면 어떻게 해야 하나?

test("that the commit was correctly called",()=>{
     wrapper.vm.doSomething(someParameter);
     expect(wrapper.vm.$store.commit).hasBeenCalledWith(someParameter);

     expect(wrapper.vm.$store.commit).hasBeenCalledWith(someParameter2);
})

또한 나는 모의도 다시 되돌려서 그 방법이 이전과 동일한 구현을 사용하기를 원한다는 점에 유의한다.그렇지 않으면, 나는 시험 사이에 의존성을 만들게 되는데, 나는 그것을 매우 피하고 싶다.

(또한 행동과 게터 기능에도 동일한 방식으로 작동하기를 바란다)

spyOn으로 해결할 수 있다는 것을 알았다.

   test("that the commit was correctly called", () => {
        let spy = jest.spyOn(userCardEditingWrapper.vm.$store, "commit");
        wrapper.vm.doSomething("test");
        expect(spy).toHaveBeenCalledWith("storeSomething", someParameter);
        expect(spy).toHaveBeenCalledWith("storeSomethingElse", someParameter2);
      });

나에게 jest.fn()으로 힌트를 준 Vue 불협화음 채널의 @devTea에게 크레딧.

참조URL: https://stackoverflow.com/questions/68347601/how-do-i-test-the-call-on-a-vuex-mutation-in-a-vue-component

반응형