多浏览器测试比较工具
引言
各浏览器内核不一样,支持的css标准不一样,因此前端开发人员对各个浏览器的兼容性很头疼。不仅如此,前端的测试人员也身受其害。同样的功能,需要在不同的浏览器中重复地操作与观察。即使已将前端的case自动化,还需要搭建不同的浏览器环境,在各浏览器中一一发起执行。既然case已经自动化运行,能否再进一步, 若case能在各个浏览器下自动的运行,则能减少测试人员搭建多浏览器环境与串行多次运行case的代价。
现状
目前已有工具可在浏览器兼容性的测试中给出一些辅助。笔者觉得可将它们按功能可归为三类:一类是可将同一url在多个浏览器中打开并返回截图的工具,比如Browsershots、SuperPreviewIE;一类是提供一系列备选浏览器,在不需要在机器上安装各浏览器的情况下,模拟指定的浏览器操作的工具,比如Browser Sandbox、IEtester;另一类是检测js错误工具,可在不需安装多浏览器的情况下检查js是否能运行成功,比如crosscheck。此类工具的缺点都在于不能将对同一页面的操作同步到多个浏览器中,只能减少各浏览器的安装成本,测试时仍需对每个浏览器逐一检查。另外,sandbox与 ietester是否反应页面在各浏览器下的真实结果还有待确认。
多浏览器测试对比工具
笔者设计的多浏览器测试对比工具,也并不能将测试人员从浏览器兼容性测试的工作中解放出来,但是,它可以减少您在windows下安装ie6\ie7\ie8\firefox3.6\chrome的工作,自动地在各个浏览器中完成case的执行,并行执行case来节约case运行时间,它还可以返回各浏览器中运行的截图供您一次性查看,同时运用基于分块的直方图相似度对比各浏览器的截图图像,以给您查看图像时提供参考。
多浏览器测试对比工具的功能图如下:
1. 输入数据
工具会检查某个目录下是否有文件夹,用户只需将含有自动化case及配置文件的文件夹上传到此目录下,工具检测到用户输入后,会根据配置文件中指定的浏览器类型,将case分发到浏览器对应的机器上,并发起case的执行。
配置文件格式如下
2. 输出结果
此工具将收集各浏览器测试的结果,如下,每个以浏览器类型命名的文件夹下是各浏览器的截图及运行日志,在server的日志中,给出各浏览器截图的相似度对比结果。
3. 关于实现
1) 多浏览器环境的建立
每个浏览器都在windows环境下真实地安装,从而得到真正各版本浏览器下运行的结果。各浏览器安装在一台或多台机器上,由由server端记录着各个浏览器类型所对应的机器及机器提供case上传、远程调用的端口号。各浏览器所在机器部署着多浏览器工具的client,提供了查询client空闲状态、运行case、返回运行结果等接口供server端调用。
(2)case的分发
Case的分发到哪台机器,意味着case会在这台机器上执行。目前的case分发采用着最为简单的方法。每次server只运行一个应用,即当有多个case文件夹同时上传到ftp后,会依次处理每一个上传。当server端检测到case输入时,根据配置文件中选择的浏览器类型,依次查询对应浏览器所在的机器列表中,有哪台机器是空闲的,若有空间的机器,则将case部署到此机器上。对获取空闲机器的操作加锁,以保证不会出现并发时对机器的获取有误。Server建立各浏览器运行case的线程,由配置文件中,case在各个浏览器下串并行配置来确定线程的运行顺序。
采用以上方法来分发case,虽然简单方便,但存在着资源利用不充足的问题。可能出现正在运行的case在等待符合条件的空闲机器,而现在空闲的机器虽然不满足此时case的浏览器要求,却可能满足下一个输入满足的浏览器类型。笔者目前还没有想到好的算法。若所有的case全为并行,则可将解析所有的待运行case,按case\浏览器类型组成数组,当有空闲机器时,就从数组中找出能满足条件的先运行。但因case可设置为串行,此方法便不可行了。若大家有满足串并行要求、又能充分利用机器资源的算法,欢迎交流。
(3)浏览器截图
截图的时间
当case发起执行时,同时发起另一线程开始截图。当case运行完成或遇到异常结束时,截图停止。配置文件中可设置截图的时间间隔,线程中按指定的时间间隔sleep截图。
截图的方法
由于此工具并不会干涉用户如何操作浏览器,因此对浏览器的截图并没有调用selenium或watinN的相关接口来截图,而是调用windows api来完成的截图。在截图时,先根据此时浏浏览器的类型来得到浏览器窗口的classname,由classname来定位浏览器的父窗口句柄,再枚举子窗口,得到浏览器渲染区的句柄。为了能将渲染区的图清晰地截取出来,在获取了父窗口的句柄后,将窗口最大化且置为HWND_TOPMOST。由winApi中的GetWindowRect根据渲染区的句柄得出渲染区的屏幕坐标区域,再对此区域进行屏幕截取。
由于chrome\firefox存在不同程度打开一个应用程序,出现多个classname相同的窗口的情况,因此在获取chrome与firefox句柄的细节方面,还加了title过滤等处理。
截图的对比
图像的对比的方法较多,领域也很深,笔者找到了一个基于图像直方图来对比相似度的方法,觉得能有一些参考价值。此方法将两个图像各切分为64个小方格,每个方格提取直方图,对比相似度后,取相似度的平均值做为总的图像相似度。
笔者将baidu上搜索hahaxixi的自动化case放入多浏览器工具中,选择在ie6\ie8\firefox3.6下运行,人眼看到的截图基本一致,得到的对比结果是,ie6.0与firefox3.6下截图的相似度为83.949%,ie6.0与ie8.0的截图相似度为82.233%。
4. 关于运用
此工具刚开发完成,目前是在测试时使用了一些web自动化case在运行。此后准备先在创意专家项目组来实验并完善此工具。
由于工具的使用比较简单,用户只需将可执行的自动化case及配置文件传入ftp即可,由工具自动地完成case的分发、执行、截图与结果收集。若运行得比较顺畅,用户可在持续集成中采用此工具做兼容性检查的daily run。不过,此工具对用户自动化用例的要求会高一些,用例能成功运行的浏览器类型,还取决于用户自身的web case所使用的执行引擎。
作者:pfeng
本文转自百度技术51CTO博客,原文链接:http://blog.51cto.com/baidutech/744416,如需转载请自行联系原作者
推荐阅读
-
可用性测试主流原型工具的并排比较
-
开源比较丨Prometheus 服务多场景存储压力测试全面分析
-
几种较好的测试工作比较工具
-
论文制图工具的比较实验:MulimgViewer(多图像查看器)
-
多浏览器测试比较工具
-
Java 类加载器的作用 - 简介:类加载器是 Java™ 中一个非常重要的概念。类加载器负责将 Java 类的字节码加载到 Java 虚拟机中。本文首先详细介绍了 Java 类加载器的基本概念,包括代理模型、加载类的具体过程和线程上下文类加载器等。然后介绍了如何开发自己的类加载器,最后介绍了类加载器在 Web 容器和 OSGi™ 中的应用。 类加载器是 Java 语言的一项创新,也是 Java 语言广受欢迎的重要原因之一。它允许将 Java 类动态加载到 Java 虚拟机中并执行。类加载器从 JDK 1.0 开始出现,最初是为了满足 Java Applets 的需求而开发的,Java Applets 需要从远程位置下载 Java 类文件并在浏览器中执行。现在,类加载器已广泛应用于网络容器和 OSGi。一般来说,Java 应用程序的开发人员不需要直接与类加载器交互;Java 虚拟机的默认行为足以应对大多数情况。但是,如果遇到需要与类加载器交互的情况,而您又不太了解类加载器的机制,就很容易花费大量时间调试异常,如 ClassNotFoundException 和 NoClassDefFoundError。本文将详细介绍 Java 的类加载器,帮助读者深入理解 Java 语言中的这一重要概念。下面先介绍一些基本概念。 类加载器的基本概念 顾名思义,类加载器用于将 Java 类加载到 Java 虚拟机中。一般来说,Java 虚拟机以如下方式使用 Java 类:Java 源程序(.java 文件)经 Java 编译器编译后转换为 Java 字节代码(.class 文件)。类加载器负责读取 Java 字节代码并将其转换为 java.lang 实例。每个实例都用来表示一个 Java 类。通过该实例的 newInstance 方法创建该类的对象。实际情况可能更加复杂,例如,Java 字节代码可能是由工具动态生成或通过网络下载的。 基本上,所有类加载器都是 java.lang.ClassLoader 类的实例。下面将详细介绍这个 Java 类。 java.lang.ClassLoader 类简介 java.lang.ClassLoader 类的基本职责是根据给定类的名称为其查找或生成相应的字节码,然后根据这些字节码定义一个 Java 类,即 java.lang.Class 类的实例。除此之外,ClassLoader 还负责加载 Java 应用程序所需的资源,如图像文件和配置文件。不过,本文只讨论它加载类的功能。为了履行加载类的职责,ClassLoader 提供了许多方法,其中比较重要的方法如表 1 所示。下文将详细介绍这些方法。 表 1.与加载类相关的 ClassLoader 方法
-
轻量级性能测试工具 ab / wrk / locust 分析与比较
-
FRP+NPS+Zerotier 与 NAT 服务器测试的内联网渗透工具比较
-
简化接口测试:比较各种 API 开发工具 - 开源专题 No.62-Orange-OpenSource/hurl
-
Python测试工具unittest和pytest:比较它们的优缺点