UI自动化测试??页面差异检测
作者:Ftopia 发布时间:[ 2016/11/3 15:09:40 ] 推荐标签:软件测试 WEB测试 自动化测试
下图为执行的代码(图一对比图二),函数方法说明下(对应方法的代码需调整,待调整完后放出), calc_similar_by_path() 进行两张图片的相似度计算; cropImg() 进行图片裁切,如下,裁切成了4块(如有需要,怎么裁都行),下图文件夹中为裁切完成的图片(实际运用无需保存图片,仅作示例方便查看);下面几个数字分别为对应小图对比的结果,可见仅一块非1,且比之前对比出的0.995小多了,是不同点所在。
1.0
1.0
0.949275005378
1.0
我们可以先检测大图的相似度,若为1,完全相同即可略过;若非1,再做裁切的图片检测并可根据检测出的哪块框哪块。之后是记录的工程了,简单写了个对比图片页面,展示如下:
基于上述的页面差异对比监控,可以建立一个任务系统,把应用的所有页面url监控起来(包含主要操作后的截图),每次版本迭代提交代码后,系统进行页面差异对比,报告出哪些页面存在差异、具体的页面差异又是什么。
适用测试场景
回归界面测试:新版页面 VS 旧版页面
项目界面测试:Mockup VS 实际测试页面
兼容性测试:如chrome VS 其他各种浏览器
页面差异监控的目的是方便的通知人肉回归范围,这并非测试方案,而是一种辅助测试的手段。
优化及衍生
selenium webdriver仍需要启动真实的浏览器并操作,在执行性能上有一定的劣势。可考虑使用无界面浏览器测试并截图,如 PhantomJS + Selenium,优势是执行效率大大提升,劣势在于PhantomJS不是真实浏览器,且无法做多浏览器截图。
Phantom JS是一个服务器端的 JavaScript API 的 WebKit。其支持各种Web标准: DOM 处理, CSS 选择器, JSON, Canvas, 和 SVG。由于脚本好像是一个Web浏览器上运行的一样,标准的DOM脚本和CSS选择器可以很好的工作。这使得PhantomJS适合支持各种 页面自动化任务 。
基于像素点的图片差异,误报率可能比较高,可衍生考虑做基于DOM树的diff,优势是可以减少误报,且定位至元素;劣势是该比对技术要求较高(要求对DOM树操作了解较深),可参考 前端工程——测试篇 (文中提到的项目两年前已经停更,运行起来貌似有点问题)
相关推荐
更新发布
功能测试和接口测试的区别
2023/3/23 14:23:39如何写好测试用例文档
2023/3/22 16:17:39常用的选择回归测试的方式有哪些?
2022/6/14 16:14:27测试流程中需要重点把关几个过程?
2021/10/18 15:37:44性能测试的七种方法
2021/9/17 15:19:29全链路压测优化思路
2021/9/14 15:42:25性能测试流程浅谈
2021/5/28 17:25:47常见的APP性能测试指标
2021/5/8 17:01:11