はじめてのJsUnit
ダウンロードする
JsUnitを使用するためにまずすることは、JsUnitをダウンロードすることです。
ダウンロードは本家ページの右上の「download」というリンクから行うことができます。
今回私はjsunit2.2alpha11.zipというファイルをダウンロードしました。 これはバージョンアップごとにファイル名が変わっていくと思うので、異なるファイル名でも構いません。
ダウンロードが済んだら、解凍します。 解凍すると、「jsunit」というフォルダが入っていると思います。 この中にJsUnitを使うためのさまざまなファイルが入っています。
中には、JsUnitをサーバー上で動かすためのファイル等も含まれていて、 普通にJsUnitを使うだけなら必要のないものも入っています。
使う
まずはテスト対象のファイルを作成します。 今回はgetGreetという、'hello'という文字列を返すだけのmyLibrary.jsというJavaScriptのファイルを作成しました。
function getGreet() {
return 'hello';
}
次に、単体テストを記述するためのファイルを作成します。
単体テストを記述するためのファイルはHTMLファイルです。
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="application/xml; charset=UTF-8"/>
<meta http-equiv="Content-Style-Type" content="text/css"/>
<meta http-equiv="Content-Script-Type" content="text/javascript"/>
<meta name="Author" content="KenjiNagao"/>
<title>hello JsUnit</title>
<script type="text/javascript" src="./jsunit/app/jsUnitCore.js"></script>
<script type="text/javascript" src="./myLibrary.js"></script>
<script type="text/javascript">
//<![CDATA[
function testGetGreet() {
assertEquals('hello', getGreet());
}
//]]>
</script>
</head>
<body>
</body>
</html>
まず、jsunit/app/jsUnitCore.jsをインポートします。
<script type="text/javascript" src="./jsunit/app/jsUnitCore.js"></script>
の部分がそれです。 この時のscriptタグのsrc属性には、このHTMLファイルからの相対的なjsUnitCore.jsの位置を指定します。
先ほど作成したmyLibrary.jsをテストするので、このファイルもインポートしておきます。
<script type="text/javascript" src="./myLibrary.js"></script>
そしてテストを記述します。
<script type="text/javascript">
//<![CDATA[
function testGetGreet() {
assertEquals('hello', getGreet());
}
//]]>
</script>
この部分がテストのコードです。
(今回はDTD宣言がXHTMLなので、一応CDATA宣言を行っています。)
JsUnitのテストコードには制約があって
- テスト関数の関数名の先頭に"test"という文字列のついた名前を付ける
- テスト関数は引数を取らない
などです。
assertEquals()メソッドは、第一引数に期待する値を、第二引数にチェックする値を指定します。
今回はgetGreet()関数が'hello'という文字列を返していることをテストしているわけです。
この2つの引数が一致すればテストは成功、一致しなければ失敗します。
myLibrary.js(被テストコード)とmyLibraryTest.html(テストコード)が作成できたら、
次はjsunitというフォルダの直下に、testRunner.htmlというファイルがあるので、
これをブラウザで開きます。
すると、次のようなページが表示されます。
参照ボタンをクリックして、myLibraryTest.htmlを選び、Runボタンをクリックすると、テストが開始され、 Progress:バーが緑色になり、Runs:のカウントが1になります。 そうなればテストは成功です。 もしもバーが赤くなり、Errors:やFailures:のカウントが上がるようならテストは失敗です。