MeterSphere使用多版本浏览器进行UI兼容性测试


朱飞鸽
飞致云 发布于 2023-09-14 / 496 阅读 / 0 评论 /
作为一款一站式的开源持续测试平台,MeterSphere涵盖了测试跟踪、接口测试、性能测试和UI测试等功能模块。由于MeterSphere的UI测试模块后台调试使用的是自带的Selenium-Grid进行测试,且Selenium-Grid是固定版本的浏览器,因此无法实现多版本浏览器的兼容性测试。为了

作为一款一站式的开源持续测试平台,MeterSphere涵盖了测试跟踪、接口测试、性能测试和UI测试等功能模块。由于MeterSphere的UI测试模块后台调试使用的是自带的Selenium-Grid进行测试,且Selenium-Grid是固定版本的浏览器,因此无法实现多版本浏览器的兼容性测试。为了达到多版本浏览器兼容性测试的目的,需要部署安装多版本浏览器的Node,以用于执行UI测试脚本。

现如今,市面上的浏览器种类越来越多,这意味着所测试的站点需要在这些浏览器上都能很好地工作。同时,主流浏览器(例如IE、Firefox、Chrome、Opera、Safari等)版本更新愈加频繁,终端用户甚至不会感知到这些浏览器版本的升级。这让浏览器兼容性测试的工作变得更加重要了,但也使得这种兼容性测试变得十分耗时。

通过全覆盖的测试,可以明确地知道目标站点支持哪些浏览器,而哪些会产生兼容性的问题。最简单的减少浏览器兼容性测试工作量的办法就是,停止对老版本浏览器的支持。这个策略对一些公司是适用的,但并不适用于所有公司。停止对老版本浏览器的支持,并不意味着目标系统在这些老版本上没有Bug, 这仅仅是在表面忽略了老版本浏览器上的潜在问题。MeterSphere平台的UI测试模块,目前尚未支持同时对多浏览器进行兼容性测试,但是可以在此基础上通过更灵活的方式进行测试。以下是以Chrome浏览器为例,在MeterSphere平台实现多版本浏览器UI兼容性测试的具体操作步骤。

一、MeterSphere使用Selenium-Grid执行原理

MeterSphere平台使用的是开源Selenium-Grid组件,其执行流程如下:

■ 对外的入口对应的是Selenium Hub。

■ 具体执行任务的执行机,对应的是Selenium Node。

■ Node接到任务后分配给执行节点的过程,就是Selenium Hub将测试分配到Selenium Node执行的过程。

■ Node向Hub报备的过程,就是Selenium Node向Selenium Hub注册的过程。

■ Selenium Hub用来管理各个Selenium Node的注册信息和状态信息,并且接收远程客户端代码的测试调用请求,并把请求命令转发给符合要求的Selenium Node执行。

■ Selenium-Grid包含了Selenium-Hub和多个Selenium-Node,所以需要额外安装多个版本的Chrome浏览器的Selenium-Node,才可以进行多版本浏览器兼容性测试。

二、获取多版本的Chrome浏览器Selenium-Node


查看https://github.com/SeleniumHQ/docker-selenium/releases?page=1 网页上已经发布的Release中的镜像Tag。

Released versions信息中包含了浏览器的版本,复制需要测试浏览器版本的镜像Tag。


通过复制的Tag信息,进入MeterSphere服务器拉取镜像。

三、启动对应版本的Chrome浏览器Selenium-Node

通过执行如下命令,启动对应版本的Chrome浏览器Selenium-Node(端口“5555”为容器外部端口,“chrome110”为容器名称,用于区分不同版本的浏览器)。

#此为Node节点单独运行,也可以加其他参数或者docker-compose的方式去启动,具体命令自行百度
docker run -d -p 5555:4444 --name chrome110 --shm-size="2g" selenium/standalone-chrome:4.8.0-20230210

执行结果如下:

四、MeterSphere配置个人信息的UI测试账号


在页面右上角的“用户名”处的下拉菜单中,点击“个人信息”选项,进行个人相关信息配置。
 
选择“UI设置”选项卡,填写UI账号。

五、执行 UI 自动化场景


选择 UI 自动化场景,点击“本地调试”按钮。
 
查看容器日志。

docker logs -f chrome110 --tail=200 

可以看到浏览器版本为“110”,类型为 “Chrome浏览器”。

六、查看执行结果

执行日志如下:

执行结果显示完成:

七、总结

以上就是添加额外浏览器进行测试的具体步骤,需要注意的是:

1. 如果服务器不能直接连接外网,则需要手动拉取镜像之后,保存成tar包再上传到服务器。
2. 如果不在“个人信息”选项中填写“步骤三”中启动的 http://IP:Port,也可以在“系统设置”-”系统参数设置”下修改的 Selenium-Docker 地址,然后选择“后台调试”。
3. 如果用户在“个人信息”选项里面看不到“UI设置”选项卡,请联系管理员进行授权。
4. 如果要部署多个版本的浏览器,请注意控制容器外部端口是否冲突。如有冲突,请修改为空闲端口。



是否对你有帮助?