8

我目前正忙于用 jest 对 vue 组件的路由行为进行单元测试。离开组件时,Vue-router 的 'beforeRouteLeave' 导航守卫会运行一些逻辑。这个守卫在我的生产中运行的应用程序中被调用,但是当我尝试测试它时不会被调用。

我使用 jest 作为测试框架和 vue-test-utils 来挂载我的组件并使用 vue-router 设置本地 Vue 实例。

在这里您可以找到一个最小的工作示例(在 'src/components/HelloWorld.spec' 中测试):

https://codesandbox.io/s/72536ojvp6?module=%2Fsrc%2Fcomponents%2FHelloWorld.spec.js

为什么没有调用路由器挂钩,我怎样才能让它工作?提前致谢!

4

1 回答 1

0

对我来说,以下代码可以很好地测试 vue 路由器导航防护。

const beforeRouteUpdate = wrapper.vm.$options.beforeRouteUpdate[0];
let nextFun = jest.fn();

// in place wrapper.vm you can send any object you want bcz when we call beforeRouteUpdate it looses this context

beforeRouteUpdate.call(wrapper.vm , "toObj", "fromObj", nextFun); 

beforeRouteEnter 路由导航守卫 github

于 2020-04-16T13:47:13.613 回答