一、IS简介

IS（Inspiration Spaces，灵感空间）是一款由酷家乐Coohom团队开发的面向消费者的家具或定制行业营销产品，用户可以根据个人取向选择样板间，并以全景图形式查看样板间详情并进行内容素材替换，实现所见即所得。适用范围包括定制，成品，硬装在内的多个行业，目的是引导消费者以极简的方式经历一个方案设计过程，亲自选择喜欢的风格，刺激消费者的兴趣，成为高质量的商业线索，以促进企业后续电话沟通、店面访问、成单。

IS依赖定制、硬装、方案、渲染、酷品秀、Coohom等多个业务方，每个业务方更改代码后都可能会影响IS原有的功能：

而下游业务方只提供接口服务，对上游功能并不是很熟悉，且IS业务本身很复杂，业务方很难协助测试，因此业务方有改动时都会让Coohom测试帮忙回归，导致Coohom测试压力很大。需要寻找自动化的回归方式，提升测试效能，必要时候可以提供给合作业务方自行回归。

三、IS回归原理

3.1 IS原理

IS核心内容就是将底图和分层图数据传入合成器，再通过全景图模块展示出来的过程。

合成器模块

合成器模块使用全新的技术方案，即底图 + 分层图

分层图包含两个组成要素：商品图，当前商品在底图中的深度图。

合成器模块主要需要做的是，针对给定底图，以及选择的商品分层图，进行全景图单面的图片合成。合成完成后的纹理数据直接丢给全景图模块。进行单面替换。

全景图模块

全景图模块将在kapano当前代码中进行改造，添加对于单面替换的api功能支持。且支持webgl纹理数据直接传入。

3.2 回归原理

由IS原理可以看出，IS其实是由底图加分层图按照一定的顺序组合起来的全景图，而叠加顺序则由深层图去确定。如果要整体结果没有问题，那对应的每个底图以及每个商品的分层图和深层图必须都没问题。而一个商品的图层由上下左右前后六个面组成，分别由“u”，“d”，“l”，“r”，“f”，“b”标注，需要保证这六个面与预期设定的图均保持一致即可。

确定完两个唯一对应的图层后，如何判断这两个图层里面的内容是一致，则需要对比图片，本文采用的是SSIM(Structural Similarity)，结构相似性算法。因为人类对像素的绝对亮度/颜色不敏感，但对边缘和纹理的位置非常敏感， SSIM 通过主要关注边缘和纹理相似性来模仿人类感知。通过计算两个图片的相似度得分，得分越接近1，则表示这两个图片越相似，参考文档：http://www.opencv.org.cn/opencvdoc/2.3.2/html/doc/tutorials/highgui/video-input-psnr-ssim/video-input-psnr-ssim.html#videoinputpsnrmssim，http://www.opencv.org.cn/opencvdoc/2.3.2/html/doc/tutorials/gpu/gpu-basics-similarity/gpu-basics-similarity.html

SSIM也是一种全参考的图像质量评价指标，它分别从亮度、对比度、结构三方面度量图像相似性。

分别表示图像X和Y的均值，

表示图像X和Y的方差，

表示图像X和Y的协方差，即：

image2023-3-9_15-45-37.png?version=1&modificationDate=1678714545000&api=v2

为常数，为了避免分母为0的情况，通常取

SSIM取值范围[0,1]，值越大，表示图像失真越小，核心代码如下：

但由于渲染降级或其它因素导致一些“噪点”，导致渲染图可能不是完全一样的，因此，对比图片的时候，不会要求每张图片相似度达到100%，而是需要设定一个阈值，达到阈值即可。

3.3 回归方案

想要回归一个IS灵感空间，后台需经过如下步骤：

上述步骤，如果手动回归，除了次数频繁外，还有以下三个痛点：

每次回归时都需要手动去选风格项和替换项，总共有包括定制、成品、硬装在内的17个风格项，每个风格项至少要选2个替换商品，到达商品页面的时候，还需要点击3次，所以在不分组的情况下，覆盖所有业务线，至少要点击17*（2+3）=85次；如果分了组，柜体每分一个组，需要加3个风格项，则增加15次点击，非常耗时；

2. 点击开始渲染后，开始离线渲染，需要等上一段时间再去看结果，这个时间具有不确定性，需要依据渲染当前的空闲机器情况，有时几分钟就出结果了，有时甚至一天才出结果，而有没有出结果需要人肉去后台看下，也增加了时间成本；

3. 渲染结果出来后，需要人工去查看结果是否正确，有些虽然有深层图出来，但是图层不正确；有的根本就没有图，所以每个风格项都要查看一遍，如果手动操作，则需要至少需点击17*2=34次。

