UI Recorder + Selenium standalone server 环境搭建

系统平台:win10 x64
官方网站:http://uirecorder.com/
Github:https://github.com/alibaba/uirecorder
使用手册:https://github.com/alibaba/uirecorder/blob/master/doc/zh-cn/readme.md
UI Recorder Version :2.5.45

UI Recorder 是一款零成本UI自动化录制工具,类似于Selenium IDE,但UI Recorder 要比Selenium IDE更加强大。我用来录制GUI脚本,并集成到CI中进行回归测试。

踩坑

  1. 一定注意安装的Nodejs版本,按照我下面给出的地址下载;
  2. 在UI Recorder Version @2.5.45中,去掉了maximize() 这个 api(据说是因为和selenium-standalone有兼容问题),如果想要全屏回放脚本,可以手动修改此处:
 try {
               self.driver = driver.session(sessionConfig).maximize().config({
                    pageloadTimeout: 30000, // page onload timeout
                    scriptTimeout: 5000, // sync script timeout
                    asyncScriptTimeout: 10000 // async script timeout
                    });
                } catch (e) {
                    console.log(e);
                }
  1. UI Recorder 在录制时,不支持浏览器回退操作;
  2. 可以使用无头浏览器回放脚本,需要修改录制的脚本,在args处加上headless参数,不会影响截图等功能,如下:
let driver;
            before(function(){
                let self = this;
                let driver = new JWebDriver({
                    'host': host,
                    'port': port
                });
                let sessionConfig = Object.assign({}, webdriverConfig, {
                    'browserName': browserName,
                    'version': browserVersion,
                    'ie.ensureCleanSession': true,
                    'chromeOptions': {
                        'args': ['--enable-automation','--incognito','headless']
                    }
                });
  1. UI Recorder 在录制时,只支持固定的sleep时间,不支持智能等待功能;
  2. 如果想要在脚本回放时才生成截图,可以修改package.json 文件,在–reporter mochawesome-uirecorder后面添加: --reporter-options copyShotOnlyFail=true (要注意有三处需要修改!)
 "scripts": {
    "installdriver": "./node_modules/.bin/selenium-standalone install --drivers.firefox.baseURL=http://npm.taobao.org/mirrors/geckodriver --baseURL=http://npm.taobao.org/mirrors/selenium --drivers.chrome.baseURL=http://npm.taobao.org/mirrors/chromedriver --drivers.ie.baseURL=http://npm.taobao.org/mirrors/selenium",
    "server": "./node_modules/.bin/selenium-standalone start",
    "test": "./node_modules/.bin/mocha \"!(node_modules)/**/*.spec.js\" --reporter mochawesome-uirecorder --reporter-options copyShotOnlyFail=true --bail",
    "singletest": "./node_modules/.bin/mocha --reporter mochawesome-uirecorder --reporter-options copyShotOnlyFail=true --bail",
    "paralleltest": "./node_modules/.bin/mocha-parallel-tests \"!(node_modules)/**/*.spec.js\" --reporter mochawesome-uirecorder --reporter-options copyShotOnlyFail=true --max-parallel 5 --bail"
  },

安装

  1. 环境准备
  • Java 环境
  • Nodejs 环境
    注意,目前Nodejs官网上发布的最新版本为v10.14.2,但是使用最新版本的Nodejs时,UI Recorder在初始化时会有问题(在Start Install project dependencies步骤卡住),所以需要下载我给出的Nodejs版本。
    UI Recorder + Selenium standalone server 环境搭建_第1张图片
  1. 安装Chrome浏览器,不要安装绿色版。UI Recorder + Selenium standalone server 环境搭建_第2张图片

  2. 使用管理员权限打开命令行窗口,安装cnpm ,查看cnpm介绍

npm install -g cnpm --registry=https://registry.npm.taobao.org

  1. 安装UI Recorder以及依赖项(注意使用管理员权限)
> cnpm install uirecorder mocha -g
> cnpm install jwebdriver expect.js mocha-generators faker chai --save-dev
# 查看版本
> npm ls uirecorder -g
[email protected]

UI Recorder + Selenium standalone server 环境搭建_第3张图片

  1. 新建一个项目目录,并cd到该目录下,执行初始化命令: uirecorder init , 根据项目具体情况输入相关参数后回车即可。参数介绍见UIRecorder PC标准入门 , 这里我设置的需要同时测试的浏览器列表仅为chrome.UI Recorder + Selenium standalone server 环境搭建_第4张图片UI Recorder + Selenium standalone server 环境搭建_第5张图片

  2. 开始录制脚本: uirecord start ,参数根据需要自行填写,建议开启同步校验浏览器,点击查看uirecorder录制视频教程
    UI Recorder + Selenium standalone server 环境搭建_第6张图片
    ​ 结束录制后,可在文件夹./sample/目录下看到刚才录制的脚本。

  3. 回放刚才录制的脚本,需要搭建WebDriverServer,支持:Selenium standalone server, Selenium Grid 和 F2etest 三种,下面只介绍第一种单机方式。

    下载selenium-standalone和Chromedriver:

  • 下载chromedriver

    淘宝镜像:https://npm.taobao.org/mirrors/chromedriver

    Chrome官方:https://chromedriver.storage.googleapis.com/index.html

    下载完后,将chromedriver.exe放到系统环境变量路径下,以便SeleniumServer能通过文件名直接找到文件启动对应的driver。注意一定要对照好Chrome和Chromedriver版本,不然回放脚本时会出现各种奇怪的错误。

  • Selenium Server

    选择最新版本下载即可。

  1. 启动Selenium server: java -jar .\selenium-server-standalone-3.9.1.jar , 不要关闭该窗口。
    UI Recorder + Selenium standalone server 环境搭建_第7张图片

  2. 运行(回放)测试用例

  • mocha ./sample/test.spec.js
  • 运行所有脚本并生成报告: run.bat --report
  • 运行单个脚本并生成报告:run.bat sample/test.2.js --report
    UI Recorder + Selenium standalone server 环境搭建_第8张图片
    使用--report 参数运行脚本后,会生成测试报告,具体请查看./reports/下index.html、index.xml、index.json文件。
    UI Recorder + Selenium standalone server 环境搭建_第9张图片

你可能感兴趣的:(What,is,SoftWare,Test)