IRecorder



  1. Http://xrecorder.com
  2. Recorder Of Deeds
  3. Irecordercounter
  4. Recorder.com
  5. Irecorder Pro

UI Recorder is a zero cost UI test case recorder like Selenium IDE.

UI Recorder is more powerful than Selenium IDE!

IRecorder allows you to record videos in background mode or when the phone is in locked state. You can also use your device's camera to record videos at a specific time. This application is very useful for capturing videos and is the best app available in the Android market for mobile recorder. You have multiple roles. Please select a role from drop-down to login.

UI Recorder is easy to use.

  1. Official Site: http://uirecorder.com/
  2. Language Switch: English, 中文
  3. Change log: CHANGE
  4. Video Tutorial:PC中文教程
  5. 钉钉交流群:11779932(加入验证:UIRecorder录制),下载钉钉:https://www.dingtalk.com/
  6. 最新中文手册:语雀文档、Github Page
  1. Support all user operation: key event, mouse event, alert, file upload, drag, svg, shadow dom
  2. Support mobile native APP(Android, iOS) recorde, powered by macaca: https://macacajs.com/
  3. No interference when recording: the same as self test
  4. Record test file saved in local
  5. Support kinds of expect: val,text,displayed,enabled,selected,attr,css,url,title,cookie,localStorage,sessionStorage
  6. Support image diff
  7. Support powerful var string
  8. Support common test case: one case call another
  9. Support parallel test
  10. Support i18n: en, zh-cn, zh-tw
  11. Support screenshots after each step
  12. Support HTML report & JUnit report
  13. Support multi systems: Windows, Mac, Linux
  14. Test file base on NodeJs: jWebDriver

Install

  1. Install NodeJs (version >= v7.x)

    sudo chown -R $(whoami) $(npm config get prefix)/{lib/node_modules,bin,share} (Mac, Linux)

  2. Install chrome

  3. Install UI Recorder

    npm install uirecorder mocha -g

PC record

  1. Init test project

    Create new folder

    uirecorder init

  2. Start record test case

    edit hosts file

    uirecorder sample/test.spec.js

  3. Start WebDriver Server

  4. Run test case

    Run all case: source run.sh ( LinuxMac ) or run.bat ( Windows )
    Run single case: source run.sh sample/test.spec.js ( LinuxMac ) or run.bat sample/test.spec.js ( Windows )
  5. Get reports & screenshots

    ./reports/index.html

    ./reports/index.xml (JUnit)

    ./reports/index.json

    ./screenshots/

Mobile record

  1. Install & start macaca server:

    Install macaca: http://macacajs.com/

    Connect your mobile or open emulator

    macaca server --port 4444

  2. Init test project

    Create new folder

    uirecorder init --mobile

  3. Start record test case

    uirecorder --mobile sample/test.spec.js

  4. Run test case

    Run all case: source run.sh ( LinuxMac ) or run.bat ( Windows )
    Run single case: source run.sh sample/test.spec.js ( LinuxMac ) or run.bat sample/test.spec.js ( Windows )
  5. Get reports & screenshots

    ./reports/index.html

    ./reports/index.xml (JUnit)

    ./reports/index.json

    ./screenshots/

How to debug test code

  1. Install Visual Studio Code & open Visual Studio Code
  2. Open the project root folder by vs code
  3. Open test file, add break point
  4. press F5 key to start, press F10 key to run next line
IRecorder

How to deploy WebDriver Server

  1. How to run selenium standalone server?

    npm run server

  2. Selenium Grid: https://github.com/SeleniumHQ/selenium/wiki/Grid2
  3. F2etest: https://github.com/alibaba/f2etest

How to change webdriver host & port by env temporary, debug for local?

Http://xrecorder.com

  1. export webdriver=127.0.0.1:4444 or set webdriver=127.0.0.1:4444 (Windows)

Tip: port is not required, For example: export webdriver=127.0.0.1

How to dock Jenkins?

  1. Add commands

  2. Add reports

    JUnit: reports/index.xml

    HTML: reports/index.html

How to filter unstable path

  1. Because some attribute values are random or unstable, we can’t record a stable CSS selector
  2. We can filter the attributes with a blacklist. You can type uirecorder init and then input the blacklist from the command line

Tip: blacklist is a regex, you can use it like this: /attr_d+/

How to record common test case?

  1. Record commons/login.mod.js
  2. Record sample/test.spec.js

    1. please input login.mod.js in recorder start page or jump test case in page
    2. After login.mod.js loaded, then recorder other steps
  3. source run.sh ( LinuxMac ) or run.bat ( Windows )

How to record file upload?

  1. UI Recorder only support native file compont, no support for Flash
  2. direct click <input type='file'> or click <button>Upload file</button>, the placeholder button must mark as upload with role or data-role
  3. File must save to uploadfiles/ directory

How to use vars

edit config.json

  1. start with url: http://xxx.com/product?id=
  2. add new var with tool panel
  3. update var with tool panel
  4. jump url with tool panel: http://xxx.com/product?id=
  5. insert vars string with tool panel: `` or aaabbb
  6. expect to var string: `` or aaabbb