可以看出，如果回归一个样板间，在最小人工成本范围内，需要点击至少119次，再加上中间等待的时间，几个小时就过去了。但幸运的是，从选方案到设置锚点，都可以通过预制样板间的方式，我们要做的就是设置不同的预制样板间（测试用例），覆盖到所有的业务线，每次后端或者业务方更改之后，可以用这些样板间参数重新提交渲染；

另外，提交渲染后，由于后台是异步渲染，返回时间不定，因此，我们后台也会设置一个异步任务定时器，每30s查询一次任务是否完成，最多监控10小时，10小时还没渲染完成就放弃（与渲染后台每个任务的超时时间保持一致）;

检测到样板间渲染完成后，可以开始图片对比任务，由于之前用python写好了图片对比函数，可以直接启动一个轻量级的web框架即可，传入原始图层和目标图层url，返回这两个图层的尺寸以及相似度得分。本文采用的是Bottle库，Bottle是一个超轻量级的python库。说是库，其本身只由一个4000行左右的文件构成，并且不需要任何依赖，只靠python标准库即可运作。

至此，整个回归流程就可以串起来了。首先，准备一些回归样板间，这些样板间需要覆盖所有的业务线场景；如果后端或者协作业务方修改了代码，用预制的样板间参数重新提交渲染，同时，后台启动一个异步定时任务轮询样板间状态；待渲染完成后，获取新样板间图层，与原始样板间各图层对比，得出相似度得分。由此，只需一键点击，可以解决上述3个痛点：

选样板间替换商品——>预置样板间生成信息；

等待渲染结果——>异步轮询，成功后自动进行下一步；

人工对比——>分层图自动对比。

四、回归系统框架

五、系统序图

六、结果展示

主要分为两个页面，第一个页面展示预制样板间列表，其中包括每个样板间的渲染状态、对比情况等，第二个页面展示每个样板间各个图层间的对比得分情况。

由上图看出，有个样板间结果异常，这个样板间有三个图层得分太低，分析具体图层，发现新渲的把手中间都出现“虚化”的现象，与预期不符，可能出bug了，需要具体排查原因。

https://qhrenderpicoss.kujiale.com/multilayer/L3D223S111B9ENDP2B3SUFSGT7PILUF3P3WU888/5_object.png_f
https://qhrenderpicoss.kujiale.com/multilayer/L3D223S111B9ENDPZULRWFSGT22WLUF3P3WQ888/3_object.png_f

7.1 收益

1.实现这个平台后，后续下游业务方如果有改造，可以零基础，零成本在平台上回归，无需学习IS功能；

2.能够有效检测下游服务改动导致的渲染异常，消除人为的主观因素，使得测试结果更加准确和可靠，目前为止，这个平台已经帮Coohom发现5个潜在的线上故障，包括定制内参改动导致的门板丢失，渲染参数改动导致的平面图“花面”等问题；

3.也能快速执行测试用例，比手动测试更快速和高效，每次发版前跑一遍，能够大大减轻Coohom测试的回归压力，节省至少2个小时的时间；

7.2 问题及改进

本平台是酷家乐Coohom测试对于导购展示类产品自动化回归做的一次新尝试，但是目前只做了一个初版，后续还有很多优化的地方：

1.涉及的图层太多，图片对比运行时间过长，需要优化对比时间，可以采用多线程的方式；

2.有些图层尺寸太小，只要出现一点差异，就会导致得分太低，但其实这种差异可以忽略不计，需要有个合理范围内的容错处理；

3.目前所有分辨率都是同一个阈值，宽高大小直接对数值精度有影响，需要针对不同分辨率设置不同的阈值，最好能联合开发，让合成sdk开放个api，直接用当前的6面合成图的数据做对比；

IS自动化回归方案

一、IS简介

三、IS回归原理

3.1 IS原理

3.2 回归原理

3.3 回归方案

四、回归系统框架

五、系统序图

六、结果展示

7.1 收益

7.2 问题及改进

Recommend

kudiffy-一个很酷的自动化回归平台

自动化回归环境搭建复盘

自动化回归测试全接触：概念、方法和实践

自动化 Web 性能优化分析方案

AccessibilityService + Flutter + Node.js的自动化控制方案小探

得物技术浅谈自动化生成代码几种方案的演变

【得物技术】自动化生成代码几种方案的演变

Flutter UI自动化测试技术方案选型与探索

APISIX运维优化之配置文件自动化生成方案

自动化视觉回归测试的四种方法

About Joyk