06
2013
06

Javascript单元测试框架Qunit和Jasmine的比较

Javascript的单元测试,其实之前用的不多,TDD培训之后一直想用在正式项目中,但却被一次次失败和太麻烦放弃。虽然麻烦但单元测试的重要性是公认的,好的单元测试能保证产品的质量。如何写Javascript的单元测试,后面面再写关于这块的文章。今天讨论Javascript单元测试的框架。

工欲行其事必先利其器,好的单元测试框架是TDD成功的一半。Javascript优秀的测试框架很多, 包括Jasmine,Qunit,JsTestDriver,JSUnit,Mocha等,当然你也可以写自己的单元测试框架,本文主角是Jasmine和Qunit。我之前一直用Qunit来做单元测试,Qunit在中国占有率是非常高的,我也不例外,而美国同事们已经用到Jasmine了,为了做一个更好的选型,决定对这两个框架做了一个小小的比较。


先看看作者对自己框架的描述:

Jörn Zaefferer( QUnit作者 ) : QUnit是一个JavaScript单元测试框架,主要用于在浏览器中运行单元测试。虽然这个项目从属于jQuery,但却不依赖于jQuery,也不依赖于浏览器DOM。因此你也可以在node.js或Rhino上使用。QUnit很容易学习,你只需在html页面中包含两个文件,不需要安装或者构建任何其他东西。最短的测试集只需要一个11行的html文件。


Davis Frank(Jasmine作者): Jasmine是一个 JavaScript测试框架,目的是将BDD风格引入JavaScript测试之中。至于区别嘛,我们的目标是BDD(相比标准的TDD),因此我们尽 力帮助开发人员编写比一般xUnit框架表达性更强,组织更好的代码。此外我们还力图减少依赖,这样你可以在node.js上使用Jasmine,也可以在浏览器或移动程序中使用。


1、Jasmine和Qunit报表比较

Qunit报表

image2013-5-23 17-9-56.png

Jasmine报表

image2013-5-23 17-10-2.png

从报表来看都非常精致,结果一目了然。Jasmine有子分组,而且分组很清晰,而Qunit可以在一个测试现在多个断言数。这是他们各自的优点,这块各有千秋。


2、Jasmine和Qunit的断言比较

Jamine,他有12种原生断言比较,同时我们可以很容易的定义自己的断言,这是一个很大的优点。

Qunit自带8种断言,当然你可以自己扩展,但相对比较麻烦,唯一优势是断言可以带自定义描述。

从断言比较这块来讲,Jasmine略带优势。


3、Jasmine和Qunit的分组(分模块)比较

Jasmine用describe()来进行分组和模块,它的优势是可以嵌套,也就是可以很好的区分子模块,非常明了使用的功能。

Qunit用module()进行分组,不能区分子木块。

从这块来函,Jasmine再下一城。


4、Jasmine和Qunit的测试比较

Jasmine只有it()一个用来操作测试的方法。

Qunit包含3个测试用的方法,这个比较多。多了异步测试的方法,而且expect()可以限制断言个数。

这块Qunit略丰富于Jasmine。


5、Jasmine和Qunit的异步控制

先看Jasmine的异步控制方法,很长,很麻烦,需要自己从新封装。

//其中player.openLibrary含异步调用
it('The music library should be opend', function() {
    var flag;
                                     
    runs(function() {
        flag = false;
        player.openLibrary(function() {
            flag = true;
        });
    });
    waitsFor(function() {
        return flag;
    }, "aaaaaaa", 500);
    runs(function() {
        expect(player.library.openLibrary).toEqual(true);
    });
});

再看Qunit的,很简单明了。

//其中player.openLibrary含异步调用
asyncTest('The music library should be opend', function() {
    player.openLibrary(function() {
        start();
        ok(player.library != null, 'The "player.library" should be not null.');
        ok(player.library.openLibrary === true, 'The music library should be opened');
    });
});
//或则
test('The music library should be opend', function() {
    stop();
    player.openLibrary(function() {
        start();
        ok(player.library != null, 'The "player.library" should be not null.');
        ok(player.library.openLibrary === true, 'The music library should be opened');
    });
});

异步控制测试来看Qunit更清晰明了。


6、Mock Clock和Spies

