基于MeterSphere实现多版本浏览器兼容性测试

发布于 2023年03月14日

作为一款一站式的开源持续测试平台,MeterSphere涵盖了测试跟踪、接口测试、性能测试和UI测试等功能模块。MeterSphere的UI测试模块后台调试使用的是自带的Selenium-Grid进行测试,而Selenium-Grid需要指定浏览器的版本,如果需要实现不同版本浏览器的兼容性测试,基于MeterSphere只需要部署安装多版本浏览器的Node,用于执行UI测试脚本即可。

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

通过全覆盖的测试,可以明确地知道目标站点支持哪些浏览器,而哪些会产生兼容性的问题。最简单的减少浏览器兼容性测试工作量的办法就是,停止对老版本浏览器的支持。这个策略对一些公司是适用的,但并不适用于所有公司。

停止对老版本浏览器的支持,并不意味着目标系统在这些老版本上没有Bug, 这仅仅是在表面忽略了老版本浏览器上的潜在问题。MeterSphere平台的UI测试模块,目前尚未支持同时对多浏览器进行兼容性测试,但是可以在此基础上通过更灵活的方式进行测试。以下是以Chrome浏览器为例,在MeterSphere平台实现多版本浏览器UI兼容性测试的具体操作步骤。

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

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

 对外的入口对应的是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;

图2 镜像tag.png

通过复制的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

执行结果如下:图4 执行.png

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

在页面右上角的“用户名”处的下拉菜单中,点击“个人信息”选项,进行个人相关信息配置;

图5 个人信息.png

选择“UI设置”选项卡,填写UI账号。

图6 UI账号.png

五、执行UI自动化场景

选择UI自动化场景,点击“本地调试”按钮;

图7 本地调试.png

查看容器日志;

docker logs -f chrome110 --tail=200

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

六、查看执行结果

执行日志如下:

图9 执行日志.png

执行结果显示完成:

图10 执行结果.png

七、总结

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

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