How do I integrate Vuex with Vue Test Utils?

How do I integrate Vuex with Vue Test Utils?

To integrate Vuex with Vue Test Utils, you need to create a Vuex store and pass it to your component during testing.

Can you show me a code example?

Sure! Here's a simple example:

import { createStore } from 'vuex';
import { mount } from '@vue/test-utils';
import MyComponent from '@/components/MyComponent.vue';

const store = createStore({
  state: { count: 0 },
  mutations: {
    increment(state) {
      state.count++;
    }
  }
});

const wrapper = mount(MyComponent, { store });

This sets up a Vuex store and mounts your component with it.

What if I want to test a Vuex action?

You can test Vuex actions by dispatching them in your test. For example:

await store.dispatch('increment');
expect(store.state.count).toBe(1);

Are there any best practices for testing with Vuex?

Yes! Some best practices include keeping your tests isolated, using mocks for external dependencies, and testing both state and actions.