一种可视化界面的测试方法、系统、设备及介质技术方案

本申请涉及一种可视化界面的测试方法、系统、设备及介质，属于软件测试技术领域，其包括预设可视化界面的测试内容；获取测试内容对应的的目标设计图；获取测试内容对应的实际界面效果图；将目标设计图和实际界面效果图进行对比，生成实际界面效果图与目标设计图的相似度；判断相似度是否大于预设的相似度阈值，若是，则实际界面效果图的测试结果为通过。通过目标设计图和实际界面效果图对比的方式，得到实际界面效果图与目标设计图的相似度，从而便于判断开发处的实际界面效果图是否符合要求；本申请具有便于对开发出的可视化界面与设计图纸之间的还原度进行测试的效果。图纸之间的还原度进行测试的效果。图纸之间的还原度进行测试的效果。

【技术实现步骤摘要】
一种可视化界面的测试方法、系统、设备及介质


[0001]本专利技术涉及软件测试
，尤其是涉及一种可视化界面的测试方法、系统、设备及介质。

技术介绍

[0002]可视化界面是指利用计算机图形学和图像处理技术，将数据转换成图形或图像在屏幕上显示出来，并进行交互处理的理论、方法和技术，在开发可视化界面时通常需要提前设计好图纸，再根据图纸进行可视化界面的开发。
[0003]目前，对于软件中的可视化界面的测试通常采用UI自动化测试的方法，UI自动化测试是一种基于代码的测试方法，主要用于测试可视化界面的功能是否完好，例如，界面的所有按钮框是否有响应、界面中的链接是否正常、界面在不同浏览器之间是否兼容、展示的图片格式是否一致等内容。
[0004]针对上述中的相关技术，专利技术人发现采用UI测试的方法只能对可视化界面的功能是否完好进行测试，而有些行业或产品所需的可视化界面对页面展示性元素（如按钮形状、图像文字位置、页面布局等）要求较高，此时，则需要开发出的可视化界面与设计图纸有较高的还原度，利用UI测试的方法无法对开发出的可视化界面与设计图纸之间的还原度进行测试。

技术实现思路

