首页 | 新闻 | 新品 | 文库 | 方案 | 视频 | 下载 | 商城 | 开发板 | 数据中心 | 座谈新版 | 培训 | 工具 | 博客 | 论坛 | 百科 | GEC | 活动 | 主题月 | 电子展
返回列表 回复 发帖

Intern - JavaScript 自动化测试也可以如此便捷(2)

Intern - JavaScript 自动化测试也可以如此便捷(2)

编写单元测试用例 FirstUnitTestModule在清单 6 中,已经指定了执行名为 FirstUnitTestModule 的单元测试模块。因此我们需要在 myproject/tests/文件夹下创建 unit 文件夹,新建 FirstFunctionalTestModule.js 文件。在 FirstUnitTestModule.js 中我们将添加测试用例来测试 dojo/base/_lang 模块的 isArray 和 isFunction 方法。
Intern 的测试模块是基于 AMD 的,首先引入测试模块的依赖项。
清单 7. 引入依赖项
1
2
3
4
5
6
7
define([
    'intern!object',
    'intern/chai!assert',
    'myDojo/_base/lang'
], function (registerSuite, assert, lang) {

});




其中 intern!object 定义了测试用例的接口形式。除了 intern!object 之外还有 intern!tdd 和 intern!bdd 可选。该模块定义了之后将以何种形式注册测试用例。
intern/chai!assert 为使用的断言 API。也可以选择 intern/chai!expect 或 intern/chai!should 来编写 BDD(Behavior Drive Development)风格的测试用例。
myDojo/_base/lang 为我们的待测模块。
接下来使用 intern!object 来注册测试用例。
清单 8. 单元测试用例
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
define([
    'intern!object',
    'intern/chai!assert',
    'myDojo/_base/lang'
], function (registerSuite, assert, lang) {
    registerSuite({
        name: 'lang',

        isArray: function () {
            var array1 = [1, 2, 3];
            var array2 = new Array(1, 2, 3);
            var array3 = {
                "length": 5
            };
            assert.equal(lang.isArray(array1), true);
            assert.equal(lang.isArray(array2), true);
            assert.equal(lang.isArray(array3), false);
        },
         
        isFunction: function () {
            var function1 = function(){
                // dummy function
            };
            var function2 = new Function('');
            var function3 = {};
            assert.equal(lang.isFunction(function1), true);
            assert.equal(lang.isFunction(function2), true);
            assert.equal(lang.isFunction(function3), false);
        }
    });
});




如清单 8 所示,我们注册了名为 lang 的 Test Suite,其中包含了两个分别名为 isArray 和 isFunction 的 Test Case。在这两个 Test Case 之中我们使用了 chai 的断言 API(chai API 细节请参见 )来判断 dojo/base/_lang 模块提供的 isArray 和 isFunction 方法能否正确判断变量的类型。
编写 Functional 测试用例 FirstFunctionalTestModule接下来编写清单 6 中指定的 FirstFunctionalTestModule 的 Functional 测试模块。在 myproject/tests/文件夹下创建 functoinal 文件夹,新建 FirstFunctionalTestModule.js 文件。在 FirstFunctionalTestModule.js 中我们将模拟用户的点击来测试 dijit/form/Select 控件是否会正确改变值。
首先引入测试模块的依赖项。
清单 9. 引入依赖项
1
2
3
4
5
6
define([
    'intern!object',
'intern/chai!assert'
], function (registerSuite, assert) {

});




然后注册测试用例。
清单 10. Functional 测试用例
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
define([
    'intern!object',
    'intern/chai!assert',
], function (registerSuite, assert) {
    registerSuite({
        name: 'Test dijit/form/Select',

        'Click Menu Item': function () {
            return this.remote
                .get('http://localhost/myproject/dojo/dijit/tests/form/test_Select.html')
                .setFindTimeout(5000)
                .findByCssSelector('body.claro')
                    .findById('s1')
                        .findByCssSelector('.dijitArrowButtonContainer')
                            .click()
                        .end()
                    .end()
                .end()
                .findById('dijit_MenuItem_3_text')
                    .click()
                .end()
                .findByName('s1')
                    .getAttribute("value")
                .then(function (value) {
                    assert.equal(value, 'FL');
                });
        }
    });
});




如清单 10 所示,我们注册了一个名为 Click Menu Item 的测试用例。在该测试用例中 this.remote 是一个 Leadfoot 命令对象。该对象提供了与 Selenium WebDriver API 一致的 API 来操作浏览器。
首先我们通过 this.remote 的 get 方法在浏览器中打开待测试的页面(该页面已包含在下载的 DojoToolkit 包中)。然后通过 setFindTimeout 方法来设置每次操作的时限。
紧接着通过三句 find 语句定位到 id 为 s1 的 dijit/form/Select 控件的下拉菜单键并调用 click 方法模拟用户点击。
注意,click 方法之后的三个 end 方法调用在于将之后 find 操作范围回溯到上一级以确保节点查找的正确性。
之后 findById('dijit_MenuItem_3_text')语句定位到选项值为 FL 的下拉菜单项,并通过 click 方法模拟点击。最后通过.findByName('s1')语句查找到该控件的 input 节点获取它的 value 属性,并使用断言判断其是否为 FL。
执行测试用例现在我们的测试用例已经准备好了,由于我们同时需要在本地执行普通单元测试与 Functional 测试用例,因此在执行之前还需要准备本地的 Selenium Server。
首先下载


新建 myproject/webdriver/文件夹并将下载的 selenium-server-standalone-x.x.x.jar(x 为版本号)文件以及 chromedriver 执行文件放到其中。
在命令行中,进入该文件夹并执行以下命令启动 Selenium Server (以 Windows 平台为例)。
清单 11. 启动 Selenium Server
1
java -jar selenium-server-standalone-2.37.0.jar -Dwebdriver.chrome.driver=chromedriver.exe




回到 myproject 文件夹,执行以下命令启动测试用例。
清单 12. 执行测试用例
1
node_modules\.bin\intern-runner config=tests\local_profile reporters=lcovhtml




清单 12 中的 config 参数为之前配置好的 local_profile.js 配置文件,reporter 参数指定了最终测试用例执行结果及测试覆盖率的输出格式(更多输出格式,参见 )。
在测试用例执行完毕后,myproject 文件夹下会自动生成 html-report 文件夹。打开 myproject\html-report\index.html 文件即可看到最终的测试报告。
图 2. 测试报告总结通过以上简单的几步我们就在 Intern 框架的帮助下编写了普通单元测试与 Functional 测试用例,并在本地搭建起了 JavaScript 自动化测试环境,最终得到了包含测试覆盖率的测试结果报告。
由于 Intern 框架的可插拔性,在实际项目中我们还可以将其与 Jenkins、Tarvis 等持续集成工具整合在一起,来确保整个项目的代码质量。
返回列表