我有一个简单的Vue SFC,它可以为组件提供prop值。
<template>
<component :is="component" v-bind="stepProps" />
</template>
<script>
import { _ } from 'core'
export default {
name: 'SetupFlow',
props: {
type: {
type: String,
required: true
},
step: {
type: String,
required: true
},
stepProps: Object
},
computed: {
component () {
const camelCaseName = _.camelCase(this.step)
const name = camelCaseName.charAt(0).toUpperCase() + camelCaseName.slice(1)
return () => import(`@/components/ProfileSetup/GMB/${name}`)
}
}
}
</script>
在我的测试中,我只需要确保正在渲染导入的组件。到目前为止,这是我的测试文件:
import { createLocalVue, shallowMount } from '@vue/test-utils'
import SetupFlow from '@/components/ProfileSetup/SetupFlow'
const localVue = createLocalVue()
describe('SetupFlow.vue', () => {
let propsData
let stubs
beforeEach(() => {
propsData = {
type: 'GMB',
step: 'step-example' // this file does not exist, so I need to mock `import`
}
})
it('renders the given step component', async () => {
const wrapper = shallowMount(SetupFlow, { localVue, propsData })
})
})
这是运行测试时遇到的错误:
有什么想法可以模拟import
以便step-example
返回模拟vue组件吗?