我想测试一个Vue.js组件,但我失败了.简单地说,我正在设置一个组件属性,我想断言它设置正确.如果这很重要,模块将加载导出,并使用Webpack输出JS.
// component exports = module.exports = {}; module.exports = { data: function () { return { active: false }; },methods: { 'close': function () { console.log(this.active); // -> true this.active = false; console.log(this.active); // -> false } } }; // component-test var modal = require('../../resources/src/js/components/_component.js'); var assert = require('assert'); describe('close()',function () { beforeEach(function () { modal.data.active = true; }); it('should set modal to inactive',function () { console.log(modal.data.active); // -> true modal.methods.close(); console.log(modal.data.active); // -> true assert.equal(modal.data.active,false); }); });
解决方法
这应该会给你一个关于如何在测试时加载vue组件的提示;
var modalComponent = require('../../resources/src/js/components/_component.js'); var assert = require('assert'); //load the component with a vue instance vm = new Vue({ template: '<div><test v-ref:test-component></test></div>',components: { 'test': modalComponent } }).$mount(); var modal = vm.$refs.testComponent; describe('close()',function () { beforeEach(function () { modal.active = true; }); it('should set modal to inactive',function () { console.log(modal.active); // -> true modal.close(); console.log(modal.active); // -> false assert.equal(modal.active,false); }); });