JavaScriptの動作テストをしてみたい人へ!QUnitを使ったwebサービスのテスト方法 (2/2)

では2回目です。 今回は始めっからテストしていきます。

テスト方法

大まかな流れ：

1. Snowball(あなたのテストしたいもの)の動作に必要なものを用意する
2. テストする
3. 余分なものをそぎおとす

ではまずは1の、「Snowball(あなたのテストしたいもの)の動作に必要なものを用意する」をやります。 始めにSnowballのhtmlで動作に必要なところ(#boardという要素)をQUnitのtestというフォルダ内のindex.htmlに貼付けます。 とりあえずこれでOKです。あとでいろいろとアップデートしたときの対策などは練るので心配しないでください。

次に、2の「テストする」です。 テストは前回のとあわせて、自分にあうように作ってみてください。 とくに説明はないです。

最後に3の「余分なものをそぎおとす」です。 QUnitのtest内のindex.htmlを実行すると、1でできたものが残っていると思います。 これがあると嫌だなという人だけやってください。 やり方は最後のテストのところに消すコードを書くだけです。

終わりに

なんだかだいぶぐだぐだになってしまいましたねw。 1が一番言いたかったです。 というか、1ができればあとはほとんどできると思います。

おまけ

アップデートの確認はこちらのコードです。

module("update")
$(function(){
    var $clone=String($(1で貼付けたところ).html());
    test("update",function(){
        var $board=$("<div/>").load("//pandanoir.web.fc2.com/snowball/snowball.html #board(1で貼付けたもの)");
        stop();
        setTimeout(function(){
            start();
            equal($clone.replace(/    /g,""),$board.children().unwrap().html().replace(/  /g,""),"Async");
        },500)
    })
})

こんな感じです。 500ってところは、エラーがでるようなら数値を大きくしてください。 100などで大丈夫な場合もあります。 この辺は調整してください。