【Vue.js 】vue-jest-utilsでコンポーネントのメソッド発火をテストしてみた件

// testComponent.vue
<template>
  <span class="test-component" @click="clickMethod">
  </span>
</template>

<script>
export default {
  methods: {
    clickMethod() {
      this.$emit('component-clicked');
    },
  },
};
</script>

[vue-test-utils]: setMethods is deprecated and will be removed in the next major version. There is no clear migration path for setMethods - Vue does not support arbitrarily replacement of methods, nor should VTU. To stub a complex method extract it from the component and test it in isolation. Otherwise, the suggestion is to rethink those tests.

// testComponent.spec.js
// importとdescribeのコードは割愛します。

const wrapper = shallowMount(testComponent);

test('メソッドは正しく発火できる', () => {
    // コンポーネントのmethodをvmから呼び出す
    wrapper.vm.clickMethod();
    
    // イベントはemitされた場合はtrueになる
    expect(wrapper.emitted()['component-clicked']).toBeTruthy();
  });