如何在Vuejs单元测试中设置或测试。$ parent？

Posted 2021-04-03

在我的组件集中

data(){
categories: this.$parent.categories => which I set in main.js
}

代码文件main.js

import categories from '../config/categories';
new Vue({
    router,
    data: {
        categories: categories
}
});

我创建了1个功能单元测试

it(‘check component is a button’,() => {
const wrapper = shallow(FormSearch);
expect(wrapper.contains(‘button’)).toBe(true);
});

我运行测试然后显示错误：data（）中的错误：“TypeError：无法读取未定义的属性'类别'”如何修复它。帮我。

答案

为什么不直接将类别配置文件导入到组件中？

import Categories from '../config/categories'

那你的数据方法可以直接访问它：

data () { return { categories: Categories }}

你会发现更容易测试

另一答案

是的，谢谢你。我变了。我运行测试然后它发生错误其他

Cannot find module '../../config/categories' from 'mycomponet.vue'.

虽然。我在浏览器上运行项目运行良好。如何解决它。非常感谢你

另一答案

对于测试，您可以设置模拟数据以在测试时转义undefined错误。但它不是标准解决方案.....

it(‘check component is a button’,() => {
   const wrapper = shallow(FormSearch);
   let mockCategories = { // mock category data }
   wrapper.$parent = {
     categories: mockCategories
   }
   expect(wrapper.contains(‘button’)).toBe(true);
});