Vue.js Bileşeninin Test Edilmesi

Question

Bir Vue.js bileşenini test etmek istiyorum ve bunun için başarısızım. Basitçe söylemek gerekirse, bir bileşen özelliği ayarlıyorum ve doğru şekilde ayarlandığını iddia etmek istiyorum. Bu önemliyse, modül ihracatla yüklenir ve JS Webpack kullanılarak çıkarılır.

// 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); 
    }); 
}); 

Answer 1

Bu, test sırasında vue bileşenlerinin nasıl yükleneceğine dair bir ipucu vermelidir;

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); 
    }); 
}); 

Answer 2

https://github.com/eddyerburgh/avoriaz Vue.js için resmi test kütüphanesi bileşenleri