系統平臺：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);
                }
 

3. UI Recorder 在錄製時，不支援瀏覽器回退操作；
4. 可以使用無頭瀏覽器回放指令碼，需要修改錄製的指令碼，在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']
                    }
                });
 

5. UI Recorder 在錄製時，只支援固定的sleep時間，不支援智慧等待功能；
6. 如果想要在腳本回放時才生成截圖，可以修改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版本。
  

2. 安裝Chrome瀏覽器，不要安裝綠色版。

3. 使用管理員許可權開啟命令列視窗，安裝cnpm ,檢視cnpm介紹

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

4. 安裝UI Recorder以及依賴項（注意使用管理員許可權）

> cnpm install uirecorder mocha -g
> cnpm install jwebdriver expect.js mocha-generators faker chai --save-dev
# 檢視版本
> npm ls uirecorder -g
[email protected]

5. 新建一個專案目錄，並cd到該目錄下，執行初始化命令： uirecorder init , 根據專案具體情況輸入相關引數後回車即可。引數介紹見UIRecorder PC標準入門 , 這裡我設定的需要同時測試的瀏覽器列表僅為chrome.

6. 開始錄製指令碼： uirecord start ,引數根據需要自行填寫，建議開啟同步校驗瀏覽器，點選檢視uirecorder錄製視訊教程
   
   ​ 結束錄製後，可在資料夾./sample/目錄下看到剛才錄製的指令碼。

7. 回放剛才錄製的指令碼，需要搭建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

  選擇最新版本下載即可。

8. 啟動Selenium server: java -jar .\selenium-server-standalone-3.9.1.jar , 不要關閉該視窗。
   

9. 執行（回放）測試用例

• mocha ./sample/test.spec.js
• 執行所有指令碼並生成報告: run.bat --report
• 執行單個指令碼並生成報告:run.bat sample/test.2.js --report
  
  使用--report 引數執行指令碼後，會生成測試報告，具體請檢視./reports/下index.html、index.xml、index.json檔案。