Javascript单元测试框架QUnitjs详细介绍

什么是QUnitjs？

QUnitjs是JavaScript单元测试框架之一。它最初是为jQuery项目创建的，但是它已经发展成为一个独立的项目，并可以用于测试任何JavaScript代码。

QUnit提供了一组函数来编写测试，并提供了丰富的断言方法，方便开发人员编写测试用例并判断测试结果。它使用简单明了，并且易于集成到自动化构建过程中。

QUnit 如何使用？

1. 首先需要引入 qunit.js和qunit.css。

<!-- qunit样式 -->
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.16.0.css">
<!-- qunit js库 -->
<script src="https://code.jquery.com/qunit/qunit-2.16.0.js"></script>

1. 然后就可以开始编写测试用例了。

// 这是一个简单的测试用例
QUnit.test( "hello test", function( assert ) {
    assert.ok( 1 == "1", "Passed!" );
});

上面的代码定义了一个名为“hello test”的测试用例，并使用了一个断言，以确保数字1等于字符串"1"。如果该断言false，测试将失败并显示错误消息：“Failed:Expected [false] to be truthy.”

1. 运行测试用例

可以通过在浏览器中打开HTML测试页来手动运行QUnit测试用例。也可以在控制台中运行QUnit。

// 在控制台中运行QUnit测试用例
QUnit.test( "hello test", function( assert ) {
    assert.ok( 1 == "1", "Passed!" );
});

QUnit提供的丰富的断言方法

QUnit提供了丰富的断言方法，可以判断值的相等性、不相等性、布尔值、是否抛出异常等等。

下面是一些常用的断言方法：

• ok(value, [message])：断言 value 为真值（truthy），如果为假值（falsy）则测试失败。可以附加一个消息 message，用于标识该测试。

// 例子
QUnit.test("ok() test", function(assert) {
    assert.ok(1 == "1", "Passed!");
});

• equal(actual, expected, [message])：断言 actual 与 expected 引用的同一个对象（或者基本类型的值）进行比较。如果不相等则测试失败。message 参数同上。

//例子
QUnit.test("equal() test", function(assert) {
    assert.equal(1 + 2, 3, "Passed!");
});

• notEqual(actual, expected, [message])：断言 actual 不等于 expected，否则测试失败。此测试也可以使用 !equal() 实现。

//例子
QUnit.test("notEqual() test", function(assert) {
    assert.notEqual(1 + 2, 4, "Passed!");
});

• throws(fn, [expected], [message])：断言 fn 函数将抛出异常。可以通过提供expected来具体化预期的异常类型，否则将捕获所有异常。错误消息与上述相同。

//例子
QUnit.test("throws() test", function(assert) {
    assert.throws(function() {
        throw new Error("Oops!");
    }, "threw an error", "Passed!");
});

结论

QUnit是一个简单而且易于使用的JavaScript单元测试框架，具有易于阅读的测试代码以及丰富的断言方法。除了测试jQuery项目时的使用外，它还可以广泛应用于JavaScript应用程序的测试。