配置用于测试的不同浏览器
测试 JavaScript 代码的一个推荐实践是将 JavaScript 源代码和测试代码放置在不同的文件夹中。对于 图 2 中的示例，我将 JavaScript 源文件夹命名为 "js-src"，将 JavaScript 测试文件夹命名为 "js-test"，它们都位于 "js" 父文件夹下。
▲JavaScript测试文件夹结构
组织好源和测试文件夹后，必须提供配置文件。默认情况下，JsTestDriver 运行程序会寻找名为 jsTestDriver.conf 的配置文件。您可以从命令行更改配置文件名称。清单 5 显示了 JsTestDriver 配置文件的内容。
JsTestDriver 配置文件内容代码
load:
- js-src/*.js
- js-test/*.js
配置文件采用 YAML 格式。server 指令指定测试服务器的地址，load 指令指出了将哪些 JavaScript 文件加载到浏览器中以及加载它们的顺序。
现在，我们将在 IE、Firefox 和 Safari 浏览器上运行测试用例类。
要运行测试用例类，需要启动服务器。您可以使用以下命令行启动 JsTestDriver 服务器：
"[IE Path]","[Safari Path]"
使用这个命令行，服务器将以 Port 9876 启动，捕获您的机器上的 Firefox、IE 和 Safari 浏览器。
启动并捕获浏览器后，可以通过以下命令行运行测试用例类：
运行命令后，您将看到第一轮结果，如 清单6（ 第一轮结果） 所示。
第一轮结果
Firefox 3.6.18 Windows: Run 3 tests (Passed: 0; Fails: 3; Errors 0) (8.00 ms)
ApplicationUtilTest.testValidateLoginFormBothEmpty failed (3.00 ms):
AssertError: Username is not validated correctly! expected "This field
is required" but was "" Error("Username is not validated correctly!
expected \"This field is required\" but was \"\"")@:0()@http://localhost
:9876/test/js-test/TestApplicationUtil.js:16
ApplicationUtilTest.testValidateLoginFormWithEmptyUserName failed (3.00 ms):
AssertError: Username is not validated correctly! expected "This field is
required" but was "" Error("Username is not validated correctly! expected
\"This field is required\" but was \"\"")@:0()@http://localhost:9876/test
/js-test/TestApplicationUtil.js:29
ApplicationUtilTest.testValidateLoginFormWithEmptyPassword failed (2.00 ms):
AssertError: Password is not validated correctly! expected "This field is
required" but was "" Error("Password is not validated correctly! expected
\"This field is required\" but was \"\"")@:0()@http://localhost:9876/test/
js-test/TestApplicationUtil.js:42
Safari 534.50 Windows: Run 3 tests (Passed: 3; Fails: 0; Errors 0) (2.00 ms)
Microsoft Internet Explorer 8.0 Windows: Run 3 tests (Passed: 3; Fails: 0;
Errors 0) (16.00 ms)
Tests failed: Tests failed. See log for details.
注意，在清单 6 中，主要问题出在 Firefox 上。测试在 Internet Explorer 和 Safari 上均可顺利运行。
修复 JavaScript 代码并重新运行测试用例
我们来修复损坏的 JavaScript 代码。我们将使用 innerHTML 替代 innerText。清单 7 显示了修复后的 ApplicationUtil 对象代码。
修复后的 ApplicationUtil 对象代码
appnamespace.ApplicationUtil = function() {};
appnamespace.ApplicationUtil.prototype.validateLoginForm = function(){
var error = true;
document.getElementById("usernameMessage").innerHTML = "";
document.getElementById("passwordMessage").innerHTML = "";
if (!document.getElementById("username").value) {
document.getElementById("usernameMessage").innerHTML =
"This field is required";
error = false;
}
if (!document.getElementById("password").value) {
document.getElementById("passwordMessage").innerHTML =
"This field is required";
error = false;
}
return error;
};
使用 --test all 命令行参数重新运行测试用例对象。清单 8 显示了第二轮运行结果。
第二轮运行结果
Firefox 3.6.18 Windows: Run 3 tests (Passed: 3; Fails: 0; Errors 0) (9.00 ms)
Safari 534.50 Windows: Run 3 tests (Passed: 3; Fails: 0; Errors 0) (5.00 ms)
Microsoft Internet Explorer 8.0 Windows: Run 3 tests (Passed: 3; Fails: 0; Errors 0)
(0.00 ms)
如清单 8（第二轮运行结果） 所示，JavaScript 代码现在在 IE、Firefox 和 Safari 上都能正常运行。
结束语
在本文中，您了解了如何使用一个最强大的 JavaScript 单元测试工具 (JsTestDriver) 在不同的浏览器上测试 JavaScript 应用程序代码。还了解了什么是 JsTestDriver，如何配置它，以及如何在 Web 应用程序中使用它来确保应用程序的 JavaScript 代码的质量和可靠性。
关于下载方法的信息：http://www.ibm.com/developerworks/cn/whichmethod.html