Tip: All var string also support js template string, For example: , ${new Date().getTime()}, ${parseInt(testVars.a)+parseInt(testVars.b)}

How to add hover multiple or add expect after a hover?

  1. Press down Ctrl or Command button
  2. Click Add Hover Button, enter hover mode
  3. Release Ctrl or Command button
  4. Click the dom you want to hover (can add multiple)
  5. Click Add Expect Button
  6. Click the dom you want to expect
  7. Press Esc button or click End Hover Button, exit hover mode

How to expect the value after js eval in front browser?

Recorder Of Deeds

  1. Add Expect, select type jscode
  2. sync mode: return document.title
  3. function mode:

  4. async mode:

How to hide doms before expect?

  1. uirecorder init
  2. Input css selector when init Hide before expect
  3. uirecorder start
  4. UIRecorder will hide matched doms before expect, then you can expect the dom behind the mask div

How to record option click?

Some steps is not very important, but occasionally displayed, this steps will expect to success always.

  1. Press ‘Alt’ button
  2. Click the target DOM

How to use image diff?

  1. Install GraphicsMagick

    brew install graphicsmagick (Mac)

    sudo apt-get install graphicsmagick (Linux)

    http://www.graphicsmagick.org/download.html (Windows)

  2. Add expect with imgdiff

    select expect type: imgdiff

    select target element

  3. Rebuild the baseline image

    source run.sh sample/test.spec.js --rebuilddiff (MacLinux)

    run.bat sample/test.spec.js --rebuilddiff (Windows)

Can’t do when recording

  1. don’t change url in location bar
  2. don’t change focus by TAB key
  3. don’t use dblclick, WebDriver no support
  4. don’t select text by mouse, WebDriver no support
  5. don’t focus to background window manualy
  6. don’t click useless DOM, only record key steps

How develop test friendly code?

Irecordercounter

  1. please dont’t use random id or name
  2. please name a id for DOM area
  3. add label for form
  4. please listen click event instead of mousedown

How to set udid to mobile test?

  1. export devices=xxx1,xxx2 (windows: set devices=xxx1,xxx2)
  2. source run.sh ( LinuxMac ) or run.bat ( Windows )

How to save raw cmds json?

  1. uirecorder start --raw
  2. After test saved, then you can get 2 files: sample/test.spec.js, sample/test.spec.json

Other Tips

  1. Mac system: localhost must place in hosts

Recorder.com

Contributors


yaniswang

Stngle

stevobm

xudafeng

alibaba-oss

felizalde

portokallidis

zquancai

This project follows the git-contributor spec, auto updated at Wed Mar 20 2019 19:39:47 GMT+0800.

UIRecorder is released under the MIT license:

The MIT License

Copyright (c) 2016 - 2017 alibaba.com

Permission is hereby granted, free of charge, to any person obtaining a copyof this software and associated documentation files (the “Software”), to dealin the Software without restriction, including without limitation the rightsto use, copy, modify, merge, publish, distribute, sublicense, and/or sellcopies of the Software, and to permit persons to whom the Software isfurnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included inall copies or substantial portions of the Software.

Irecorder Pro

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS ORIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THEAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHERLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS INTHE SOFTWARE.

  • jWebDriver: https://github.com/yaniswang/jWebDriver
  • colors: https://github.com/Marak/colors.js
  • commander: https://github.com/tj/commander.js
  • inquirer: https://github.com/sboudrias/Inquirer.js
  • async: https://github.com/caolan/async
  • chai: https://github.com/chaijs/chai
  • mocha-parallel-tests: https://github.com/yandex/mocha-parallel-tests
  • Mochawesome: https://github.com/adamgruber/mochawesome

Download iRecorder - Video Recorder PC for free at BrowserCam. Ideas inc. published iRecorder - Video Recorder for Android operating system mobile devices, but it is possible to download and install iRecorder - Video Recorder for PC or Computer with operating systems such as Windows 7, 8, 8.1, 10 and Mac.

Let's find out the prerequisites to install iRecorder - Video Recorder on Windows PC or MAC computer without much delay.

Select an Android emulator: There are many free and paid Android emulators available for PC and MAC, few of the popular ones are Bluestacks, Andy OS, Nox, MeMu and there are more you can find from Google.

Compatibility: Before downloading them take a look at the minimum system requirements to install the emulator on your PC.

For example, BlueStacks requires OS: Windows 10, Windows 8.1, Windows 8, Windows 7, Windows Vista SP2, Windows XP SP3 (32-bit only), Mac OS Sierra(10.12), High Sierra (10.13) and Mojave(10.14), 2-4GB of RAM, 4GB of disk space for storing Android apps/games, updated graphics drivers.

Finally, download and install the emulator which will work well with your PC's hardware/software.

How to Download and Install iRecorder for PC or MAC:

  • Open the emulator software from the start menu or desktop shortcut in your PC.
  • Associate or set up your Google account with the emulator.
  • You can either install the app from Google PlayStore inside the emulator or download iRecorder APK file from the below link from our site and open the APK file with the emulator or drag the file into the emulator window to install iRecorder - Video Recorder for pc.

You can follow above instructions to install iRecorder - Video Recorder for pc with any of the Android emulators out there.