使用Nodejs+Protractor搭建测试环境
Protractor是一个end-to-end的测试框架,从网络上得到的答案是Protractor是作为Angular JS应用程序的测试框架。它的构建基于Selenium WebDriver之上,且围绕着Selenium WebDriver进行封装,因此,Protractor中包含的每一个feature对于Selenium WebDriver都是可用的。
至于为什么会强调Protractor作为 Angular JS 应用程序的测试框架,或许是因为它针对Angular JS 提供了一些新的定位策略及功能,来更好的支持Angular JS。这里是个人对其进行的猜测,而猜测的依据是Protractor提供了诸如 waitForAngular()方法。
这篇文章就来简单看下怎么搭建一个基于Protractor测试框架的测试环境,用来写我们的自动化测试代码。
第一步毫无疑问,安装Node.js,安装Node.js并不难,可以直接到 https://nodejs.org/en/ 网站上下载相应的安装包,这里选择的是windows的安装包:
上图高亮的npm package manager是我们安装Node.js最为重要的目的,当然,Add to PATH是帮助我们省去了配置变量的环节,也是很重要的,安装步骤不多赘述,如果图方便的话,闭上眼睛一路Next下去就好。
安装完成后,打开命令窗口,使用命令 "npm --version" 查看Node.js是否安装成功:
由于这里需要使用pratractor,所以需要使用命令 "npm install --global protractor" 或者 "npm install -g protractor" 全局安装protractor,为什么是全局安装而不是本地安装,因为我们这里只需要使用CLI(Command Line Interface) 而不需要用require将protractor包含进去,如果需要后者,则需要再在本地安装一次,当然,如果不放心,也完全可以将全局和本地都安装一次,以后如果需要用,就可以直接用了,这里作为例子来看,只需要全局安装即可。
由于前面说过,Protractor是基于Selenium WebDriver的,而Selenium WebDriver需要安装Java的JDK,因此这里也同样需要安装JDK, 安装完JDK之后,同样的,在command window中输入命令:webdriver-manager update
这时候,可以试着启用webdriver, 注意,如果这里是先做了webdriver-manager update操作,而直接输入 webdriver-manager start则会不成功,它会提示 java 不能识别,它既不是内部也不是外部命令。而紧接着才安装JDK的话,在相同的command window中也同样会持续这个提示,此时只需要重新开一个新的command window即可。
这时候可以发现,webdriver 启动了,接下来我们试着开始写case来看下是不是可以运行,这里选择的编译器为Visual Studio Code, 当然,个人也挺喜欢用IntelliJ IDEA~
先随便找一个目录创建一个文件夹,然后用Visual Studio Code打开,一般来说,写一个简单的测试用例只需要两个文件,一个configure文件,一个test case文件就可以了,不过考虑到测试数据的存放,公共方法的共享等等各种因素,渐渐的,我们的代码结构会随之而变化,这里不会讨论这些东西,但出于个人习惯,还是选择了三个文件,一个configure文件叫做conf.js, 一个test case文件叫做spec.js,这里还有一个文件叫做TestData.js,考虑到今后自己练手可能会用不同的网页,这个文件用来存在不同的测试网页。
先将三个文件创建出来,然后个人的习惯是先写TestData.js, 这个文件内容很简单,无非是存放一些URL,所以代码如下:
有了测试的URL, 我们就可以开始写test case了,这里的test case来自于stack overflow 的protractor的介绍文章中他人提供的例子:
这里第3行(hmm... 第1行其实可以不用空的,因为没必要)的目的就是为了能得到存放在TestData.js中的URL,同样的,如果以后会将一些被提取出来的公用方法存放在单独的文件中,而自己当前test case文件需要使用相应的方法,也需要使用 var xxx = require('xxx.js') 这样的语法。
最后要写的是最重要的conf.js文件,可以说,当环境搭建完成后,case是不是能够运行得起来,配置可全靠这个conf.js文件,不过不用担心,因为就目前这个例子来说,conf.js文件很好写:
对吧,确实好写,可是这个配置是什么意思呢?这个配置是告诉Protractor你的测试文件在什么地方以及你的Selenium 服务器在哪里。seleniumAddress就是指定Selenium的服务器,可是为什么是这个地址呢,hmm....写这篇文章之前我还真没想过,好像看到的只要是选择配置seleniumAddress的,配置里都是用这个网址的……点进去看到的如下图所示:
从http://localhost:4444 上来看,这个应该是本机预留给Selenium WebDriver的端口号,因此,这个selenium address应该会默认设置所有其他的配置。
好了,如果这个时候你的webdriver没有启动的话,使用上面介绍过的 webdriver-manager start命令让它run起来吧,确保selenium webdriver正在运行,然后在conf.js文件所在的目录中打开command window, 我们要来见证奇迹发生的时刻啦~
根据上面的配置,我们在打开的command window中输入命令: protractor conf.js --config=specs, 然后就静静地看着屏幕上出现的一幕幕精彩表演吧。
此时,如果一切都正常的话,电脑将会自行打开Chrome浏览器,然后输入我们指定的网址,完成我们在case中指定的操作并进行一系列的验证,之后浏览器关闭,结果显示在command window中,比如下图:
当然,这幅图说明的是case运行成功的情况,如果有不成功的情况,也会在command window中有一定的提示,这里没有标注任何log,所以我们看命令行显示看不出case到底做了什么,如果用log的方式一步步标注,那么,我们可以很清晰地知道case做了什么,哪一步通过顺利,哪一步出现了偏差……
到这里,其实本文就告一段落了,既验证了我们搭建的测试框架可用,也宣告了我们这条case的成功,不过,用心的读者们会发现一个问题,在我们的配置文件里,我们完全没有对浏览器进行指定,但是run case的时候,却自顾自地打开了Chrome,这是为什么呢?查找资料的时候,我们可能会看到说Protractor对Chrome的支持是所有浏览器中最佳的,但是不是就可以直接认为这个framework默认启用的浏览器是Chrome呢?
答案是肯定的~ Chrome is the default browser!
更多内容可以扫描下面二维码关注微信公众号: 倚楼听风雨的如月
使用Nodejs+Protractor搭建测试环境的更多相关文章
- LVS+keepalived快速搭建测试环境
#LVS+keepalived快速搭建测试环境 #LVS+keepalived快速搭建测试环境 #centos6 X64 # LVS 负载均衡模式:DR(直接路由) 192.168.18.31 mas ...
- 结合jenkins在Linux服务器搭建测试环境
何时使用: 测试过程中我们需要持续构建一个软件项目,为避免重复的手动下载.解压操作,我们需要搭建一个能够自动构建的测试环境,当代码有更新时,测试人员只需点一下[构建]即可拉取最新的代码进行测试(也可设 ...
- 在Linux上搭建测试环境常用命令(转自-测试小柚子)
一.搭建测试环境: 二.查看应用日志: (1)vivi/vim 原本是指修改文件,同时可以使用vi 日志文件名,打开日志文件(2)lessless命令是查看日志最常用的命令.用法:less 日志文件名 ...
- 用Jenkins自动化搭建测试环境-前奏
用Jenkins自动化搭建测试环境-前奏 1.安装 参考及启动:https://www.cnblogs.com/Eric15/articles/9828062.html 2.插件 新手一般按推荐安装即 ...
- 用docker搭建测试环境--docker的基本操作
上一篇文章中最后执行了docker pull centos的指令,经过一段时间的等待,会从hub.docker.com上下载docker官方最新的centos的images,接下来熟悉一下docker ...
- Linux常用命令及搭建测试环境
题外话:三大操作系统------Linux.Unix.Windows,Unix系统如常见的Mac OS,Linux的很多命令跟Unix是通用的,所以就有一些开发人猿喜欢用苹果的原因.Linux发行版特 ...
- Ubuntu18.04搭建测试环境
前言 说一下我的情况,之前由于我的云服务器数据库的root账号密码123456太简单,而在之前的博客中也泄露出了我的云服务器的IP地址,导致有人远程连接我的数据库,删除了项目数据库里的数据只剩下WAR ...
- python学习之正则表达式,StringIO模块,异常处理,搭建测试环境
python正则表达式 引入一个强大的匹配功能来匹配字符串 import re 正则表达式的表示类型raw string类型(原生字符串类型) r'sa\\/sad/asd'用r转为raw strin ...
- 阿里云EDAS在本地CentOS7.5 系统搭建测试环境,部署配置中心以及部署多个war包
参考阿里云的EDAS开发文档: 使用 Ali-Tomcat 开发应用 我们自己在内网搭建CentOS7 的测试环境,需要的资源如下: Ali-Tomcat Pandora 容器 EDAS 配置中心安装 ...
随机推荐
- 从 Android 静音看正确的查bug的姿势?
0.写在前面 没抢到小马哥的红包,无心回家了,回公司写篇文章安慰下自己TT..话说年关难过,bug多多,时间久了难免头昏脑热,不辨朝暮,难识乾坤...艾玛,扯远了,话说谁没踩过坑,可视大家都是如何从坑 ...
- 解析ASP.NET Mvc开发之EF延迟加载
目录: 1)从明源动力到创新工场这一路走来 2)解析ASP.NET WebForm和Mvc开发的区别 3)解析ASP.NET Mvc开发之查询数据实例 ------------------------ ...
- [Voice communications] 让音乐响起来
本系列文章主要是介绍 Web Audio API 的相关知识,由于该技术还处在 web 草案阶段(很多标准被提出来,至于取舍需要等待稳定版文档来确定,草案阶段的文档很多都会被再次编辑甚至重写.全部删除 ...
- Web 架构师的能力(转)
文/刘如鸿 最近和几个朋友在谈到时下流行的Web 2.0,也提到了其中最重要的角色——架构师.多方各有争执,不外乎是因为背景和视角的缘故,包括架构一词,本身就从建筑学借鉴而来,至于架构师,则可以 简单 ...
- Unity3D热更新全书-脚本(四) 用C#LightEvil搭建实际开发使用的脚本框架
C#LightEvil之前提供了很多和Unity结合的例子,都是采用把脚本文件放置在StreamingAssets中的方法. 这样可以利用Unity的特性,放在这个目录中的CS文件会被编译器编译,我们 ...
- CSS样式重置
;;;;;;;;;; } input, select { vertical-align:middle; }
- 虚拟化平台cloudstack(8)——从UI开始
UI ucloudstack采用的是前后端分离的架构,就是说前端可以选择使用web.swing甚至其它的界面,都可以. 我们来看cloudstack的UI信息吧,所有的cloudstack的UI都在{ ...
- Azure China (10) 使用Azure China SAS Token
<Windows Azure Platform 系列文章目录> 本文介绍的是国内由世纪互联运维的Azure China 注意:本文介绍的是Azure China Storage Priva ...
- 302 Moved Temporarily
这个就是表示 重定向!! 不过,302在不同HTTP协议下的状态信息不同. Moved temporarily (redirect) 你所连接的页面进行了Redirect Found 类似于301,但 ...
- 开发人员应该对IIS理论层的知识了解的多一些~第四讲 HttpModule中的几大事件
返回目录 本文主要介绍HttpModule,它在一个网页请求过程中是一个怎样的过程是我们要知道的,在网页加载过程中HttpModule在何时被执行也是我们要知道的,以及,HttpModule在网页请求 ...