基于图像对比自动化测试(PlayWright+mocha+mochawesome+odiff ssim算法+istanbul)

基于图片对比自动化测试

针对APPdiff测试逻辑做个一次webdiff测试尝试

⭐️用到的开源包

PlayWright+mocha+mochawesome+odiff +istanbul

image.png

image.png

⭐️主要的自动化代码示例 1.登录相关链接 2.等待加载页面 3.断言是否加载成功 4.截图到基类对比文件 image.png 5.引入封装odiff包 安装 odiff 包解决对比图片文件
执行命令: npm install odiff-bin -g (-g 全局执行)

⭐️自动化测试原理: 设置基类图片
和自动化脚本截图的做对比
差异后会生成文件

⭐️对比命令示例: odiff 提供了图片路径: 运行简单的比较。图像路径可以是支持的格式之一,差异输出只能是.png.

odiff <IMG1 path> <IMG2 path> <DIFF output path>

获取最新 cli 界面的最佳方法是键入

odiff --help

image.png

⭐️对比结果 对比结果 通过版本升级后查看到与前次版本差异

image.png

⭐️使用原因: 主要解决测试人员少和技术瓶颈带来的 回归环境升级带来的版本差异问题 ⭐️后续想法: 因为相对python Selenium 微软提供的PlayWright 支持JS版本,执行速度快,学习成本低,通过macha 可以实现BDD等常用自动化操作,并提供测试报告。 之后想法 1.根据OpenCV实现的SSIM算法 或者一些相似度模型去筛选对比后的图片 之后慢慢实现模板匹配 异常检测 布局识别等

本次找到node 已经实现过得ssim算法针对已经执行算法分进行了删除过滤图片减少人工干预 image.png

image.png

2.增加代码覆盖率 3.实现复杂场景截图 欢迎大家指导留言,指导后续方案