· 2 min read
Screencast: JavaScript mit Jasmine testen
Download:
Download(24.8 MB, 15:20) Alternativer Download für iPod & Apple TV(25.3 MB, 15:20)
Resourcen:
Quellcode:
[bash] bundle rails g jasmine:install rake jasmine rake jasmine:ci curl http://cloud.github.com/downloads/velesin/jasmine-jquery/jasmine-jquery-1.2.0.js > spec/javascripts/helpers/jasmine_jquery-1.2.0.js [/bash]
[ruby] # Gemfile gem ‘jasmine’, :group => [:development, :test] [/ruby]
[javascript] /* credit_card_spec.js */
describe(“CreditCard”, function() { it(“cleans number by removing spaces and dashes”, function() { expect(CreditCard.cleanNumber(“123 4-5”)).toEqual(“12345”); }); it(“validates based on mod 10”, function() { expect(CreditCard.validNumber(“4111 1111-11111111”)).toBeTruthy(); expect(CreditCard.validNumber(“4111111111111121”)).toBeFalsy(); }); it(“validates when text field loses focus”, function() { loadFixtures(“order_form.html”); $(“#card_number”).validateCreditCardNumber(); $(“#card_number”).val(“123”); $(“#card_number”).blur(); expect($(“#card_number_error”)).toHaveText(“Invalid credit card number.”); $(“#card_number”).val(“4111 1111-11111111”); $(“#card_number”).blur(); expect($(“#card_number_error”)).toHaveText(""); }); });
/* credit_card.js */ var CreditCard = { cleanNumber: function(number) { return number.replace(/[- ]/g, ""); }, validNumber: function(number) { var total = 0; number = this.cleanNumber(number); for (var i=number.length-1; i >= 0; i—) { var n = parseInt(number[i]); if ((i+number.length) % 2 == 0) { n = n*2 > 9 ? n*2 - 9 : n*2; } total += n; }; return total % 10 == 0; } };
(function($){ $.fn.validateCreditCardNumber = function() { return this.each(function() { $(this).blur(function() { if (!CreditCard.validNumber(this.value)) { $(”#” + this.id + “_error”).text(“Invalid credit card number.”); } else { $(”#” + this.id + “_error”).text(""); } }); }); }; })(jQuery);
/* applicaiton.js */ $(function() { $(“#order_credit_card_number”).validateCreditCardNumber(); }); [/javascript]
[html] <%= f.text_field :credit_card_number %> [/html]