我一直在浏览https://vue-test-utils.vuejs.org/guides/#testing-key-mouse-and-other-dom-events以了解如何使用 Jest 结合 vue-test- 编写测试实用程序。但是,这些示例都使用了shallowMount
您安装组件的位置,但我想避免这种情况,因为我使用 GUI 测试来测试实际组件。
但是,如果没有组件,我会遇到问题。在 vue-test-utils 的示例中,它们用于shallowMount
注入商店,但由于我没有这样做,我无法访问我的商店,这意味着我的状态、我的 getter 等在测试时都是未定义的。
我的商店测试文件myStore.spec.js
:
import { createLocalVue } from '@vue/test-utils';
import myStore from './myStore';
import Vuex from 'vuex';
const localVue = createLocalVue();
localVue.use(Vuex);
describe('myStore tests', () => {
let actions;
let getters;
let store;
beforeEach(() => {
actions = {
setInUse: jest.fn(),
};
getters = {
isInUse: () => false,
};
store = new Vuex.Store({
modules: {
myStore: {
state: {
isInUse: false,
},
actions,
getters: myStore.getters,
},
},
});
});
it('example test', () => {
actions.setInUse(true);
expect(getters.isInUse(state)).toBeTruthy();
});
});
运行此测试时的错误之一是:state is not defined
.
我哪里错了?我应该如何在我的测试中访问我的商店?理想情况下,我想将我的测试存储设置为与我从中导入的相同myStore
,但我不确定这是否有效?