按照网上的教程来呢,一定是不好使的,这是常理。

所以必须要告诉你怎么使用Phantomjs……

这么用!

1.下载Phantomjs的压缩包并解压缩;

2.在bin目录(包含phantomjs.exe文件的目录)下,按住shift键并同时点击鼠标右键。(像我这么详细的说明才叫文档,否则一律视为装逼。)点击Open command window here:

3.如下图,输入phantomjs,然后输入要执行的js文件路径(可以将文件直接拖进命令行窗口),按回车:

至此PhantomJS就可以工作了。

然后我们要设置环境变量,也就是说要开始安装Phantomjs了,在windows下我的电脑中->右键properties->Advanced system settings->Environment variables->在system variables中找到Path这一变量,然后修改他的值,在结尾加上“;D:\phantomjs”。(前提是你要把下载的phantomjs解压缩到D盘路径下并且重命名为phantomjs,而且千万记住,要下载phantomjs1.9.X版本,不要下载2.0.X!因为我们后需要用到的casperjs是不兼容phantomjs 2.0以后的版本的,所以我们不能从官网下载phantomjs的最新版本,这里给出一个参考的下载phantomjs1.X版本的地址。)

我之所以要用phantomjs是为了实现web页面的功能自动化测试,所以这里还要安装一个叫CasperJS的工具,他能更好的辅佐PhantomJS进行网页功能测试。

接下来我们从CasperJS的官网下载CasperJS,这里我们假设解压缩到D盘,然后对文件夹进行重命名,修改Path环境变量(过程同上),在结尾加上“;D:\casperjs\bin”。至此,应如下图所示(注意黄色高亮部分):

然后一路OK保存设置。现在我们就已经在Windows下安装好phantomjs和casperjs了,我们现在来验证一下是否安装成功!

打开cmd,输入phantomjs --version以及casperjs --version分别查看他们的版本信息,如果版本信息能够查询成功,就说明已经安装成功,如下图:

至此我们就可以使用casperjs和phantomjs来编写脚本进行测试了。

话说回来,我当时之所以要学习casperjs是因为我发现通过phantomjs无法完成很多简单的事情,包括点击一个按钮(这里拿baidu做为例子):

// JavaScript source code
var page = require('webpage').create();
var address = 'http://www.baidu.com/';
var output = 'capture.jpeg'; page.open(address, function (status) {
if (status !== 'success') {
console.log('Unable to load address!');
} else
{
try
{
var url = page.url;
console.log('URL: ' + url);
page.evaluate(function () {
document.getElementById('kw').value = "translate";
//document.getElementById('su').click();
});
window.setTimeout(function () {
page.render(output, { format: 'jpeg', quality: '100' });
phantom.exit();
}, 200);
} catch (err)
{
console.log(err);
}
}
});

我要访问百度,在搜索框中输入translate,点击百度一下按钮进行search,然后对网页截个图。上文中注释掉的代码就是软肋,phantomjs做不到的地方。

