一起来找茬——便捷高效地开展移动端Web兼容性测试

一. 多屏同步测试

手机帐号是当下测试的项目，它是网易通行证（URS）的一个子项目，基本信息特点如下：

1. 为移动端上的项目，涵盖Android和iOS。
2. 服务于游戏，通过Webview的方式内嵌于游戏产品中。
3. 单位时间只支持一个终端登录，如果同一帐号在其它终端上已经登录，已登录的终端上帐号将被强制下线，如同易信登录一样。

之前两个版本的测试做法基本是在PC上通过常规浏览器执行一遍功能测试，保证功能无太大问题的情况下，再在不同的移动终端上花少量的时间进行一些页面UI的兼容性测试。这里需要提醒的是，Webview是基于Webkit内核开发的，而PC上的浏览器基于Webkit内核开发的有Apple的Safari和Google的Chrome，为了保持内核一致性（不同内核会对页面渲染有较大的差异），建议在PC上测试Webview页面的时候采用这两款浏览器进行测试。

下面简单梳理一下PC上Web兼容性测试的常规做法，各自优缺点如下表所示：

开展方式	优点	缺点
在不同浏览器上真实地执行一遍业务流程	1.贴合用户的真实使用场景	1.要安装各类浏览器，比较耗时 2.需要重复在不同浏览器上真实地执行业务流程，因此非常耗时
工具或插件辅助测试，如IETab，BrowserSandbox等	1.避免安装各类浏览器	1.在不同浏览器上依然存在兼容性问题的隐患

 在做兼容性测试时，我们在思考一个问题：如何既能真实的在不同浏览器上执行，又能提高测试效率，比如多浏览器的同步测试。回到当下测试的手机帐号这一项目，是移动端Webview的，不需要考虑IE，Firefox，Chrome等兼容性，所以常规的IETab、BrowserSanbox等插件工具在当下的测试场景中基本没用；考虑到Android和iOS的内置浏览器内核也是基于Webkit开发，和Webview内核基本一致，所以可以考虑采用手机浏览器代替编写demo内嵌Webview来进行页面测试。那么有没有工具能支持在移动终端上多屏同步测试呢？这时候我们找到一款商用软件GhostLab，它能很好的支持在多屏上进行浏览器同步测试，包括PC与PC之间，PC与终端之间，终端与终端之间。该工具还具有PC上页面的远程调试等优秀特性。对于工具的使用本文不做详细介绍，有兴趣和有需要的同学可以自行下载过来试用即可。

二. 测试前移

当我们兴致勃勃地使用GhostLab上手测试的时候发现手机帐号这个项目有个绕不开的障碍物，那就是单位时间只支持一个终端登录。虽然在不同终端上是同时打开了相同的登录页面，但是这个障碍直接导致了同步测试被block在第一步的登录页面上。

回过头来，我们仔细分析手机帐号的项目特点，前端页面的功能逻辑比较简单：会做一些基本的字段校验以及服务端返回码的对应显示处理，大量的业务逻辑基本是后台服务做的。基于此可以看出前端JavaScript较为简单，兼容性问题风险不大，剩下基本就在静态页面布局兼容性这块了。分析清楚这些，我们提出测试前移，在项目开始后不久，前端静态页面开发好，就先开始尝试兼容性测试了，如果再推动得充分一些，甚至策划和前端都可以自行完成相应的兼容性测试。

最终在项目的实施的实际效果如下。由于多屏同步对比，有些UI上的问题能快速定位发现，这有点像“一起来找茬”的游戏。大家也可以找找下图所录的测试过程一共有发现几个缺陷 :)

在手机帐号项目开展此轮Webview测试的时候，也充分咨询了移动测试组的组长余琦，他在Webview测试方面有丰富的经验（他负责测试的云阅读产品内含大量的Webview），他给出的建议是:Android要重点关注有定制ROM的几个品牌，如小米，华为，魅族等，另外索尼手机的坑比较大；而iOS重点关注屏幕分辨率。手机帐号项目测试结果表明在华为和魅族的几款手机上也同样有较多显示方面的兼容性问题。

三. 其它测试改进点

在实践的过程中，为了更快捷便利地使用GhostLab，我们也做了几点小小的改进：

        1. GhostLab要求所有连接上来的浏览器所在网段必须和安装GhostLab的主机为同一网段，否则将无法通信

我们办公网内的PC做测试基本没有问题，但是移动端一般连接的是NetEase这个无线热点，和办公网的GhostLab主机不在一个网段。这个问题处理方式比较简单：自行搭建了一台小的无线路由器，将它的LAN口和GhostLab主机共同连接了一个Hub，该Hub的LAN口连接到办公网的网口上，这样就可以确保移动端分配的IP地址和GhostLab主机的IP地址位于同一网段。

        2. 移动端上打开URL较麻烦

在移动端浏览器上输入URL是一件让人奔溃的事情，特别是长URL。相对简单的做法是在PC上将URL转为二维码（相应在线服务较多，如https://www.the-qrcode-generator.com/），然后通过手机上安装二维码扫描工具进行扫描打开相应URL。但是这种方式也不是很方便，特别是多终端同步测试时候终端数量较多，一一扫码也很费时。目前我们正在开发一款小工具，实现的功能是将PC上的URL同时发送到所有移动终端，通过安装在终端上的服务自动打开默认浏览器且加载该URL。

        3. License过期

GhostLab是一款商业工具，有7天的试用期，License收费倒不是很贵，三四十刀的样子，但是为了省点银子，当下的做法是将GhostLab安装在了虚拟机中，试用期到了后回滚一下镜像就好。

网易云新用户大礼包：https://www.163yun.com/gift

本文来自网易实践者社区，经作者葛峰授权发布。