sam-ui-test

sam-ui-test 是一个组合 Chrome,Jest,Puppeteer 的自动化 UI 测试配置库。 它通过面向配置编程的思路,结合 Jest 的断言能力和 Puppeteer 控制 Chrome 的能力,来降低部分场景下的自动化 UI 测试的上手成本。


License
MIT
Install
npm install sam-ui-test@1.0.4

Documentation

sam-ui-test

基于Chrome,Jest,puppeteer的自动化UI业务测试配置库。

使用

原理  

对场景测试行为进行抽象,再进行封装:

场景,步骤,操作行为,期望结果

步骤

  1. 安装jest
npm install jest --save
  1. 安装puppeteer
npm install puppeteer --ignore-scripts --save

--ignore-scripts这个参数是为了安装puppeteer时,跳过Chromium的下载。

  1. 安装sam-ui-test
npm install sam-ui-test --save
  1. 新建测试文件ui.test.js 并添加内容如下。
const suite = require('sam-ui-test');
suite({
    name:'百度搜索场景',
    browser: {
        executablePath: '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',
        headless: false,
        slowMo: 200,
    },
    step: [
    {
        name: '获取百度搜索的第一个结果标题',
        action: [
            {
                method: 'goto',
                arg: ['https://www.baidu.com']
            },
            {
                method: 'waitForSelector',
                arg: ['#kw']
            },
            {
                method: 'bringToFront',
            },
            {
                method: 'type',
                arg: ['#kw', 'google']
            },
            {
                method: '$eval',
                arg: ['div[id="1"] em', function (h1) {
                    return h1.innerHTML;
                }],
                name: 'text',
            },
            {
                method: 'expect',
                arg: ['$$.text', 'toBe', 'Google'],
            }
        ],
    },
    {
        name: '点击第一条链接',
        action: [
            {
                method: 'waitForSelector',
                arg: ['h3.t > a']
            },
            {
                method: 'click',
                arg: ['h3.t:nth-of-type(1) > a']
            }
        ]

    }
]
});
  1. 更改package.json文件
"scripts": {
    "test": "jest ./ui.test.js"
},
  1. 执行测试命令并观察测试结果
npm run test

解释

action里面的method方法默认是puppeteer的page实例方法。具体可参考这个链接
当method方法是expect时,expect是jest的expect方法。

代码发布

  1. 执行npm login登录账号
  2. 修改package.json版本号,通常+1
  3. 执行npm publish发布

自动化测试规划

  1. 配置化基本功能完善 场景变量,行动变量的支持 配置参数校验 自定义action函数
  2. 配置化转DSL化
  3. 自动化接口测试和自动化UI测试的接口一致化
  4. 并行测试
  5. 探索需求变化引起的测试用例变化同步更新的更好策略