如何在单元测试期间使用vue-test-utils和jest模拟Vue Mixins？
如何在单元测试期间使用vue-test-utils和jest模拟Vue Mixins？
提问于 2017-11-16 20:05:43
我读了3遍vue-utils-test文档和jest文档，但我不知道如何准确地模拟vue组件中的vue混合并测试组件。
回答 2
Stack Overflow用户
发布于 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>Stack Overflow用户
发布于 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组件上。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/47329261
复制相关文章
相似问题