jQueryのためのテストツール QUnit でテスト駆動開発入門を写経する
QUnitの概要
QUnitはjQueryプロジェクトの為のユニットテストツールです。(QUnit - ABOUTより)有名な各種xUnitフレームワークよりチェックのための関数も少なく、シンプルに書けそうな感じです。そしてなによりブラウザ上でテストが走ります。
Using QUnitを見るとテストに必要なものがわかりますが、必要なファイルは、jquery.js, QUnitのテストランナー(testrunner.js)とスタイルシート, テスト対象のコードとテストコードです。
Moneyオブジェクトの例を写経
いきなりjQueryプラグインのテストとか心臓に悪そうなので、普通のテストをやってみます。(dollar.test.js)
ちなみにこのエントリーで完成したテストランナーはTDD By Sample Test Suiteで実行することができます。
test("Multiplication", function(){
var five = new Dollar(5);
five.times(2);
equals(five.amount, 10);
});
このテストコードはケント・ベック著「テスト駆動開発入門」(ピアソン・エデュケーション・2003)のMoneyオブジェクトの例をJavaScriptにしたものです。
さて、このコードをFirebugを有効にしたFirefoxで走らせると、テストは失敗し、2つのエラーになります。ただエラーになるだけでなく気の利いたメッセージを表示してくれました。
Test Multiplication died, exception and test follows
ReferenceError: Dollar is not defined message=Dollar is not defined
Dollarを実装しよう
エラーになってレッドバーが派手に表示されたことを確認したら、Dollarを実装していきます。(dollar.js)scriptタグも追加しましょう!
var Dollar = function(amount){
};
Javaのクラスの代わりにコンストラクタ関数を書くことにします。(newを付けて呼び出し、オブジェクトを生成する関数のことです)そしてまたテスト実行します
Test Multiplication died, exception and test follows
TypeError: five.times is not a function message=five.times is not a function
こんどはfive.timesが関数ではないと言われました。JavaScriptでは宣言していない変数はundefinedという値になってしまうので、こう言われてしまいます。そこでtimes関数を実装します。
var Dollar = function(amount){
};
Dollar.prototype.times = function(multiplier){
}
JavaやPHPのコードとは大分雰囲気が違いますが、これで、timesは変数Dollarに属する関数になりました。Firebugコンソールのエラーも消えたと思います。テスト結果を見てみると、、、
1. Multiplication (1, 0, 1)
1. failed, expected: 10 result: undefined
Tests completed in 5 milliseconds.
1 tests of 1 failed.
1つのテストのうち、1つが失敗と表示されます。最初に書いた、テストの「equals」の部分が失敗したようです。
test("Multiplication", function(){
var five = new Dollar(5);
five.times(2);
equals(five.amount, 10);
});
さて、テストにパスするように実装します。
var Dollar = function(amount){
this.amount = amount;
};
Dollar.prototype.times = function(multiplier){
this.amount = this.amount * multiplier;
}
テストを実行すると、成功し、グリーンバーが表示されたことと思います。(さきほども紹介しましたTDD By Sample Test Suiteで実行結果を見てください。)かけ算するためのクラスが実装できました。
まとめ
今日はjQueryのユニットテストツールのQUnitを試して、テスト駆動開発入門のコードをJavaScriptでほんのちょっとだけ実装してみました。
テスト駆動開発入門 Kent Beck 長瀬 嘉秀 テクノロジックアート ピアソンエデュケーション 2003-09 売り上げランキング : 149384 おすすめ平均 Amazonで詳しく見る by G-Tools |