我读了3遍vue-utils-test文档和jest文档,但我不知道如何准确地模拟vue组件中的vue混合并测试组件。
发布于 2021-03-14 21:14:43
我设法用下面这样的jest spies模拟了混入方法:
/// MyComponent.spec.js
describe('MyComponent', () => {
let wrapper
let localVue
let store
let spies = {}
beforeEach(async () => {
spies.mixinMethodName = jest.spyOn(MyComponent[1].methods, 'spies.mixinMethodName')
({ localVue, store } = (... custom factory ...)
wrapper = await shallowMount(MyComponent, { localVue, store })
})
it('check mixin methods calls', () => {
expect(spies.mixinMethodName).toHaveBeenCalled()
})
})
当然,spies
对象及其附加方法可以按您的意愿进行定制。
这种方法的缺点是它依赖于在实际Vue组件中输入的mixins的顺序。对于此示例,如下所示:
/// MyComponent.vue
<script>
export default {
components: { ...components... },
mixins: [mixin1, mixin2ToBeTested],
data () {}
....
}
</script>
发布于 2021-12-09 14:25:32
对于那些使用Vue 3和Vue Test Utils的人,您只需模拟单个方法,例如使用Jest。像往常一样传入myMixin
,然后监视要模拟的方法:
const wrapper = mount(Post, {
global: {
mixins: [myMixin],
},
} as any)
jest.spyOn(wrapper.vm, 'myMixinMethodToMock').mockImplementation()
请注意,Jest模拟它,而不关心该方法是否在mixin上,而不是Vue组件上。
https://stackoverflow.com/questions/47329261
复制相似问题