0

jQuery 用のプラグインを作成し、http://jqueryboilerplate.com/ のボイラープレート パターンを使用しました

内部には、次のコード スニペットがあります。

ShoppingcartPlugin.prototype = {
    bindButtons : function(){
         var self = this;
             $('.addtocart').on('click.shoppingCart', function(event){
                event.preventDefault();
                $('.product-size-wrong').addClass('hidden');
                $('.product-added').addClass('hidden');

                if(!self.validateForm())
                    return;

                self.updateProductDataInDOM(event);

                var b = self.addProduct(event);
                if(b){
                    self.addExtraProducts(event); //aanvullingen

                    self.updatePrices();
                    self.calculateWeight();
                    self.calculateDeposit();
                    $('.product-added').removeClass('hidden');
                }
                self.persist();

     });
         $("body").on("click.shoppingCart","a.removefromcart", function(event){
            self.logger("a.removefromcart clicked");
            event.preventDefault();
            self.removeProduct(event);
            self.updateCartTotalPrice();
            self.updatePrices();
            self.calculateWeight();
            self.calculateDeposit();
            event.stopPropagation();
        });
    }
}

これで、「a.removefromcart」要素のクリックをシミュレートする Jasmine テストケースが作成されました。その後、いくつかの Ajax 呼び出しをスパイして、結果が正しいかどうかを確認できます。

だから私はこれをやった:

describe('Removing products testsuite', function(){
    it('Should yield an empty cart, when the X is clicked in a cart with a single product', function(){
        $('#shoppingcart').shoppingCart();
        allProducts = {};

        $('.addtocart').click(); //simulate click, and adding a product

        expect($.ajax.calls[1].args[0].data.shoppingCart[0].quantity).toBe(1);
        expect($.ajax.calls[1].args[0].data.shoppingCart.length).toBe(1);       

        $('body').trigger('click.shoppingCart','a.removefromcart');

        console.log($.ajax.calls);
        expect($.ajax.calls[2].args[0].data.shoppingCart.length).toBe(0);
    });
});

クリックの最初のシミュレーションは (製品を追加するために) 機能しますが、削除はトリガーされません。つまり、'on' のコールバックが呼び出されることはありません。

実装は機能しますが、プラグインのこの部分に関するいくつかのテストケースが欲しいです。

私は正しいアプローチを取っていますか?.on コールバックが起動されるように、これをデバッグする方法について何か提案はありますか?

編集: $('a.removefromcart').on('click.shoppingCart', function(){...}); を使用したことに注意してください。、しかし、それには私が気に入らない副作用が他にもあるので、クリックのバインドを現在と同じに保つことをお勧めします。プログラムでトリガーしたいだけです。

4

1 に答える 1