计算机视觉在App兼容性测试中的实践-干货分享

傷城~ 2023-09-25 18:02 30阅读 0赞

3月12日，测试人社区举行了一场技术沙龙，其中一个Topic邀请到了来自某金融公司资深测试开发工程师——尹飞老师，他分享了关于**计算机视觉在App兼容性测试中的实践技术方面的知识和经验**，引起了参会人员的浓烈兴趣和广泛关注。

以下是尹飞老师分享的本次活动的主要内容和亮点：

## **一、App自动化技术现状** ##

尹飞老师认为当前移动端App自动化技术中的控件ID类似的主要驱动技术已经比较成熟，而且有一些传统的基于视觉的技术也趋于同质化。此外，一些移动端自动化框架，如GAutomator、QTA、Appium、Airtest、ATX等，底层无外乎就是针对iOS或者Android的。

## **二、前端测试四个瓶颈** ##

尹飞老师总结出前端测试存在的4个瓶颈：

**- 可测性瓶颈：**App在安卓和iOS平台上的底层驱动技术很难打平，因为底层是基于浏览器内核渲染的，所以无法直接获取控件ID，导致自动化驱动受限。这也影响了一些H5页面的自动化用例的转化。

**- 测试用例维护成本的瓶颈：**前端类产品页面控件ID变更导致自动化测试用例失效的问题，这是一个老生常谈的问题。一旦控件ID发生变更，相关的自动化测试用例就需要进行编辑和维护，这会增加测试用例的成本和维护难度。

**- 召回能力瓶颈：**在做前端自动化很可笑的一件事情就是竟然没有一个很有效的召回能力。我们现在已知的一个召回能力是什么？是控件的存在性，写Case就说什么控件是否存在，如果存在，就认为是个校验正确的。但是，这个存在和我们应当认为的那种可视化的展现是不一样的。哪怕是这个按钮，虽然它渲染的是一个小黑块，但是底层代表的是一个正常的登录文字按钮，我们传统的Case校验手段，也没有办法有效的去召回这个Bug。

尤其移动端兼容性会看到非常千奇百怪的问题，这种渲染错误的异常，有一些空间渲染失败的纯色的黑块，还有一些图片的拉伸等等。这种依赖主观判断的Bug，传统的技术上是没有办法很好的去检测出来的。

**- 场景识别能力瓶颈：**我们在自动化过程当中还是有很多复杂的场景的，比如说页面出现弹窗的时候，怎么跳转出来，甚至都不知道什么时候会出现弹窗。那么在这种比较复杂，有交互的这种场景下，该怎么去增加Case的这种稳定性呢？尹飞老师认为是应该提升一些场景识别能力的。

![cccd2f5c581dc83afdf86a602a1dbd9d.jpeg][]

## **三、业界视觉方案** ##

以下是尹飞老师在现场分享的几个业内的视觉方案：

**- Applitools、Airtest、Appium pro、Wetest**

**- 阿里Robot XT、网易smartauto、华为游戏终端、阿里SoloPi**

由于篇幅所限，本文无法详细介绍以上提到的方案，但它们都是专门针对前面所提到的瓶颈问题而设计的，相信会为大家带来很多帮助和启示。如果你感兴趣，可以自行在网上搜索相关内容了解更多。

## **四、召回能力** ##

自动化测试最终的目的是为了发现问题，如果我们靠视觉来发现的话，有两大技术路径：

**- 无参照召回：**利用计算机视觉技术建立一个召回模型，对特定样式的图片集进行训练，从而能够判断新图片是否显示错误，并且还能够具体到哪个地方有问题，什么区域有问题。

举个例子，比如一个网站上有一张包含多个商品图片的页面，其中某个商品的图片由于网络延迟等原因没有加载出来，导致该商品图片所在的位置出现了一个空白区域。这时候，人类可以很容易地判断出这是一个空白，但程序可能很难准确识别。

利用上述方法，可以先建立一个针对该网站页面样式的无参照的召回模型，对该页面的正常显示情况进行训练。然后将正常显示的图片与空白区域的图片混合在一起，建立一个图像多分类模型，对新的图片进行预测，从而判断是否显示错误。如果显示错误，则可以利用计算机视觉技术进一步定位问题所在的具体区域，提高问题排查的效率。

**- 有参照召回：**App兼容性测试领域当中，我们最后一个环节是怎么在有基准的情况下去发现程序是没有显示异常的。大家对兼容性测试应该是深有体会的，它其实就是一个劳动性密集型的一个任务，就是堆人、堆设备、堆时间。利用计算机视觉去解决这个问题，是一个非常好的一个切入点。

**整体是从左到右的技术流，分为两大部分：一个是页面理解，一个是差异检测。**首先需要解决可测性，即如何在有基准的情况下发现程序是否存在异常。为了解决这个问题，需要将图片切割成独立的页面元素，并将这些元素翻译成可理解的信息。这个过程包括使用像素切割和文本识别技术，以及对文本进行聚合，以便更好地匹配元素。一旦页面元素被提取并翻译成可理解的信息，需要进行差异检测，以确定在基准图像和被测图像相应的位置上是否存在相同的元素和内容。使用文本匹配、图片匹配和相对位置差异匹配等三个维度进行匹配。由于可能没有足够的真实Bug来测试，需要手动构造一些数据集，以确保算法可以有效地验证。

总的来说，**利用计算机视觉技术在App兼容性测试中进行自动化测试是一种非常有前景的研究方向。**通过将页面理解和差异检测两个阶段结合起来，我们可以实现对App在不同设备上的显示效果进行准确、高效的测试。同时，手动构造数据集也是提高测试效果的一个重要手段。

然而，这个技术仍然需要不断的优化和改进，比如提高页面理解的准确度、处理OCR识别出的文本等问题。我们相信，在不断地实践和探索中，这个技术将会越来越成熟，并为App兼容性测试带来更大的便利和效率。

**最后：** 下方这份完整的软件测试视频学习教程已经整理上传完成，朋友们如果需要可以自行免费领取**`【保证100%免费】`**

![在这里插入图片描述][9d205f76a3bb49d8bce29972548618fa.png_pic_center]

这些资料，对于【软件测试】的朋友来说应该是最全面最完整的备战仓库，这个仓库也陪伴上万个测试工程师们走过最艰难的路程，希望也能帮助到你！

![ea309a97fa574feeba0851be84cd3e93.gif][]

[cccd2f5c581dc83afdf86a602a1dbd9d.jpeg]: https://img-blog.csdnimg.cn/img_convert/cccd2f5c581dc83afdf86a602a1dbd9d.jpeg
[9d205f76a3bb49d8bce29972548618fa.png_pic_center]: https://img-blog.csdnimg.cn/9d205f76a3bb49d8bce29972548618fa.png#pic_center
[ea309a97fa574feeba0851be84cd3e93.gif]: https://img-blog.csdnimg.cn/ea309a97fa574feeba0851be84cd3e93.gif