于是我发起了博问虽然最终以自问自答的形式告终,显然我并没有得到什么实质性的建议,有人建议我用selenium(不得不说C#结合selenium确实是web功能测试利器),但我本次的目的是要研究基于phantomjs框架的web功能测试,而不是selenium。

后来我通过research,发现casperjs是个不错的基于phantomjs并且能够实现我所想达到的目的的这样一个工具。这是casperjs相关的API文档

经历了很久的爬坡,终于从深坑中出来,并掌握了这门基于Javascript框架的web UI自动化测试技术,途中经历了这样一个坑:

定位不到页面submit类型input按钮的问题,这里我拿baidu做了例子。我打开baidu首页,在输入框中输入“666666”,然后点击“百度一下”进行搜索。结果是:失败了。我可以输入“666666”但是click button却失败了。因为这是个在看不见的浏览器中进行的自动化测试,和selenium不一样。所以我没法看到为什么失败了,是不是元素还没加载完毕,我就点了呢?事实证明和这个是有关系的。我来验证是否点击成功的方法是截图,网页截图。在点击完按钮后我会截个图,来看一下,页面是否发生了跳转。就是这个地方出错了。点击完按钮之后马上截图是不行的!必须要登上个几秒,至于是几秒,自己试吧!这里我把我做的一个成功的用百度进行搜索的自动化用例贴出来,代码如下:

// JavaScript source code
var address = 'http://www.baidu.com/';
var output1 = 'D:\capture1.png';
var output2 = 'D:\capture2.png';
var casper = require('casper').create();
casper.start(address).then(function () {
this.evaluate(function() {
document.getElementById("kw").value = "666666";
});
this.then(function () {
this.thenClick('#su');
this.wait(10000).then(function () {
this.capture(output1);
});
this.then(function () {
this.evaluate(function () {
document.getElementById("kw").value = "tylan";
});
})
this.thenClick("#su");
this.wait(10000).then(function () {
this.capture(output2);
});
})
});
casper.run();

我分别在第一次搜索和第二次搜索之后截了图,如下:

第一次搜索后截图——

第二次搜索后截图——

以此证明了自动化的成功。代码中混合用到了phantomjs和casperjs框架中封装的api,合理的运用断言(可以用api中给的方法也可以自己写,和selenium一样),将可以运用phantomjs和casperjs实现基于javascript的web UI功能的自动化测试。

PhantomJS与CasperJS在Windows下的安装与使用的更多相关文章

  1. memcache的windows下的安装和简单使用

    原文:memcache的windows下的安装和简单使用 memcache是为了解决网站访问量大,数据库压力倍增的解决方案之一,由于其简单实用,很多站点现在都在使用memcache,但是memcach ...

  2. Windows下pry安装和配置

    Windows下pry安装和配置 pry是一个增强型的交互式命令行工具,比irb强大. 有自动完成功能,自动缩进,有颜色.有更强大的调试功能. pry 安装很简单. 在终端输入: gem instal ...

  3. Windows下虚拟机安装Mac OS X ----- VM12安装Mac OS X 10.11

    Windows下虚拟机安装Mac OS X -– VM12安装Mac OS X 10.11 随着Iphone在国内大行其道,越来越多的开发者涌入iOS开发大军 中,但都苦于没有苹果机,本文即将介绍WI ...

  4. Windows下memcache安装使用

    Windows下Memcache安装 随着时间的推移,网上现在能找到的在 Windows下安装 Memcache 的文档大多已经过时.雪峰这里再简要介绍一下当下最新版的安装和配置方法. Memcach ...

  5. Windows 下如何安装配置Snort视频教程

    Windows 下如何安装配置Snort视频教程: 第一步: http://www.tudou.com/programs/view/UUbIQCng360/ 第二部: http://www.tudou ...

  6. 在windows下完美安装GitHub

    笔者最近在Windows下安装GitHub,过程中遇到不少问题.现在把安装的详细步骤分享给大家,免得大家走弯路. 笔者安装了GitHub for Windows程序,一切都运行顺利.但事情没有结束,首 ...

  7. windows下Eclipse安装Perl插件教程

    windows下Eclipse安装Perl插件教程 想用eclipse编写perl.网上看了很多资料.但EPIC插件的下载连接都失效了.无奈,只好自己动手写个教程记录一下. 准备工作: 安装好Ecli ...

  8. Ruby入门--Linux/Windows下的安装、代码开发及Rails实战

    Ruby入门--Linux/Windows下的安装.代码开发及Rails实战 http://www.linuxidc.com/Linux/2014-04/100242.htm Ubuntu 13.04 ...

  9. mediawiki在windows下的安装

    mediawiki在windows下的安装 对于刚接触wiki的朋友们来说,配置一个服务器环境,安装并运行mediawiki是一件很麻烦的事情,在这里,我尽量用通俗易懂的语言,介绍mw(mediawi ...

随机推荐

  1. eclipse下java中凝视字体太小和xml中中文字体太小问题解决方法

    我们在win7下进行android应用开发.须要搭建对应的开发环境.如今普遍基本上都是eclipse+adt+sdk,在本人搭建完环境后,发现eclipse下.java中的凝视和xml中的中文字体变得 ...

  2. 〖Linux〗Qt+gsoap开发客户端程序,服务端地址设定的字符串转换处理

    之所以写出来,是由于经常因为这个问题屡屡丢面子.. 一般情况下,QString转换成(char*),我们一般直接使用: char *str = qstr->text().toLatin1().d ...

  3. Linux下编辑利器vim,vimrc,viminfo的高级用法

    1.ci" (由 change operator 和 text-object i" 组成) 这个命令会找到当前光标所在行的下一个 " 括起来的字符串,清除引号裏面的内容, ...

  4. beanUtils的用法

    举例1:使用BeanUtils工具封装用户提交的数据. public static void main(String[] args)throws Exception { // 模拟用户的输入的数据如下 ...

  5. 关于iOS 热更新(热修复)你必须知道的一种方法- JSPatch

    本文为转载文章 . 版权归原文所有. 原文链接:iOS 5分钟集成热修复(JSPatch) 前言 在iOS中有很多种热修复方案,在这里我就不一一介绍了 这里有一篇介绍热修复的文章:iOS中的HotFi ...

  6. leetcode185 Department Top Three Salaries

    Employee表存储员工姓名.员工所在公寓.员工工资 Department表存储公寓id 评选出各个公寓的工资前三名的员工. 遇到的问题如下: limit,in等语句不能用在嵌套select语句中, ...

  7. Java虚拟机学习 - 垃圾收集算法(3)

    跟踪收集器       跟踪收集器采用的为集中式的管理方式,全局记录对象之间的引用状态,执行时从一些列GC  Roots的对象做为起点,从这些节点向下开始进行搜索所有的引用链,当一个对象到GC  Ro ...

  8. Python练习笔记——利用递归求年龄,第五个比第四个大2岁...

    现在有五个人, 第五个人比第四个人大两岁,18 第四个人比第三个人大两岁,16 第三个人比第二个人大两岁,14 第二个人比第一个人大两岁,12 第一个人现10岁,                 10 ...

  9. 10条建议让你创建更好的jQuery插件(转载)

    为了避免重复造轮子,自己手动开发jquery 插件,让小组其他成员可以直接使用.学习开发中,看到Phillip Senn 写的 关于jquery 插件开发注意10点,转载之! ------------ ...

  10. Chrome 错误代码:ERR_UNSAFE_PORT

    最近在用Nginx发布多个站点测试,使用了87.88端口, 88端口访问正常,87端口就怎么也访问不了, 点击更多,提示错误代码:ERR_UNSAFE_PORT 不安全的端口?尼玛就只靠端口就能解决不 ...