前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

PPT更详尽：F2etest兼容性平台&UIrecorder脚本录制回放

本文参考：http://shaofan.org/f2etest/，https://www.jianshu.com/p/b668623f22d0，并对其中很多坑点进行填平，部署WebDriver云攻略未在此文中描述，继续学习可下载PPT或参考上面两篇文章。

前言

前面介绍过前端自动化测试之UI Recorder，其中webdriver server是单机的方式，如果是自己测试，或者单个浏览器测试没什么问题，如果是部门需要多浏览器多人测试的话，就无法满足需求了。

今天介绍一款阿里巴巴出品的多浏览器测试整体解决方案，详细介绍查看官方介绍F2etest

准备工作

Windows Server 2008 R2 with Service Pack 1 (x64)
CentOS-6.8-x86_64-bin-DVD
F2etest
mysql、jdk、nodejs密码ni62

其中WindowsServer2008用来部署webdriver server，可以是集群，这里只部署一台机器，集群部署方式和一台部署都是一样的方法，下面会说明

CentOS主要用来部署guacamole服务，用来通过f2etest-web网页端进行远程桌面登陆windows server进行管理和查看

上面两个操作系统是电驴链接和磁力链接，直接复制到迅雷即可下载

mysql、jdk等工具我放到百度网盘了需要的可以下载直接使用

f2etest源码下载方式：

命令行 git clone https://github.com/alibaba/f2etest.git

前提是有git环境

链接下载：https://github.com/alibaba/f2etest/archive/master.zip

安装虚拟机

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

这里我已经安装好了两台虚拟机，初始化好后就可以进行下一步了，这里网络建议使用桥接模式，免得出现各种各样的问题。

其中

Centos IP:192.168.10.105

Windows IP:192.168.10.106

安装f2etest-guacamole

把f2etest源代码中的f2etest-guacamole文件夹下的文件上传到centos中，以及jdk、tomcat一并上传，我这里是统一传到了root目录下，文件结构见下图

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

安装java环境：

mkdir /usr/java 

cd /usr/java 

cp /root/jdk-7u79-linux-x64.tar.gz ./ 

tar -zxvf jdk-7u79-linux-x64.tar.gz 

vi /etc/profile

追加以下内容

Bash

JAVA_HOME=/usr/java/jdk1.7.0_79 CLASSPATH=.:$JAVA_HOME/lib.tools.jar PATH=$JAVA_HOME/bin:$PATH export JAVA_HOME CLASSPATH PATH

source /etc/profile

最后输入java -version查看是否安装成功

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

安装tomcat7：

cd /usr/local/ 

cp /root/apache-tomcat-7.0.70.tar.gz ./ 

tar -xzvf apache-tomcat-7.0.70.tar.gz 

mv apache-tomcat-7.0.70 tomcat7 

cd /etc/init.d 

vi tomcat7

追加以下内容(开机启动tomcat)

Bash

#!/bin/bash

# description: Tomcat Start Stop Restart

# processname: tomcat

# chkconfig: 234 20 80

JAVA_HOME=/usr/java/jdk1.7.0_79

export JAVA_HOME

PATH=$JAVA_HOME/bin:$PATH

export PATH

CATALINA_HOME=/usr/local/tomcat7

case $1 in

start)

sh $CATALINA_HOME/bin/startup.sh

;;

stop)

sh $CATALINA_HOME/bin/shutdown.sh

;;

restart)

sh $CATALINA_HOME/bin/shutdown.sh

sh $CATALINA_HOME/bin/startup.sh

;;

esac

exit 0

chmod 755 tomcat7 

chkconfig --add tomcat7 

chkconfig --level 234 tomcat7 on 

chkconfig --list tomcat7 

service tomcat7 start

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

service iptables stop #停止

chkconfig iptables off #禁用

最后用上面两条命令禁用防火墙，并通过8080端口访问tomcat是否成功

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

安装guacamole-server

cd /root 

yum install cairo-devel libpng-devel uuid-devel freerdp* libvncserver-devel openssl-devel gcc

注:yum到gcc全部是一样命令，有些浏览器换行了，会引起误会--！

ln -s /usr/local/lib/freerdp/guacsnd.so /usr/lib64/freerdp/ 

ln -s /usr/local/lib/freerdp/guacdr.so /usr/lib64/freerdp/ 

mkdir -p /home/guacdshare 

chmod 777 /home/guacdshare 

tar -xzf guacamole-server-0.9.3.tar.gz 

cd guacamole-server-0.9.3 

./configure --with-init-dir=/etc/init.d 

make 

make install 

ldconfig 

chkconfig --add guacd 

chkconfig guacd on 

chkconfig --list guacd 

service guacd start 

netstat -panl | grep guacd 

安装guacamole-client

（注意：拷到tomcat下的war包名为：guacamole.war ）

cp /root/guacamole-0.9.3.war /usr/local/tomcat7/webapps/guacamole.war 

mkdir /etc/guacamole 

mkdir /root/.guacamole

vi /etc/guacamole/guacamole.properties

Bash

# Hostname and port of guacamole proxy

guacd-hostname: localhost

guacd-port: 4822

enable-websocket: true

enable-clipboard-integration: true

auth-provider: net.sourceforge.guacamole.net.auth.noauth.NoAuthenticationProvider

noauth-config: /etc/guacamole/noauth-config.xml

# auth-provider: net.sourceforge.guacamole.net.basic.BasicFileAuthenticationProvider

# basic-user-mapping: /etc/guacamole/user-mapping.xml

ln -s /etc/guacamole/guacamole.properties /root/.guacamole 

vi /etc/guacamole/noauth-config.xml

内容如下(Xml)：

