3G Eden
RSS简介
QUnit是一个强大的JavaScript单元测试框架。他可用于jQuery，jQuery UI和jQuery Mobile项目，以及任何使用JavaScript代码编写的项目的测试。
运行环境
-
任何Html和JavaScript编辑器（Visual Studio 2013）
-
从QUnit官方下载reference js和css文件
加入QUnit到单元测试
添加QUnit.js和QUnit.css到你要测试的HTML页面中。
|
1
2
3
|
<script src="//code.jquery.com/qunit/qunit-1.22.0.js"></script><link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-1.22.0.css"> |
创建需要进行单元测试的JavaScript类
将要进行单元测试的代码放到一个单独的js文件中（Calculations.js）：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
// Create Calculation class.var Calculation = function () { };// Add Addition to method to the Calculation class.Calculation.prototype.Add = function (a, b) { return a + b;};// Add Subtraction method to the Calculation class.Calculation.prototype.Substraction = function (a, b) { return a - b;};// Add Multiplication method to the Calculation class.Calculation.prototype.Multiplication = function (a, b) { return a * b;};// Add Division method to the Calculation class.Calculation.prototype.Division = function (a, b) { return a / b;}; |
为上面的方法创建一个单元测试用例
下面的代码就是上面JavaScript方法的单元测试用例，我们同样将它放到单独的一个js文件中（UnitTest.js）：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
// Instantiate Calculation class.var c = new Calculation();// Unit test for addition.QUnit.test("Addition Test", function (assert) { assert.ok(c.Add(2, 3) == "5", "Passed!");});// Unit test for subtraction.QUnit.test("Substraction Test", function (assert) { assert.ok(c.Substraction(3, 2) == "1", "Passed!");});// Unit test for division.QUnit.test("Division Test", function (assert) { assert.ok(c.Division(5, 5) == "1", "Passed!");});// Unit test for multiplication.QUnit.test("Multiplication Test", function (assert) { assert.ok(c.Multiplication(5, 5) == "25", "Passed!");}); |
在HTML代码中引用所有的js和css文件
在HTML代码中分别创建一个id为qunit、qunit-fixture的div标记。
|
1
2
3
4
5
6
|
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-1.22.0.css"><script src="~/Scripts/Calculations.js"></script><div id="qunit"></div><div id="qunit-fixture"></div><script src="//code.jquery.com/qunit/qunit-1.22.0.js"></script><script src="~/Scripts/UnitTest.js"></script> |
QUnit测试结果窗口
本文转自：开源中国社区 [http://www.oschina.net]
本文标题：使用 QUnit 进行 JavaScript 单元测试
本文地址：http://www.oschina.net/translate/unit-testing-javascript-classes-using-qunit
参与翻译：苍之涛, leoxu
英文原文：Unit Testing JavaScript Classes using QUnit
时间:2016-03-14 08:13
来源:开源中国社区
作者:oschina
原文链接
