如何从头编写你的 Macaca 测试用例

八戒你干嘛

前置条件

• 安装环境
• 新建一个 Macaca 工程目录，macaca-client 会默认跑 macaca-test 文件夹下所有 .test.js 为后缀的文件。
  

1. | -- README.md
   
2. | -- macaca-test
   
3. |     | -- lib
   
4. |           | -- webdriver-client.js
   
5. |     | -- macaca-pc.test.js
   
6. |     | -- macaca-mobile.test.js  
   
7. | -- package.json

复制代码

• 配置你的 package.json 文件, 最重要的是需要配置开发环境的依赖 devDependencies
  

1. {
   
2.     "name": "macaca-test-sample",
   
3.     "version": "0.1.0",
   
4.     "description": "macaca-test-sample",
   
5.     "keywords": [
   
6.         "sample"
   
7.     ],
   
8.     "dependencies": {
   
9.     },
   
10.     "devDependencies": {
    
11.         "wd-next": "*",
    
12.         "macaca-chromedriver": "*",
    
13.         "wd": "*"
    
14.     },
    
15.     "author": "your name",
    
16.     "email": "your email",
    
17.     "license": "MIT"
    
18. }
    

复制代码

• 在项目根目录下执行 cnpm i 安装 node 模块
  

你要测什么?A. PC（跳到1）
B. iOS/Android（跳到2）
1. 桌面浏览器端测试

• PC 用例 API：wd-next 是我们用 Node.js 对 selenium-webdriver 做了一层封装，接口与 WebDriver 标准统一。
• 引用 macaca-chromedriver ，这是我们用 Node.js 对 ChromeDriver 进行的封装，ChromeDriver 最终会根据参数实例化一个 WebDriver 实例，你最终看到的就是运行了一个 standalone 的 Chrome 浏览器。
  

1. // 文件 macaca-pc.test.js
   
2. var path = require('path');
   
3. var wd = require('wd-next');  // 引用 wd-next
   
4. var macacachromedriver = require('macaca-chromedriver'); // 引用 macaca-chromedriver
   
5. 
   
6. module.exports = (options) => {
   
7.   var binPath = macacachromedriver.binPath;
   
8.   process.env.PATH = `${process.env.PATH}:${path.dirname(binPath)}`;
   
9. 
   
10.   return wd;
    
11. };

复制代码

• 查询 wd-next 编写测试用例。编写用例前，一定要先初始化一个 promise wd.initPromiseChain()，之后 it 中的所有用例的方法都是使用 promise 链式调用方法
  

1. // 文件 macaca-pc.test.js
   
2. var path = require('path');
   
3. var wd = require('wd-next');  // 引用 wd-next
   
4. var macacachromedriver = require('macaca-chromedriver'); // 引用 macaca-chromedriver
   
5. 
   
6. module.exports = (options) => {
   
7.   var binPath = macacachromedriver.binPath;
   
8.   process.env.PATH = `${process.env.PATH}:${path.dirname(binPath)}`;
   
9. 
   
10.   /*
    
11.   * 开始编写测试用例
    
12.   */
    
13.   describe('macaca desktop sample', function () {
    
14.     this.timeout(5 * 60 * 1000);
    
15. 
    
16.     const driver = wd.initPromiseChain(); // 初始化一个promise
    
17.     const initialURL = 'https://www.baidu.com';
    
18. 
    
19.     before((done) = > {
    
20.       return driver
    
21.           .init()
    
22.           .setNormalSize()
    
23.           .end(done);
    
24.     });
    
25. 
    
26.     it('#0 should go into macaca', function () {
    
27.       return driver
    
28.           .get(initialURL)
    
29.           .sleep(3000);
    
30.     });
    
31. 
    
32.     it('#1 should works with macaca', function () {
    
33.       return driver
    
34.           .elementById('kw')
    
35.           .sendKeys('macaca')
    
36.           .sleep(3000)
    
37.           .elementById('su')
    
38.           .click()
    
39.           .sleep(5000)
    
40.           .source()
    
41.           .then(function (html) {
    
42.             html.should.containEql('macaca');
    
43.           })
    
44.           .takeScreenshot();
    
45.     });
    
46.   });
    
47. 
    
48.   return wd;
    
49. };
    

复制代码

• 在工程根目录下执行命令行 macaca run Bravo! 就可以看到啦~
  

2. 移动端测试

• iOS/Android 用例API: 我们推荐使用 wd.js 或者 webdriverio
• 建议可以根据自己的 APP 封装一层自己的 webdriver-client, 同时适配 iOS 和 Android。在 macaca-test/lib/ 下新建文件 webdriver-client.js，以 login 为例
  

iOS 代码实现如下：

1. module.exports = function(username, password) {
   
2.   return this
   
3.     .waitForElementByXPath('//UIATextField[1]')
   
4.     .sendKeys(username)
   
5.     .waitForElementByXPath('//UIASecureTextField[1]')
   
6.     .sendKeys(password)
   
7.     .sleep(1000)
   
8.     .sendKeys('\n')
   
9.     .waitForElementByName('Login')
   
10.     .click()
    
11.     .sleep(5000);
    
12. };
    
13. 
    

复制代码

但是由于 Android 下元素名会不同，实现如下：

1. module.exports = function(username, password) {
   
2.   return this
   
3.     .waitForElementsByClassName('android.widget.EditText', {}, 120000)
   
4.     .then(function(els) {
   
5.       return els[0];
   
6.     })
   
7.     .sendKeys(username)
   
8.     .sleep(1000)
   
9.     .elementsByClassName('android.widget.EditText')
   
10.     .then(function(els) {
    
11.       return els[1];
    
12.     })
    
13.     .sendKeys(password)
    
14.     .sleep(1000)
    
15.     .waitForElementByName('Login')
    
16.     .click()
    
17.     .sleep(5000);
    
18. };

复制代码

可以查看我们已经写好的例子。
注意！这不是通用的 webdriver-client ，你需要根据自己的 APP 封装出自己的 webdriver-client。

• 引入你的 webdriver-client 模块，查询 wd.js, 开始编写用例。
  

1. // 这里是 wd 实例初始化
   
2. var wd = require('./lib/webdriver-client')({
   
3.   platformName: platform,
   
4.   app: 'path/to/your/app'
   
5. });
   
6. 
   
7. describe('macaca mobile sample', function() {
   
8.   this.timeout(5 * 60 * 1000);
   
9. 
   
10.   var driver = wd.initPromiseChain();
    
11. 
    
12.   before(function() {
    
13.     return driver.initDriver();
    
14.   });
    
15. 
    
16.   after(function() {
    
17.     return driver
    
18.       .sleep(1000)
    
19.       .quit();
    
20.   });
    
21. 
    
22.   it('#1 should login success', function() {
    
23.     return driver
    
24.       .login('12345678', '111111')
    
25.       .sleep(1000);
    
26.   });
    
27. 
    
28.   ...
    
29. 
    
30. });

复制代码

在工程根目录下执行命令行 macaca run --server 用例就可以跑起来了。