Question

我对Vue组件的单元测试很少。在大多数测试中，shallowMounted组件仅需要计算的属性。但是对于两个测试，我需要一个store（Vuex）实例。有没有一种方法可以将实例添加到已经浅薄的组件中？可能是下面的代码将有助于您理解。它只是一个例子。谢谢。

describe(('Vue component test') => {
  beforeEach(() => {
    wrapper = shallowMount(Component, {
      computed: {
        errors: () => null,
        isLoading: () => false,
      }
    })
  });

  describe('Test 1', => {
    it('is a vue instance', () => {
      expect(wrapper...);
    });
  });

  describe('Test 2' => {
    it('is a vue component', () => {
      expect(wrapper...);
    });
  })

  describe('Test with store instance', {
    // Add store(Vuex) instance to the `wrapper` defined inside beforeEach() above
    // Then use the wrapper
    expect(wrapper...);
  });
});

Answer 1

商店实例是什么意思？ Vuex.Store的实例？

如果是这样，您可以尝试执行以下操作：

import Vuex from 'vuex';

beforeEach(() => {

   const store = new Vuex.Store({
       // mock your store data here
   });

   wrapper = shallowMount(Component, { 
      store,
      // your other properties, e.g. computed 
   });
});

有没有一种方法可以将实例添加到vue-test-utils中已安装的Vue组件中？

1 个答案: