UI Recorder实现多浏览器自动化测试

1、先来一段官方的介绍：

UI Recorder是一款零成本的整体自动化测试解决方案，一次自测等于多次测试，测一个浏览器等于测多个浏览器！

• 支持所有用户行为: 键盘事件, 鼠标事件, alert, 文件上传, 拖放, svg, shadow dom
• 支持无线native app录制, 基于macaca实现: https://macacajs.com/
• 无干扰录制: 和正常测试无任何区别，无需任何交互
• 录制用例存储在本地
• 支持丰富的断言类型: val,text,displayed,enabled,selected,attr,css,url,title,cookie,localStorage,sessionStorage
• 支持数据mock: fake.js
• 支持公共测试用例: 允许用例中动态调用另外一个
• 支持并发测试
• 支持多国语言: 英文, 简体中文, 繁体中文
• 支持HTML报告和JUnit报告
• 全系统支持: windows, mac, linux
• 支持多运行时测试, 例如：开发测试、预发测试
• 基于Nodejs的测试用例: jWebDriver

简单来说就是把你每次自测的流程录制下来，而且是全可视化的，然后在各种浏览器上自动回放，大大简化了每次手工测试的麻烦。

说到这里肯定会有人存在疑问：说来说去不还是录制脚本嘛，这个我也会，我会用QTP、Selenium IDE……还记得前面那句话吗，一次自测等于多次测试，测一个浏览器等于测多个浏览器，这是这个工具最大的特点。

2、安装UI Recorder

准备工作：

NodeJs环境（必须是7.0以上版本）http://cdn.npm.taobao.org/dist/node/v7.5.0/node-v7.5.0-x64.msi

Chrome浏览器（建议使用最新版本59），对应的驱动（2.30）：http://chromedriver.storage.googleapis.com/2.30/chromedriver_win32.zip（将驱动放在浏览器的安装目录中，和chrome.exe放在一起，然后记得配置环境变量）

Java环境（建议使用1.8JDK）http://sw.bos.baidu.com/sw-search-sp/software/f819c00cf38a4/jre-8u131-windows-i586_8.0.1310.11.exe

WebdriverServer环境（这里由于事先已经安装好F2etest，就不用在进行安装了）

UI Recorder

准备工作做好就可以安装了

1）打开cmd窗口，安装uirecorder全局命令：cnpm install uirecorder mocha -g –registry=https://registry.npm.taobao.org，如果执行出现“cnpm不是内部命令……”，先安装一下cnpm，cnpm install cnpm -g –registry=https://registry.npm.taobao.org安装的目录是默认你cmd窗口所在目录，可以自己事先新建号目录，然后进入目录中进行安装。

2）安装完初始化：uirecorder init

前面三步直接回车，后面IP和端口是固定的，浏览器根据需要进行配置。

3）编辑config.json，config文件在你安装的UI Recorder目录中

浏览器根据目前浏览器云显示的浏览器进行填写，f2etest.userid和f2etest.apiKey在浏览器云的webdriver页面中可以看到，把自己对应的填写上去，保存即可。

4）安装依赖文件：npm install，有的会失败，就是用cnpm install

5）开始录制脚本：uirecorder start

录制开始，提示输入脚本的所在目录和文件名，提示是否打开浏览器，是否把浏览器最大化

在开始录制时，会一下开启两个浏览器，左边一个是用来录制的，一个是校验我们录制的，在输入框中输入URL，点击开始录制，这里我以

打开百度搜索我们官网作为事例。

6）进入脚本目录执行录制的脚本：mocha  test.spec.js，这里使用mocha指令执行脚本，执行脚本前需要安装依赖cnpm install，结果如下：

录制完的脚本，我们也可以对脚本进行更改，如下:

使用run.bat执行脚本，需要在UI Recorder根目录下执行，生成的结果在report的文件夹中，也有执行过程中的截图，测试结果如下：

可以看到通过两种执行的方式脚本都执行成功了，后者执行完后并将测试结果一同保存在目录中。

相关文章链接：http://www.shaofan.org/f2etest/    http://shaofan.org/ui-recorder/