测试使用特定参数调用Vuex操作(来自组件)

// store.js
import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);

const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment(state, payload) {
      state.count += payload;
    }
  },
  actions: {
    incrementAsync({ commit }, payload) {
      setTimeout(() => {
        commit('increment', payload);
      }, 1000);
    }
  },
  getters: {
    getCount: state => state.count
  }
});

export default store;

// MyComponent.vue
<template>
  <div>
    <button @click="incrementCount(5)">Increment</button>
    <p>{{ count }}</p>
  </div>
</template>

<script>
import { mapActions, mapGetters } from 'vuex';

export default {
  computed: {
    ...mapGetters(['getCount']),
    count() {
      return this.getCount;
    }
  },
  methods: {
    ...mapActions(['incrementAsync']),
    incrementCount(value) {
      this.incrementAsync(value);
    }
  }
};
</script>

// MyComponent.spec.js
import { shallowMount, createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';
import MyComponent from '@/components/MyComponent.vue';

const localVue = createLocalVue();
localVue.use(Vuex);

describe('MyComponent', () => {
  let actions;
  let store;

  beforeEach(() => {
    actions = {
      incrementAsync: jest.fn()
    };
    store = new Vuex.Store({
      state: {
        count: 0
      },
      actions
    });
  });

  it('should call incrementAsync action with specific parameter', () => {
    const wrapper = shallowMount(MyComponent, { store, localVue });
    wrapper.vm.incrementCount(5);
    expect(actions.incrementAsync).toHaveBeenCalledWith(expect.anything(), 5);
  });
});