The auto front-end tester powered by user actions record and replay
基于用户行为录制和回放的前端自动化测试套件
npm run doc-preview
npm install wb-ad-fe-auto-tester
建议添加到script中
npx wb-auto-tester --init
init执行成功后,会在工作区安装测试相关的工具依赖, 并且生成三个文件/目录
- wb-auto-tester.config.js 工具的核心配置文件
- playwright.config.js 测试工具的配置文件
- auto-test-cases 测试用例的输出目录, 工具将会自动归档测试用例脚本
并且会给工作区添加四个新的可用命令
wb-auto-tester
wb-auto-tester --test
wb-auto-tester --debug
wb-auto-tester --replay
这三个命令分别对应了auto tester的三种工作模式, 分别是:
- 生成用例
- 测试模式
- 调试模式
- 回放模式
修改 wb-auto-tester.config.js
的配置
wb-auto-tester.config.js
的配置说明
参数 | 要求 | 备注 |
---|---|---|
target | {title?:string,method:string,url:string,mode?:'regular'} | 通过method和url来指定需要测试的锚点 |
startDateTime | YYYY-MM-DD | 起始日期 |
endDateTime | YYYY-MM-DD | 终止日期 |
targetIds | string[] | 指定需要测试的用户的sso_id列表 |
ignoreIds | string[] | 指定需要忽略的用户的sso_id列表 |
module.exports = [
{
// 测试目标
target: {
// 测试标题
title: '编辑创意',
// 可选: url是否为正则模式
mode :'regular',
// 测试锚点请求方法
method: 'post',
// 测试锚点请求url
// 支持配置为正则, 但是请注意转义符的使用
url: '/v1/creative/\\d+',
},
// 搜寻埋点的目标时间区间
startDateTime: '2023-09-25 14:00:00',
// 搜寻埋点的目标时间区间
endDateTime: '2023-09-25 15:00:00',
// 需要查找的特定用户的sso_id
targetIds : ['422342233'],
// 需要忽略的特定用户的sso_id
ignoreIds : ['111111111']
}
];
wb-auto-tester.config.js
的配置是一个对象数组,你可以同时配置多个不同的测试目标任务
现阶段,要接入自动测试工具,需要业务项目正确配置cheka
并且手动增加锚点上报
考虑到cheka业务的设计规范和数据保存的数量级控制, 如果要正确的使用本项目, 需要确保在cheka上报配置上满足下面两点
- 项目的上报域名以 ad.weibo.com结尾
- 配置cheka的blur事件上报
// tips: 请注意要在cheka初始化之前配置
window.wbadmt.blur= true
锚点上报
是指需要测试工具关注的,用户的最核心的操作或相关结果
最简单的例子就是用户对某一重要接口的调用
业务方只需要在相对应的业务代码里增加cheka埋点即可
当然,该埋点需要符合下面的参数要求
参数 | 要求 | 备注 |
---|---|---|
eventid | 1338451 | |
eventvalue | JSON.stringify({method: string,url : string,mode?:"regular" params : any}) |
params: 请求该的body |
sendTracking({
eventid: 1338451,
eventvalue: JSON.stringify({
method: "post",
url: "/packet",
params,
}),
});
在接入的项目中,修改cheka的配置,开启对blur事件的上报支持
window.wbadmt.blur = true
npx wb-auto-test
运行后, auto-tester将会根据```wb-auto-tester.config.js``中的配置,尝试生成测试脚本, 结果将会自动归档在auto-test-cases目录下
回放模式,是专门针对需要检查用户操作的需求而实现的模式 在使用这一模式时,你需要准备好tid,并且进行设置 随后,工具将尝试对这个tid进行用户操作链路的获取和生成
具体来说,你需要在wb-auto-tester-config.js
中进行如下配置
module.exports = [
{
startDateTime: "2023-05-08 16:05:00",
endDateTime: "2023-05-09 16:07:00",
tid : '4e96ecb9ac9aef1e1fa9677cc00b94d3'
}
]
然后运行npx wb-auto-tester --replay
, 工具会根据这个tid信息,尝试进行用户操作链路的回放生成
工具具备2种测试模式
- 测试模式
npx wb-auto-tester --test
- 调试模式
npx wb-auto-tester --debug
在测试模式下, auto-tester将自动运行用例目录下的脚本, 并在完成后输出测试结果
如果你需要对特定的脚本/目录进行测试运行,那么你可以指定路径参数
npx wb-auto-tester --test $filePath
工具将会自动打开调试结果,在手动关闭后,你仍可以在playwright-report
目录下找到结果
在调试模式下, auto-tester将以调试模式运行测试, 支持自动断点, 可以帮助你快速且可视化地调试测试用例
在以调试模式运行后, 你当然可以自主地, 以任何方式修改脚本, 以满足自己的测试需求
修改后仍然可以无缝地以测试模式和调试模式运行用例, 直到得到满意的测试结果
在完成测试用例的运行后,项目会自动生成测试报告, 其中包含两个报告文件
-
playwright-report : playwright框架自动生成的报告, 展示了脚本的运行结果和每一步自动化操作的结果, 所有的结果都保存在playwright-report这个目录下
-
report.html : 本项目生成的报告, 用来聚焦结果, 会展示测试结果对应的脚本文件和具体的对象diff结果, 方便开发者快速精确地判断测试结果