qunit sap_QUnit高级概念：模块和配置

qunit sap

在过去的几周中，我在教程《 QUnit 入门》和《 如何在QUnit中测试异步代码》中介绍了QUnit的一些功能 。 我描述了如何设置QUnit测试框架以开始测试JavaScript项目，什么是断言，QUnit提供了哪些方法以及如何为同步或异步代码创建测试。

在本文中，我将讨论如何在模块中组织测试代码，以及如何使用框架公开的配置属性来调整QUnit以更好地满足您的需求。

在模块中组织QUnit

在较小的，更易于管理的部分中组织项目的能力并不是软件开发中的新概念。 开发人员一直致力于通过将代码库拆分为多个文件或模块来保持代码的简单性和组织性。 测试没有什么不同。 将测试保持有条理并且在多个模块中进行，尤其是在我们为大型项目编写测试时，这非常有用，通常可以增强其可维护性。

QUnit提供了一个名为QUnit.module()的方法，该方法使我们可以将测试分组到模块中。 该方法的签名如下所示：

QUnit.module(name[, lifecycle])

name参数是一个字符串，用于标识模块，而lifecycle是一个对象，其中包含两个可选函数，分别在每个测试之前（ setup ）和after（ teardown ）运行。

要指定哪些测试属于给定的模块，您无需对测试进行任何形式的包装，如下所示：

// No, it's not like that!
QUnit.module('My first module, {
setup: function() {},
teardown: function() {},
tests: function() {
// Tests here
}
});

如果测试是在调用QUnit.module()但在找到另一个调用QUnit.module()之前定义的，则它属于给定模块。 在下一个示例中，我们具有属于模块“模块1”的名为“测试1”和“测试2”的测试，以及属于“模块2”的另一个测试“测试3”。

// It's like that and that's the way it is
QUnit.module('Module 1');

QUnit.test('Test 1', function(assert) {
// assertions here
});

QUnit.test('Test 2', function(assert) {
// assertions here
})

QUnit.module('Module 2');

QUnit.test('Test 3', function(assert) {
// assertions here
});

理想情况下，模块名称表示项目的独立部分。 例如，jQuery库具有以下模块： ajax ， core ， css ， event ， selector等。

既然您对测试如何在模块中进行分组有了一个清晰的了解，让我们进一步了解setup和teardown功能。 假设您要对以下对象运行多次测试：

var myObj = {
name: 'Aurelio De Rosa',
items: []
};

你要确保执行测试之前，该items物业充满数值1 ， 2和3 。 另外，您还希望每次测试结束时，将从name中删除不是name或items所有其他属性。 可以通过以下代码实现这一目标：

QUnit.module('My module', {
setup: function() {
myObj.items = [1, 2, 3];
},
teardown: function() {
for (var prop in myObj) {
if (prop !== 'name' && prop !== 'items') {
delete myObj[prop];
}
}
}
});

QUnit.test('Test 1', function(assert) {
expect(2);

// Set a new property of the myObj object
myObj.color = 'red';

assert.strictEqual(myObj.items.length, 3, 'The setup function has pushed 3 elements');
assert.strictEqual(myObj.items, [1, 2, 3], 'The setup function has pushed the expected elements');
});

QUnit.test('Test 2', function(assert) {
expect(1);

assert.ok(!myObj.color, 'The teardown function removed the color property');
});

该示例的现场演示如下所示，也可以作为JSfiddle使用 。

现在，让我们看看如何在QUnit中创建自定义配置。

如何配置QUnit

QUnit框架公开了许多配置属性，我们可以对其进行修改，以更好地满足我们项目的需求。 该框架为大多数情况提供了默认配置，但是我们可以通过更新QUnit.config属性来对其进行调整。 该属性是一个包含以下属性的对象（按字母顺序报告）：

• altertitle ：一个布尔值，用于通过添加复选标记或“ x”来指定测试套件是通过还是失败，来启用（ true ）或禁用（ false ）QUnit更新测试页的标题。 默认值为true 。
• autostart ：一个布尔值，如果设置为false ，则指定您要通过调用QUnit.start()而不是在触发加载事件时QUnit.start()运行测试。 默认值为true 。
• hidepassed ：一个布尔值，用于指定通过的测试是隐藏的（ true ）还是不是隐藏的（ false ）。 默认值为false 。
• module ：一个字符串，指定要运行的单个模块。 默认值为undefined ，因此QUnit运行所有定义的模块。
• reorder ：一个布尔值，指示QUnit是否应该首先运行在先前执行中失败的测试（ true ）或不运行（ false ）。 默认值为true 。
• requireExpects ：一个布尔值，用于指定您是否要在已定义的每个测试中强制调用对requireExpects expect()的调用（ true ）与否（ false ）。 默认值为true 。
• testNumber ：一个数组，用于按订单号运行特定的测试块。 在加载测试块时设置顺序。 默认值为undefined 。
• testTimeout ：一个数字，指示执行所有测试将失败的最长时间。 默认值为undefined 。
• scrolltop ：一个布尔值，指定是否要避免QUnits转到页的顶部时，所有的测试都执行（ true ）否（ false ）。 默认值为true 。
• urlConfig ：一个数组，用于管理放置在QUnit工具栏中的表单控件。 通过扩展此数组，您可以添加自己的复选框并选择列表。

现在您知道可以修改哪些功能，让我们看看如何使用它们。 但是首先要记住的重要一点是，自定义配置必须在包含QUnitJavaScript文件之后但在定义测试之前编写。

假设您要迫使团队中的测试人员始终定义要执行的断言数量。 您还希望QUnit隐藏通过的测试，因为测试套件非常大。 最后，您要停止QUnit自动滚动到页面顶部。 在这种情况下，您可以编写：

<script src="qunit-1.15.0.js"></script>
<script>
QUnit.config.hidepassed = true;
QUnit.config.requireExpects = true;
QUnit.config.scrolltop = true;
</script>
<script>
QUnit.test('My test', function(assert) {
// assertions go here...
});
</script>

在此示例中，我们看到了基本的自定义配置。 您可以对其进行扩展，并创建一个非常适合您的项目的复杂项目。

结论

在本文中，我向您介绍了QUnit中的模块，并向您展示了如何创建自定义配置。 在第一部分中，我们讨论了如何使用QUnit.module()方法在QUnit中创建模块，并了解了框架如何将测试组在一起。 然后，我描述了如何创建在模块中的每个测试之前和之后运行的设置和拆卸功能。 在第二部分中，我列出了QUnit公开的所有属性，以更改其默认配置以更好地满足您项目的需要。

希望您喜欢本教程。 由于此以及我之前的文章，您现在可以开始使用QUnit测试基于JavaScript的项目。

翻译自: https://www.sitepoint.com/qunit-advanced-concepts-modules-configuration/

qunit sap