我正在对Vue组件进行单元测试,并且正在测试以下action
方法:
/* COMPONENT */
methods: {
action (options) {
if (options.hook) {
return new Promise((resolve, reject) => {
resolve(options.hook())
})
.then(function (resolvedHookOptions = {}) {
const route = resolvedHookOptions.route || options.route
this.$router.push(route)
})
.catch(err => { console.log('TODO: how to handle err', err) })
} else {
this.$router.push(options.route)
}
}
}
我将Jest用作测试运行程序,并对该组件和基础操作方法进行以下测试:
/* TEST */
import { createLocalVue, shallowMount } from '@vue/test-utils'
import Vue from 'vue'
import ActionRow from '@/components/ActionRow/ActionRow'
import VueRouter from 'vue-router'
....
it('calls the action method with no arguments', () => {
const localVue = createLocalVue()
localVue.use(VueRouter)
const router = new VueRouter()
const wrapper = shallowMount(ActionRow, {
localVue,
router
})
/* NOTE: I also call this method with a mock options object
for another test but it is omitted for the sake of brevity */
wrapper.vm.action({})
})
这是返回的错误:
出于好奇的缘故,以下是this
日志中的一些摘要,在此之前。$ router.push被调用。我认为该信息不足以进行分析,但是如果有人发现不对劲,请通知我:
VueComponent {
...
_routerRoot: [Circular],
_router:
VueRouter {
app: [Circular],
apps: [Array],
options: {},
beforeHooks: [],
resolveHooks: [],
afterHooks: [],
matcher: [Object],
fallback: false,
mode: 'hash',
history: [Object] },
_route: [Getter/Setter],
__emitted: {},
__emittedByOrder: [],
'$emit': [Function],
_watchers: [ [Object], [Object], [Object] ],
_props:
{ backText: [Getter/Setter],
backAction: [Getter/Setter],
cancelText: [Getter/Setter],
cancelAction: [Getter/Setter],
saveAndExitText: [Getter/Setter],
saveAndExitAction: [Getter/Setter],
continueText: [Getter/Setter],
continueAction: [Getter/Setter],
showCancel: [Getter/Setter],
disableContinue: [Getter/Setter] },
action: [Function: bound action]
}