这是两个Jasmine独有的东西,非常好。我也非常喜欢这两个功能Mock Clock能让你Mock一个时间间隔(这里我们可以精确的测试我们的代码执行时间),Spies可以用你知道函数的被调用次数和调用的方式,这是Jasmine优越的地方。


7、市场占用额:Jasmine51%,Qunit31%,这是去年12月份的统计数据。


8、 集成和配置:这块也是非常重要的,这里Qunit和Jasmine都是可以集成到Jenskin和VS2012的,也都可以用来测试RequireJs.


9、数据装载和卸载:这块也是Qunit和Jasmine都可以实现的功能非常有用。


有了这些比较,我承认我更喜欢Jasmine了,以后改用Jasmine做Javascript测试了。


Jasmine官网:http://pivotal.github.io/jasmine/

Qunit官网:http://qunitjs.com/

Javascript测试框架汇总:http://en.wikipedia.org/wiki/List_of_unit_testing_frameworks#JavaScript


下面附上我之前的比较表

Jasmine
Qunit
Result
Assert

expect(x).toEqual(y)
compares objects or primitives x and y and passes if they are equivalent

expect(x).toBe(y)
compares objects or primitives x and y and passes if they are the same object

expect(x).toMatch(pattern)
compares x to string or regular expression pattern and passes if they match

expect(x).toBeDefined()
passes if x is not undefined

expect(x).toBeUndefined()
passes if x is undefined

expect(x).toBeNull()
passes if x is null

expect(x).toBeTruthy()
passes if x evaluates to true

expect(x).toBeFalsy()
passes if x evaluates to false

expect(x).toContain(y)
passes if array or string x contains y

expect(x).toBeLessThan(y)
passes if x is less than y

expect(x).toBeGreaterThan(y)
passes if x is greater than y

expect(function(){fn();}).toThrow(e)
passes if function fn throws exception e when executed

We can write custom matchers when you want to assert a more specific sort of expectation.


deepEqual()
A deep recursive comparison assertion, working on primitive types, arrays, objects, regular expressions, dates and functions.

equal()
A non-strict comparison assertion, roughly equivalent to JUnit assertEquals.

notDeepEqual()
An inverted deep recursive comparison assertion, working on primitive types, arrays, objects, regular expressions, dates and functions.

notEqual()
A non-strict comparison assertion, checking for inequality.

notStrictEqual()
A non-strict comparison assertion, checking for inequality.

ok()
A boolean assertion, equivalent to CommonJS’s assert.ok() and JUnit’s assertTrue(). Passes if the first argument is truthy.

strictEqual()
A strict type and value comparison assertion.

throws()
Assertion to test if a callback throws an exception when run.

Jasmine ≈ Qunit
Grouping

describe()
It can be setting sub group.

module()
Group related tests under a single label.
Jasmine > Qunit
Test

it()

It with two parameters: a string and a function.

Qunit can display number of assertions in a test

asyncTest()
Add an asynchronous test to run. The test must include a call to start().

expect()
Specify how many assertions are expected to run within a test.

test()
Add a test to run.

Jasmine ≈ Qunit
Asynchronous Control

runs()
Blocks by themselves simply run as if they were called directly.

waits()
The function works with runs() to provide a naive timeout before the next block is run

waitsFor()
Providing a better interface for pausing your spec until some other work has completed.

asyncTest()
Add an asynchronous test to run. The test must include a call to start().

start()
Start running tests again after the testrunner was stopped. See stop().

stop()
Stop the testrunner to wait for async tests to run. Call start() to continue.

Jasmine < Qunit
Mock and Spies

Providing mock and spies are good functions for unit test.

\Jasmine > Qunit
Market share45%31%Jasmine > Qunit
Test ReportJasmine reportQunit reportJasmine ≈ Qunit
Integrate VSYYJasmine ≈ Qunit
Integrate CIYYJasmine ≈ Qunit
Parameterized tests\plugins qunit-parameterizeJasmine < Qunit
Configuration with RequireJsYYJasmine ≈ Qunit
Setup and TeardownYYJasmine ≈ Qunit




« 上一篇下一篇 »

评论列表:

1.lester  2013/7/25 22:50:42 回复该留言
非常清楚的比較, 節省我不少時間!
讚!

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。