From Gossip@caterpillar

Ajax Gossip: 使用 JsUnit 撰寫測試

要使用JsUnit撰寫測試，您的頁面中必須包括jsUnitCore.js檔案，這放在JsUnit目錄中的app目錄中，而您想要測試的JavaScript必須撰寫在同一頁面之中，例如：

JsUnitTestEx-1.html

<!DOCTYPE html 
  PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
  "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=BIG5">
<title>JsUnit測試</title>
<script type="text/javascript" src="lib/jsunit/app/jsUnitCore.js"></script>
<script type="text/javascript">
function addTwoNumbers(value1, value2) {
    return value1 + value2;
}

function testValidArgs() { // 測試的函式要以test名稱作為開頭
    assertEquals("2 + 2 is 4", 4, addTwoNumbers(2, 2));
}

function testWithNegativeNumbers() { // 測試的函式要以test名稱作為開頭 
    assertEquals("negative numbers: -2 + -2 is -4", -4, 
    addTwoNumbers(-2, -2));
}
</script>
</head>
<body>
</body>
</html>

assertXXX方法是JsUnit提供的斷言測試函式，包括了：assert()、assertTrue()、assertFalse()、assertEquals()、assertNotEquals()、fail()等方法…

如果要測試的方法不一定以test作為開頭，您也許可以試著在頁面中加入exposeTestFunctionNames()函式，告知所要測試的函式名稱…

function exposeTestFunctionNames() {
    var tests = new Array(2);
    tests[0] = "testValidArgs";
    tests[1] = "testWithNegativeNumbers";
    return tests;
}

接下來您可以開啟JsUnit目錄下的testRunner.html，在當中的「瀏覽」選擇您的測試頁面，然後按下「Run」執行測試…

如果不想把JavaScript直接撰寫在頁面中，而想獨立為一個JavaScript檔案，例如…

JsUnitTestEx-2.js

function addTwoNumbers(value1, value2) {
    return value1 + value2;
}

JsUnitTestEx-2.html

<!DOCTYPE html 
  PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
  "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=BIG5">
<title>JsUnit測試</title>
<script type="text/javascript" src="lib/jsunit/app/jsUnitCore.js"></script>
<script type="text/javascript" src="JsUnitTestEx-2.js"></script>
<script type="text/javascript">
function testValidArgs() {
    assertEquals("2 + 2 is 4", 4, addTwoNumbers(2, 2));
}

function testWithNegativeNumbers() {
    assertEquals("negative numbers: -2 + -2 is -4", -4, 
    addTwoNumbers(-2, -2));
}
</script>
</head>
<body>
</body>
</html>