Javascript 使用Qunit单元测试

时间 2019-12-06

标签 javascript 使用 qunit 单元测试栏目 JavaScript 繁體版

原文原文链接

QUnit环境配置

首先下载QUnit的开发包，解压后咱们只须要qunit目录下的qunit.css和qunit.js文件便可。而后建立一个HTML文件将这两个文件引用进来便可，HTML代码以下：css

  <!DOCTYPE html>
<html>
<head>
	<title></title>
<link href="qunit-1.12.0.css" rel="stylesheet" />
<script src="../js/json2.js"></script>
<script src="../js/jquery-2.0.2.min.js"></script>
<script src="qunit-1.12.0.js"></script>

</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
</body>
</html>

建议另外建两个和qunit同级的目录，src和test，分别用来放源代码和测试代码。而后把这些全部的代码都引入到上面的HTML文件中去。全部这些准备好后就能够享受QUnit单元测试的乐趣了。html

QUnit使用方法

QUnit的用法比较简单，API不是不少，全部的API也就16个左右。全部的API能够分为三类：Setup，Assertions，Asynchronous Testing，下面就分别对这些API作些介绍，约定：凡是用[]包起来的参数表示可选参数。jquery

Setup:

test( name, [expected], test )，表明QUnit中的一个测试，就是没添加一个测试就调用一次test()，name参数是要测试的名称，好比”加法函数”或”add”等，expected参数是可选参数，用来表示该测试函数的断言的数量，是个正整数，test参数是一个函数对象，全部的测试代码都应该包括在该函数里，一般这是一个匿名函数。例如：test(“add function”, 1, function() {equal(add(1, 2), 3);});
asyncTest( name, [expected], test ),表明QUnit中的一个异步测试，这个会在异步测试中，参数同上一个test( name, expected, test )
expect( amount ),用在测试函数中，用于声明测试断言的数量，这个函数和test( name, expected, test )的expected参数的做用是同样的，两个用一个便可，固然都不用也没有关系。主要做用就是检查你声明的个数和你写的断言的实际个数是否一致。
module( name, [lifecycle] )，这个函数主要用于测试函数的分组，你能够理解一个module函数是一个模块的意思，好比module(“validate”)表示后面的测试用例都是alidate相关的代码，或者module(“common.js”)，代表后面的测试用例都是common.js里面的代码，如何划分看我的理解啦，一个测试文件是能够写多个module的。name参数是分组或者模块的名称，lifecycle是可选参数，它是一个对象类型，能够设置setup和teardown回调函数，例如module(“common.js”, {setup:function(){},teardown: function() {} })，setup回调函数将会在module开始以前执行，好比能够为该module下面的测试代码作一些准备工做，teardown回调函数将会在该module的全部测试代码执行后执行，好比作一些清理还原工做等。
QUnit.init( )，用于初始化QUnit测试框架，一般这个函数是不须要咱们手工调用的。
QUnit.reset( )，重设函数，一般是在每一个test函数执行后由QUnit本身调用来重设整个QUnit测试环境，固然必要时咱们本身也能够调用它来复原，不过目前我尚未调用过它。

Assertions:

全部断言函数的message都是可选参数，能够是一段话来描述整个断言，这样在测试结果页面能够很清楚看出这个断言是干什么的，好比equal(add(1, 2), 3, “1加2应该等于3″)git

ok( state, [message] )，bool断言，参数state的值为true时表示经过，不然失败。
equal( actual, expected, [message] )，比较参数actual和expected是否相等，转化为JavaScript代码为if (actual == expected)，是不比较类型的。
notEqual( actual, expected, [message] )，比较两个参数不相等，转化为JavaScript代码为if (actual != expected)，是不比较类型的，不相等则经过，不然失败。
deepEqual( actual, expected, [message] )，主要用于数组和对象等类型的值是否相等，会递归遍历它们所包含的值是否相等。
notDeepEqual( actual, expected, [message] )，主要用于数组和对象等类型的值是否不相等，会递归遍历它们所包含的值是否不相等。
strictEqual( actual, expected, [message] )，比较参数actual和expected的值和类型是否相等，转化为JavaScript代码为if (actual === expected)，是须要比较1类型的。
notStrictEqual( actual, expected, [message] )，比较参数actual和expected的值和类型是否不相等，转化为JavaScript代码为if (actual !== expected)，是须要比较类型的。
raises( block, expected, [message] )，测试block函数是否抛出一个异常，抛出则经过，不抛则失败。block参数是咱们要测试的函数，expected参数是一个函数，是一个可选参数，用来验证第一个函数抛出的异常是不是咱们想要的。

Asynchronous Testing:

stop( [increment] )，中止测试的运行，由于在异步环境中，不中止的话就运行结束了，异步的回调都不会被处理，因此在异步测试时通常先把QUnit的test runner停下来。increment参数是增长中止的时间。
start( [decrement] )，当异步调用成功后就应该把中止的test runner启动起来让它接着往前跑了，decrement参数用来减小中止的时间。

异步测试的代码须要写在asyncTest( name, [expected], test )中，一个Ajax异步测试的例子：github

asyncTest("loginFromMobile interface", function () {
        //ajax test
        var requestUrl = "http://test.com";
        var paramCollection = {
            staffId: "99994",
            password: "123"
        };

        $.ajax({
            url: requestUrl,
            type: "post",
            data: paramCollection,

            success: function (response) {

                ok(!result.error);

                start();
            },
            error: function (data, status, e) {}
        });
});

与浏览器自动化测试工具集成的接口

QUnit额外提供了一些与浏览器自动化测试工具集成的接口，这些接口实现后会被QUnit自动调用，注意，这些接口是留着咱们开发人员本身来实现的。这里简单作些介绍：ajax

QUnit.log({ result, actual, expected, message })，这个接口会在每一个断言执行后调用，result值是断言是否经过，message是断言里的message参数。
QUnit.testStart({ name })，在每一个测试函数执行前调用，name参数是测试函数中的name参数值，这里的测试函数是指test()或者asyncTest()。
QUnit.testDone({ name, failed, passed, total })，在每一个测试函数结束后执行，name参数同上，failed参数是指失败断言的个数，passed参数是指成功断言的个数，total是指全部断言的个数。
QUnit.moduleStart({ name })，在每一个module后面全部的测试代码执行前调用，name参数是module(name)中name的值。
QUnit.moduleDone({ name, failed, passed, total })，在module下面全部的测试代码执行完以后执行，failed参数是指失败断言的个数，passed参数是指成功断言的个数，total是指全部断言的个数。
QUnit.begin()，在全部的测试代码调用以前运行。
QUnit.done({ failed, passed, total, runtime })，在全部的测试代码调用以后运行，failed参数是指失败断言的个数，passed参数是指成功断言的个数，total是指全部断言的个数，runtime代码全部代码的执行时间。