我正在尝试测试处理表单逻辑的“容器”组件。它使用vue-router和vuex商店派遣行动,以获得一个表格的详细信息。
我有以下未按预期工作的单元代码:
it('On route enter, it should dispatch an action to fetch form details', () => {
const getFormDetails = sinon.stub();
const store = new Vuex.Store({
actions: { getFormDetails }
});
const wrapper = shallowMount(MyComponent, { store });
wrapper.vm.$options.beforeRouteEnter[0]();
expect(getFormDetails.called).to.be.true;
});
Run Code Online (Sandbox Code Playgroud)
使用以下组件(删除所有内容,因为我认为它不相关(希望如此):
export default {
async beforeRouteEnter(to, from, next) {
await store.dispatch('getFormDetails');
next();
}
};
Run Code Online (Sandbox Code Playgroud)
我收到以下断言错误:
AssertionError: expected false to be true
我猜这是因为我没有在测试中安装路由器和localVue。我尝试按照步骤操作,但似乎无法让它调用beforeRouteEnter.
理想情况下,我希望为路由器注入一个起始路径,并对路由变化进行不同的测试。对于我的用例,我想根据基于路由器的路径的组件注入不同的道具/调度不同的动作。
我对 Vue 很陌生,如果我遗漏了一些非常明显的东西,我深表歉意,并提前感谢您的帮助!