[0005]为了便于对开发出的可视化界面与设计图纸之间的还原度进行测试，本申请提供了一种可视化界面的测试方法、系统、设备及介质。
[0006]第一方面，本申请提供的一种可视化界面的测试方法采用如下的技术方案：一种可视化界面的测试方法，包括：预设可视化界面的测试内容；获取测试内容对应的目标设计图；获取测试内容对应的实际界面效果图；将目标设计图和实际界面效果图进行对比，生成实际界面效果图与目标设计图的相似度；判断相似度是否大于预设的相似度阈值，若是，则实际界面效果图的测试结果为通过。
[0007]通过采用上述技术方案，预设需要测试的可视化界面的测试内容，根据测试内容获取对应的目标设计图以及实际界面效果图，将目标设计图和实际界面效果图进行对比，并生成实际界面效果图与目标设计图的相似度，相似度越高，则说明实际界面效果图对目标设计度的还原度越高，再判断相似度是否大于预设的相似度阈值，若大于相似度阈值，则说明实际界面效果图对目标设计度的还原度达到开发要求，即测试通过，从而实现了对实际界面效果图还原度的测试。
[0008]可选的，在预设可视化界面的测试内容之前，还包括:获取可视化界面对应的配置文件；根据所述配置文件，设置测试环境。
[0009]通过采用上述技术方案，根据可视化界面对应的配置文件设置测试环境，一方面使得可视化界面能够正常运行，另一方面便于保持测试的正常进行，减小了测试过程中出现错误的可能性。
[0010]可选的，所述获取测试内容对应的实际界面效果图包括：获取测试内容的目标地址；获取目标地址对应的界面图；将目标地址对应的界面图作为测试内容的实际界面效果图。
[0011]通过采用上述技术方案，先获取测试内容的目标地址，再根据目标地址得到该目标地址对应的界面图，此时得到的界面图即为测试内容的实时界面图，将界面图作为测试内容的实际界面效果图，实现了能够获取到实时的实际界面效果图进行测试。
[0012]可选的，所述将目标设计图和实际界面效果图进行对比，计算得到实际界面效果图与目标设计图的相似度，具体包括：分别对目标设计图和实际界面效果图进行灰度处理；将目标设计图和实际界面效果图分别缩小为n*n的缩略图；根据目标设计图的缩略图，计算目标设计图的缩略图的第一灰度像素矩阵，并获取第一灰度像素矩阵的平均值；根据实际界面效果图的缩略图，计算实际界面效果图的缩略图的第二灰度像素矩阵，并获取第二灰度像素矩阵的平均值；根据第一灰度像素矩阵的平均值，分别计算第一灰度像素矩阵中所有元素的离差，得到第一像素离差矩阵；根据第二灰度像素矩阵的平均值，分别计算第二灰度像素矩阵中所有元素的离差，得到第二像素离差矩阵；根据第一像素离差矩阵以及第二像素离差矩阵，计算目标设计图和实际界面效果图的相似度。
[0013]通过采用上述技术方案，先对目标设计图和实际界面效果图均进行灰度处理并缩小至n*n缩略图，便于提取目标设计图和实际界面效果图的特征，再根据n*n缩略图分别计算目标设计图的第一灰度像素矩阵以及实际界面效果图的第二灰度像素矩阵，从而对目标设计图和实际界面效果图的特征进行了提取，再通过计算第一灰度像素矩和第二灰度像素矩阵的平均值，分别得到第一像素离差矩阵和第二像素离差矩阵，通过第一像素离差矩阵和第二像素离差矩阵的比较，即可得到目标设计图和实际界面效果图的相似度。
[0014]可选的，所述根据第一像素离差矩阵以及第二像素离差矩阵，计算目标设计图和实际界面效果图的相似度，具体包括：计算第一像素离差矩阵与第二像素离差矩阵的汉明距离；根据汉明距离，计算目标设计图和实际界面效果图的相似度。
[0015]通过采用上述技术方案，计算第一像素离差矩阵和第二像素离差矩阵的汉明距离，通过汉明距离反映第一像素离差矩阵和第二像素离差矩阵的相近程度，从而即可得到
目标设计图和实际界面效果图的相似度。
[0016]可选的，所述n*n的缩略图采用32*32的缩略图。
[0017]通过采用上述技术方案，n*n的缩略图采用32*32的缩略图，一方面能够保留目标设计图和实际界面效果图的特征，另一方面使得运算量处于合理的范围内，提高测试速度。
[0018]可选的，还包括：生成测试日志，所述测试日志至少包括报错信息的记录以及测试结果的记录。
[0019]通过采用上述技术方案，生成测试日志便于记录报错信息以及测试结果，从而便于测试人员查看测试中发生的问题以及最终的测试结果。
[0020]第二方面，本申请提供的一种可视化界面的测试系统采用如下的技术方案：一种可视化界面的测试系统，包括：测试内容设置单元，用于预设可视化界面的测试内容；目标设计图获取单元，用于获取测试内容对应的目标设计图；实际界面效果图获取单元，用于获取测试内容对应的实际界面效果图；相似度生成单元，用于将目标设计图和实际界面效果图进行对比，生成实际界面效果图与目标设计图的相似度；测试结果生成单元，用于判断相似度是否大于预设的相似度阈值，若是，则实际界面效果图的测试结果为通过。
[0021]通过采用上述技术方案，利用测试内容设置单元预设测试内容，利用目标设计图获取单元获取测试内容的目标设计图，利用实际界面效果图获取单元获取测试内容的实际界面效果图，利用相似度生成单元生成实际界面效果图与目标设计图的相似度，利用测试结果生成单元判断相似度是否符合相似度阈值的要求，并生成测试结果。
[0022]第三方面，本申请提供的一种计算机设备，采用如下的技术方案：一种计算机设备，包括存储器、处理器以及储存在所述存储器上并可在所述处理器上运行的计算机程序，所述处理器执行如第一方面中任一所述的一种软件边缘部署方法。
[0023]第四方面，本申请提供的一种计算机可读存储介质，采用如下的技术方案：一种计算机可读存储介质，其特征在于，包括存储有能够被处理器加载并本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种可视化界面的测试方法，其特征在于，包括：预设可视化界面的测试内容；获取所述测试内容对应的目标设计图；获取所述测试内容对应的实际界面效果图；将所述目标设计图和所述实际界面效果图进行对比，生成所述实际界面效果图与所述目标设计图的相似度；判断所述相似度是否大于预设的相似度阈值，若是，则所述实际界面效果图的测试结果为通过。2.根据权利要求1所述的一种可视化界面的测试方法，其特征在于，在预设可视化界面的测试内容之前，还包括：获取所述可视化界面对应的配置文件；根据所述配置文件，设置测试环境。3.根据权利要求1所述的一种可视化界面的测试方法，其特征在于，所述获取测试内容对应的实际界面效果图包括：获取所述测试内容的目标地址；获取所述目标地址对应的界面图；将所述目标地址对应的界面图作为所述测试内容的实际界面效果图。4.根据权利要求1所述的一种可视化界面的测试方法，其特征在于，所述将目标设计图和实际界面效果图进行对比，计算得到实际界面效果图与目标设计图的相似度，具体包括：分别对所述目标设计图和所述实际界面效果图进行灰度处理；将所述目标设计图和所述实际界面效果图分别缩小为n*n的缩略图；根据所述目标设计图的缩略图，计算所述目标设计图的缩略图的第一灰度像素矩阵，并获取所述第一灰度像素矩阵的平均值；根据所述实际界面效果图的缩略图，计算所述实际界面效果图的缩略图的第二灰度像素矩阵，并获取所述第二灰度像素矩阵的平均值；根据所述第一灰度像素矩阵的平均值，分别计算所述第一灰度像素矩阵中所有元素的离差，得到第一像素离差矩阵；根据所述第二灰度像素矩阵的平均值，分别计算所述第二灰度像素矩阵中所有元素的离差，得到第二像素离差...

【专利技术属性】
技术研发人员：范源，赵天丽，张凯，吕梓岳，
申请(专利权)人：上海熙菱信息技术有限公司，
类型：发明
国别省市：