Vuejs 2两个连通组件单元/集成测试

Question

我有2个Vuejs组件相互连接。第一个组件是更新第二个组件中的数据。集成测试的最佳方法是什么？我正在使用vuejs 2.

VoucherComponent：

import Store from '../store';
import Ajax from '../_helpers/ajax';
const Voucher =  {
name: 'voucher',
props: ['id'],
template: '',
data () {
    return {
        voucherCode: null,
        priceDetails: Store.priceDetails,
        vouchers: Store.vouchers
    }
},
beforeCreate() {
    Store.vouchers = []
},
methods: {
    validateVoucher() {

        let totalPrice      = Store.total;
        let vouchers        = this.vouchers;
        let voucherCode     = this.voucherCode;
        let id         = this.id;
        let priceDetails    = this.priceDetails;


        let voucher = new Ajax('/vouchers/redeem/' + voucherCode + '/' + id + '/' + totalPrice + '/', 'GET');
        if (!this.checkVoucherPriceDetails()) {
            voucher.ajaxCall(function (response) {
                if (!response.error) {
                    vouchers.push({
                        code: voucherCode,
                        value: parseFloat(response.data.discount).toFixed(2),
                        type: 'voucher',
                        name: 'voucher',
                        description: 'Your voucher code: ' + voucherCode
                    });

                    priceDetails.push({
                        code: voucherCode,
                        price: parseFloat((-1.00 * response.data.discount)).toFixed(2),
                        description: 'Your voucher code: ' + voucherCode,
                        type: 'voucher'
                    });

                } else {
                    return false;
                }
            });
        }
    },
    removeVoucher(voucher) {
        this.voucherCode = voucher.code;
        this.clearVouchersFromPriceDetails();
        var stringifyVoucher = JSON.stringify(voucher);
        for (var i = 0, len = this.vouchers.length; i < len; i++) {
            if (stringifyVoucher === JSON.stringify(this.vouchers[i])) {
                this.vouchers.splice(i, 1);
                break;
            }
        }
        // return true;
    },
    clearVouchersFromPriceDetails() {
        for (var i = this.priceDetails.length - 1; i >= 0; i--) {
            if (this.priceDetails[i].code === this.voucherCode) {
                this.priceDetails.splice(i, 1);
            }
        }
    },
    checkVoucherPriceDetails() {
        for (var i = this.priceDetails.length - 1; i >= 0; i--) {
            if (this.priceDetails[i].code === this.voucherCode) {
                return true;
            }
        }

        return false;
    }
},
mounted () {
    Store.debug && console.log("Init voucher component");
}
};


export default Voucher;

PriceDetailsComponent：

import Store from '../store';
const PriceDetails = {
name: 'price-details',
props: ['price','fee'],
data() {
    return {
        priceDetails: Store.priceDetails,
        store: Store
    }
},
created() {
    this.priceDetails.push({
        price: this.price.toFixed(2),
        description: "Buchung Preis",
        type: 'booking'
    });
    this.priceDetails.push({
        price: this.fee.toFixed(2),
        description: "Buchungsgebühren",
        type: 'booking_fee'
    });
},
computed: {
    totalPrice() {
        let total = 0.00;
        let insurancePrice = 0.00;
        for (var detailKey in this.priceDetails) {
            var detail = this.priceDetails[detailKey];
            total += parseFloat(detail.price);
            if (detail.type == 'insurance') {
                insurancePrice = detail.price;
            }
            this.store.total = total;
        }
        return parseFloat(total).toFixed(2);
    }
},
mounted() {
    Store.debug && console.log("Init price-details");
}
};
export default PriceDetails;

商店：

const Store = {
    debug: true,
    priceDetails: [],
    total: 0.00
};

export default Store;

非常感谢！