高效JavaScript单元测试
一个损坏的JavaScript代码示例

Web应用程序面临的一个最大挑战是支持不同版本的Web浏览器。能在Safari上运行的JavaScript代码不一定能在Windows? Internet Explorer (IE)、Firefox或Google Chrome上运行。这个挑战的根源是呈现层中的JavaScript代码从一开始就没有进行测试。如果没有对代码进行单元测试，那么在升级或支持新浏览器后，组织可能需要花钱反复测试Web应用程序。本文将展示如何通过高效的JavaScript代码单元测试降低测试成本。

一个常见用例是登录表单JavaScript验证。考虑清单1中的表单。

清单 1.登录表单

?<FORM> ?    <table> ?        <tr> ?            <td>Username</td> ?            <td><input type="text" id="username"/></td> ?            <td><span id="usernameMessage"></span></td> ?        </tr> ?        <tr> ?            <td>Password</td> ?            <td><input type="password" id="password"/></td> ?            <td><span id="passwordMessage"></span></td> ?        </tr>     ?        <tr> ?            <td><input type="button" onclick="new appnamespace.  ?            ApplicationUtil().validateLoginForm()" value="Submit"/></td> ?        </tr> ?    </table> ?</FORM> 这个表单很简单，仅包含用户名和密码字段。单击提交按钮时，将通过ApplicationUtil执行一个特定的表单验证。以下是负责验证HTML表单的JavaScript对象。清单2显示了ApplicationUtil对象的代码。

清单 2.损坏的ApplicationUtil对象代

?appnamespace = {};  ? ?appnamespace.ApplicationUtil = function() {};  ? ?appnamespace.ApplicationUtil.prototype.validateLoginForm =  function(){  ?    var error = true;  ?    document.getElementById("usernameMessage").innerText = "";  ?    document.getElementById("passwordMessage").innerText = "";    ? ?    if (!document.getElementById("username").value) {  ?        document.getElementById("usernameMessage").innerText =   ?        "This field is required";  ?        error = false;  ?    }  ?      ?    if (!document.getElementById("password").value) {  ?        document.getElementById("passwordMessage").innerText =   ?        "This field is required";  ?        error = false;  ?    }         ? ?    return error;         ?}; 在清单 2中，ApplicationUtil对象提供一个简单验证：用户名和密码字段都已填充。如果某个字段为空，就会显示一条错误消息：This field is required。

上面的代码能够在Internet Explorer 8和Safari 5.1上工作，但无法在 Firefox 3.6 上工作，原因是Firefox不支持innerText属性。通常，（上述代码和其他类似JavaScript代码中的）主要问题是不容易发现编写的JavaScript代码是不是跨浏览器兼容的。

这个问题的一个解决方案是进行自动化单元测试，检查代码是不是跨浏览器兼容。

JsTestDriver

JsTestDriver library是最好的JavaScript单元测试框架之一，它为JavaScript代码提供了跨浏览器测试。

捕获不同的浏览器之后，服务器会负责将JavaScript测试用例运行程序代码加载到浏览器中。可以通过命令行捕获浏览器，也可以通过将浏览器指向服务器URL来捕获浏览器。一旦捕获到浏览器，该浏览器就被称为从属浏览器。服务器可以加载JavaScript代码，在每个浏览器上执行测试用例，然后将结果返回给客户端。

客户端（命令行）需要以下两个主要项目：

?JavaScript文件，即源文件和测试文件
?配置文件，用于组织源文件和测试文件的加载
这个架构比较灵活，允许单个服务器从网络中的其他机器捕获任意数量的浏览器。例如，如果您的代码在Linux上运行但您想针对另一个Windows