protractor的安装与基本使用教程
更新时间：2017年07月07日 09:26:03 作者：菠萝君
这篇文章主要给大家介绍了关于protractor安装与基本使用的相关资料，文中介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友们下面来一起看看吧。
前言
Protractor是一个建立在WebDriverJS基础上的端到端(E2E)的AngularJS JavaScript Web应用程序测试框架。Protractor全自动化真实的模拟用户在真正的浏览器中操作、运行并测试开发者的应用程序。下面就来一起看看关于protractor安装与基本使用的相关内容吧。
1、JDK的安装和环境的配置
关于JDK的安装配置这里就不说了，需要的朋友们可以参考这篇文章
2、npm protractor
npm install -g protractor
3、npm install protractor的依赖项
基于第二步下载到的文件，在命令行里面进入到nodejs ->protractor的目录
npm install
4、test工程
包括一个简单的angular的页面，一个配置文件和一个测试文件
配置文件protractor_conf.js代码：
/**
* Created by Administrator on 2015/4/24.
*/
exports.config = {
directConnect: true,
// Capabilities to be passed to the webdriver instance.
capabilities: {
'browserName': 'chrome'
},
// Spec patterns are relative to the current working directly when
// protractor is called.
specs: ['test.js'],
// Options to be passed to Jasmine-node.
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000
}
};
test.js文件代码
/**
* Created by Administrator on 2015/4/24.
*/
describe('angularjs homepage', function () {
it('should greet the named user', function () {
browser.get('http://localhost:63342/protractor/Index.html');
element(by.id('userName')).sendKeys(' Sparrow');
browser.sleep(4000);
});
});
Index.html的代码
<!DOCTYPE html>
<html data-ng-app="protractor">
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div data-ng-controller="myAppController">
{{userName}}
<input id="userName" data-ng-model="userName" />
</div>
</body>
<script src="lib/angular.min.js"></script>
<script>
var app = angular.module('protractor',[]);
app.controller('myAppController',['$scope',function($scope){
$scope.userName = 'Jackey';
}]);
</script>
</html>
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流，谢谢大家对脚本之家的支持。
您可能感兴趣的文章:
相关文章
这篇文章主要给大家介绍了关于AngularJS动态生成select下拉框的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用AngularJS具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧2019-11-11
这篇文章主要介绍了Angular路由ui-router配置详解，非常不错，具有一定得参考借鉴价值，需要的朋友参考下吧2018-08-08
这篇文章主要介绍了详解AngularJS中的作用域,是AngularJS学习中的基础知识,需要的朋友可以参考下2015-06-06
今天小编就为大家分享一篇angular将html代码输出为内容的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-09-09
Angular项目中$scope.$apply()方法的使用详解
这篇文章主要给大家介绍了关于Angular项目中$scope.$apply()方法使用的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用Angularjs具有一定的参考学习价值，需要的朋友们下面跟着小编一起来看看吧。2017-07-07
本篇文章主要介绍了AngulerJS学习之按需动态加载文件，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-02-02
上传图片需要引入插件ngFileUpload，使用bower安装方法，下面通过本文给大家介绍Angularjs上传图片实例详解，希望对大家有所帮助2017-08-08
本文主要讲解AngularJs bootstrap，这里整理了详细的资料及简单示例代码帮助大家学习或者参考，有需要的小伙伴看下2016-09-09
这篇文章主要为大家简单介绍了Angular.js如何从PHP读取后台数据，本文将Angular和PHP相结合，从后台读取数据，感兴趣的小伙伴们可以参考一下2016-03-03
这篇文章主要介绍了AngularJS中table表格基本操作,涉及AngularJS针对table表格元素与属性的相关动态操作技巧,需要的朋友可以参考下2017-10-10
最新评论