<configs>
     <config name="f2etest-ie8" protocol="rdp"> 
        <param name="hostname" value="192.168.10.106" />
        <param name="port" value="3389" /> 
        <param name="enable-drive" value="true" /> 
        <param name="drive-path" value="/home/guacdshare" />
     </config> 
</configs>

service tomcat7 restart

然后通过上面命令重启tomcat，并访问刚才部署的war程序，看看是否部署成功:

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

安装f2etest-web

f2etest-web就是提供给我们操作浏览器云，查看webdriver云节点，以及远程登陆云节点的web界面

要运行f2etest-web首先要先安装nodejs和mysql数据库

把f2etest源码中的f2etest-web和mysql安装文件拷贝到centos /root中，文件结构如下

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

安装mysql

如果已安装mysql可忽略此步骤

cd /root 

yum install numactl perl 

rpm -qa | grep mysql 

yum remove mysql-libs 

rpm -ivh mysql-community-common-5.7.15-1.el6.x8664.rpm 

rpm -ivh mysql-community-libs-5.7.15-1.el6.x8664.rpm 

rpm -ivh mysql-community-client-5.7.15-1.el6.x8664.rpm 

rpm -ivh mysql-community-server-5.7.15-1.el6.x8664.rpm

文件名是有下划线的，这里显示有问题，显示不出来

service mysqld start

然后以下命令查看mysql随机生成的登录密码 cat /var/log/mysqld.log | more

查找以下类似内容: [Note] A temporary password is generated for [email protected]:!R24*6IKha_p

其中localhost:后面的就是登录密码

最后用刚才的密码输入以下命令登录mysql修改密码和设置远程登陆权限

Xml

mysql> 创建数据库database f2etest，并添加用户（或root）; 

mysql -uroot -p 

mysql> set global validate_password_policy=0; 

mysql> set password='shaofan.org'; 

mysql> grant all privileges on *.* to 'root'@'%' identified by 'shaofan.org';

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

启动好mysql并修改好密码之后，就可以用你喜欢的mysql客户端管理工具初始化数据库了

首先创建f2etest数据库，然后导入f2etest-web文件夹中的f2etest.sql初始化表结构

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

安装nodejs

mysql部署完成之后就可以安装nodejs环境来启动f2etest-web程序了

安装方式一：

curl --silent --location https://rpm.nodesource.com/setup_4.x | bash -

yum install -y nodejs

node -v

安装方式二（推荐）：

下载nodejs

wget https://npm.taobao.org/mirrors/node/v8.0.0/node-v8.0.0-linux-x64.tar.xz

解压

tar -xvf node-v8.0.0-linux-x64.tar.xz

测试是否安装成功

进入解压目录下的 bin 目录，执行 ls 命令

cd node-v8.0.0-linux-x64/bin && ls

有node 和 npm

测试

./node -v

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

安装成功

现在 node 和 npm 还不能全局使用，做个链接

ln -s /www/node-v8.0.0-linux-x64/bin/node /usr/local/bin/node ln -s /www/node-v8.0.0-linux-x64/bin/npm /usr/local/bin/npm

可以在任何目录下执行 node 和 npm 命令

注：查看环境变量echo $PATH

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

/usr/local/bin是环境变量PATH的内容，所以建立软链接后可以直接使用node命令

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

安装淘宝npm镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org

用过npm安装模块的小伙伴都知道，因为各种原因，经常下载慢，或者下载失败，所以借助淘宝的镜像加快安装，安装好之后用cnpm命令替代npm命令（我用npm，没有用cnpm，cnpm执行过程中看不出来是否有错）

cd /root/f2etest-web/

cnpm install

vi conf/site.json

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

vi conf/server.json

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

vi conf/app.json

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

node app.js

这时候f2etest-web就运行起来了，访问地址为http://192.168.10.105 但是这个时候先不要访问，因为提供初始化账号的IIS还没有部署。

当项目部署好后可执行，centOS后台自动运行node.js：nohup node app.js &

部署webdriver server

由于windows server2008r2自带ie8，这里就默认这台服务器是提供ie8的webdriver服务。

取消登陆密码必须复杂性要求

在运行中输入gpedit.msc打开本地策略编辑器，修改如下

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

禁用IE ESC

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

安装远程桌面服务

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

安装完成之后需要重启服务器，重启之后登陆需要输入用户名和密码，输入administrator和密码登陆即可

配置远程桌面服务

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

部署IIS服务

iis服务器主要是用来给f2etest-web调用创建windows用户功能

拷贝f2etest源代码里的f2etest-client\f2etest-browsers\www下的setuser文件到C:\inetpub\wwwroot下并修改apikey为前面配置的key

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

配置远程桌面服务

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

http://127.0.0.1/setuser.asp?username=test&password=hello123&key=shaofan.org

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

配置RemoteApp

复制f2etest-client\f2etest-browsers\curl中的所有文件到c:\windows下面

把f2etest-client\f2etest-browsers下的app目录复制到c盘根目录，并重命名强制代理.bat为ie8.bat，禁用代理.bat为hostsshare.bat，

然后修改两个bat中的f2etestDomain为f2etest-web的访问地址即192.168.10.105其中ie8.bat中的appid请修改为ie8和前面的app.js中配置的id保持一致，

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

然后再把源码中的hostsShare-client文件里的build文件修改为hostsShare并拷贝到C盘根目录

最后再添加两个bat文件到RemoteApp，并设置允许任何命令行参数

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

这时，整个浏览器云就部署好了，。我们访问192.168.10.105试试

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

已经可以成功打开了，并看到了我们配置的两个app，这时候你可以点击ie8图标就会再远程桌面打开ie8

前端自动化测试之多浏览器兼容测试平台F2etest全面踩坑记录

相关推荐