protractor的安装与基本使用教程


Posted in Javascript onJuly 07, 2017

前言

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的安装与基本使用教程

配置文件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>

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
基于jquery的DIV随滚动条滚动而滚动的代码
Jul 20 Javascript
浅析js中取绝对值的2种方法
Jul 09 Javascript
用Jquery.load载入页面实现局部刷新
Jan 22 Javascript
Angular发布1.5正式版,专注于向Angular 2的过渡
Feb 18 Javascript
Bootstrap模态框禁用空白处点击关闭
Oct 20 Javascript
Vue数据驱动模拟实现3
Jan 11 Javascript
js实现一键复制功能
Mar 16 Javascript
jQuery实现点击关注和取消功能
Jul 03 jQuery
vue实现手机号码抽奖上下滚动动画示例
Oct 18 Javascript
js 索引下标之li集合绑定点击事件
Jan 12 Javascript
vue-cli V3.0版本的使用详解
Oct 24 Javascript
vue动画效果实现方法示例
Mar 18 Javascript
vue.js实例todoList项目
Jul 07 #Javascript
微信JSAPI Ticket接口签名详解
Jun 28 #Javascript
Angular.js自动化测试之protractor详解
Jul 07 #Javascript
vue.js全局API之nextTick全面解析
Jul 07 #Javascript
js浏览器滚动条卷去的高度scrolltop(实例讲解)
Jul 07 #Javascript
解决AjaxFileupload 上传时会出现连接重置的问题
Jul 07 #Javascript
基于rem的移动端响应式适配方案(详解)
Jul 07 #Javascript
You might like
PHP模块化安装教程
2016/06/01 PHP
php is_executable判断给定文件名是否可执行实例
2016/09/26 PHP
php生成毫秒时间戳的实例讲解
2017/09/22 PHP
PHP5.5新特性之yield理解与用法实例分析
2019/01/11 PHP
javascript 模拟JQuery的Ready方法实现并出现的问题
2009/12/06 Javascript
Javascript的一种模块模式
2010/09/08 Javascript
JS文本获得焦点清除文本文字的示例代码
2014/01/13 Javascript
基于jQuery实现的旋转彩圈实例
2015/06/26 Javascript
ES6新特性之函数的扩展实例详解
2017/04/01 Javascript
不得不知的ES6小技巧
2018/07/28 Javascript
python实现迭代法求方程组的根过程解析
2019/11/25 Javascript
原生js无缝轮播插件使用详解
2020/03/09 Javascript
如何解决vue在ios微信&quot;复制链接&quot;功能问题
2020/03/26 Javascript
Node.js API详解之 util模块用法实例分析
2020/05/09 Javascript
[05:05]给小松五分钟系列 第二期介绍为什么打DOTA2
2014/07/02 DOTA
跟老齐学Python之类的细节
2014/10/13 Python
python写入中英文字符串到文件的方法
2015/05/06 Python
Python中urllib+urllib2+cookielib模块编写爬虫实战
2016/01/20 Python
Python定义二叉树及4种遍历方法实例详解
2018/07/05 Python
python分批定量读取文件内容,输出到不同文件中的方法
2018/12/08 Python
python 实现在一张图中绘制一个小的子图方法
2019/07/07 Python
Python的pygame安装教程详解
2020/02/10 Python
logging level级别介绍
2020/02/21 Python
Python实现从N个数中找到最大的K个数
2020/04/02 Python
python GUI模拟实现计算器
2020/06/22 Python
Python基于pyjnius库实现访问java类
2020/07/31 Python
详解CSS3中nth-child与nth-of-type的区别
2017/01/05 HTML / CSS
美国最顶级的精品店之一:Hampden Clothing
2016/12/22 全球购物
七夕情人节促销方案
2014/06/07 职场文书
乒乓球兴趣小组活动总结
2014/07/08 职场文书
社团招新宣传语
2015/07/13 职场文书
安全教育日主题班会
2015/08/13 职场文书
运动会广播稿200字
2015/08/19 职场文书
担保公司2015年终工作总结
2015/10/14 职场文书
2019新员工试用期转正申请书3篇
2019/08/13 职场文书
MySQL子查询中order by不生效问题的解决方法
2021/08/02 MySQL