您的位置:首页 > Web前端 > AngularJS

基于angularJS的前端自动化测试工具Protractor快速入门

2017-09-26 16:06 531 查看
1.官网

http://www.protractortest.org/#/

2.简介

Protractor是一个为Angular和AngularJS应用程序而生的端对端的测试框架,Protractor就像用户一样在真实的浏览器中去交互并运行你的测试程序。

(1)就像一个用户一样测试:

Protractor是基于WebDriverJS的,WebDriverJs就像一个用户一样能使用原生事件和特定的浏览器驱动去跟你的应用交互。

(2)为了测试Angular应用

Protractor支持Angular特定的定位器策略,允许你测试Angular的专门的元素而不需要在你的测试部分进行任何安装。

(3)自动等待

你不需要为你的测试添加等待和休眠,一旦网页完成了待定任务Protractor就能自动执行下一步测试,所以你不必担心去等待你的测试和网页同步。

3安装

准备环境:nodeJs和jdk

Protractor 5 is compatible withnodejs v6 and
newer.

Protractor works with AngularJS versions greater than1.0.6/1.1.4

文档:https://github.com/angular/protractor#compatibility

查看protractor的版本命令:protractor --version

查看node.js的版本命令:node --version

查看是否装java的命令:java -version(注意只有一个“-”)



通过nodeJS的npm来全局安装protractor:

npm install -g protractor








这句命令会安装两个命令行工具,protractor和webdriver-manager,安装完后可以尝试运行protractor --version这条命令确保protractor是否安装成功。webdriver-manager是一个辅助工具,能很轻松地获得Selenium 服务器运行实例。



通过这句命令下载必要的二进制文件:

webdriver-manager update





通过这句命令开启服务器:

webdriver-manager start






输完这句命令将会启动Selenium服务器,并且会输出一串信息日志,这个命令行窗口不要关闭,专门给来启服务器的,重新运行其他命令要重新打开一个命令行窗口,因为关闭之后服务器也会跟着关闭,也可以通过按ctrl+c关闭服务器。你的Protractor会发送请求给你本地的浏览器。你可以通过输入http://localhost:4444/wd/hub查看服务器的信息和状态。



4.写一个测试案例

打开命令行工具或者终端窗口,并且创建一个测试的文件。

Protractor需要两个文件去执行,一个spec文件和一个配置文件。

让我们用一个简单的例子开始,在AngularJS官网去导航todo list,并新增一一个的todo项在列表中。

新增todo-spec.js文件,并复制下面的代码保存:

describe('angularjs homepage todo list', function() {
it('should add a todo', function() {
browser.get('https://angularjs.org');

element(by.model('todoList.todoText')).sendKeys('write first protractor test');
element(by.css('[value="add"]')).click();

var todoList = element.all(by.repeater('todo in todoList.todos'));
expect(todoList.count()).toEqual(3);
expect(todoList.get(2).getText()).toEqual('write first protractor test');

// You wrote your first test, cross it off the list
todoList.get(2).element(by.css('input')).click();
var completedAmount = element.all(by.css('.done-true'));
expect(completedAmount.count()).toEqual(2);
});
});




describe和it语法是来自Jasmine框架,browser是通过Protractor全局创建的,用于浏览器级别的命令,例如用browser.get来导航某一网页。

5.配置

新建一个conf.js配置文件,并将下面代码复制到conf.js中:

exports.config = {
seleniumAddress: 'http://localhost:4444/wd/hub',
specs: ['todo-spec.js']
};




这个配置会告诉Protractor你的测试文件(specs)在哪里,哪儿去跟你的Selenium服务器(seleniumAddress)交流,它会使用所有其他的默认配置,谷歌浏览器是默认浏览器。

6.运行测试

新打开一个命令行程序现在通过这句命令运行测试:

protractor conf.js

你应该会看到谷歌浏览器被打开了,而且在AngularJS页面中导航到了todo列表,接下来关闭了它自己(这应该运行得非常快!)。

这个测试应该输出:1 test,3 assertions,0 failures.恭喜,你已经运行了你第一个Protractor测试!





7.学习更多

通过教程学习更多:

http://www.protractortest.org/#/tutorial

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: