日期:2014-05-16  浏览次数:20368 次

如何用Qunit测试你的JavaScript代码

原文地址:如何用Qunit测试你的JavaScript代码

?

QUnit, 由jquery团队开发,是一个对JavasScript进行单元测试的很好的框架。在这篇指南中, 我将具体介绍什么是Qunit,以及为什么你要关心严格地测试你的代码。

?

什么是QUnit

QUnit 是一个非常强大的javascript单元测试框架,可以帮你调试代码。它是由 jQuery 团队的成员写的,而且是jQuery的官方测试套装。但QUnit一般是足以测试任何常规javascript代码,它甚至可能通过一些javascript引擎比如Rhino或V8来测试服务器端JavaScript。

如果你不熟悉“单元测试”的概念,请不要担心。这不是很难理解的:

在计算机编程中,单元测试(又称为模块测试)是针对程序模块(软件设计的最小单位)来进行正确性检验的测试工作。程序单元是应用的最小可测试部件。在过程化编程中,一个单元就是单个程序、函数、过程等;对于面向对象编程,最小单元就是方法,包括基类(超类)、抽象类、或者派生类(子类)中的方法。

引自维奇百科。简单地说,你为你的代码的每个功能写测试,如果所有这些测试都通过了,那么你可以肯定的是,代码没有缺陷(通常,还是由你的测试有多彻底而定)。

为什么你要测试你的代码

如果你以前从未写过任何单元测试,你可能直接将你的代码上到网站上,点击一会看看是否有什么问题出现,并且尝试去解决你所发现的问题,采用这种方法会有很多的问题。

首先,这是很腻烦的。点击事实上并不是一件轻松的工作,因为你不得不确保每样东西都被点到而且很有可能你错过了一个或两个。

其 次,你为测试做的每件事情是不能复用的,这意味着它很难回归。什么是回归?想像一下你写了一些代码并测试,修复了所有你发现的缺陷,然后发布。此时,一个 用户发送了一些关于新缺陷的反馈,并且需要一些新功能。你返回到代码中,修复这些新缺陷并增加新功能。接下来可能会发生的就是一些旧的缺陷又重现了,这就 叫“回归”。看,现在你还得再去点击一遍,而且有可能你还找不到这些旧的担担缺陷;即使你这么做,这还需要一段时间才能弄清楚你的问题是由回归引起的。使 用单元测试,你写测试去发现缺陷,一旦代码被修改,您通过测试再筛选一次。如果回归出现,一些测试一定会失败,你可以很容易地认出他们,知道哪部分代码包 含了错误。既然你知道你刚才修改了什么,就可以很容易地解决。

另外一个单元测试的优点,尤其是对于web开发来说: 它使跨浏览器兼容性测试很容易。仅仅在不同浏览器中运行你的测试案例就行,如果一个浏览器出现问题,你修复它并重新运行这些测试案例,确保不会在别的浏览 器引起回归,一旦全部通过测试,你可以肯定的说,所有的目标浏览器都支持。

我想提及一个John Resig的项目:TestSwarm。 它将Javascript单元测试带到了一个新的层次,通过使其分布,这是一个网站,其中包含很多测试案例,任何人都可以去那运行一些测试案例,然后返回结果会返回到服务器。通过这种方式,代码会非常迅速的在不同的浏览器进行测试,甚至不同的平台运行。

如何用QUnit写单元测试

那么,你如何正确地用QUnit写单元测试呢?首先,您需要设置一个测试环境:

01 <!DOCTYPE html>
02 <html>
03 <head>
04 ????<title>QUnit Test Suite</title>
05 ????<link rel="stylesheet" href="http://github.com/jquery/qunit/raw/master/qunit/qunit.css" type="text/css" media="screen">
06 ????<script type="text/javascript" src="http://github.com/jquery/qunit/raw/master/qunit/qunit.js"></script