CN110554957B - 测试用户界面的方法、装置、电子设备及可读存储介质 - Google Patents

Abstract

本申请实施例提供了一种测试用户界面的方法、装置、电子设备及可读存储介质，旨在提高检测效率。所述方法包括：针对参考用户界面上的目标界面模块，获得该目标界面模块的视图层级树，该视图层级树包括的各个节点分别对应该目标界面模块的各个界面元素；从所述视图层级树中确定多个目标界面元素；基于所述多个目标界面元素，执行快照操作，得到参考图；根据所述多个目标界面元素，从待测用户界面获取多个待测界面元素，所述多个待测界面元素与所述多个目标界面元素一一对应；基于所述多个待测界面元素，执行快照操作，得到测试图；将所述测试图与所述参考图进行相似性对比，得到测试结果。

Description

测试用户界面的方法、装置、电子设备及可读存储介质

技术领域

本申请实施例涉及数据处理技术领域，尤其涉及一种测试用户界面的方法、装置、电子设备及可读存储介质。

背景技术

随着互联网技术的发展和人们对各类应用软件需求的增长，各应用软件的版本更新速度越来越快，软件的用户界面所集成的功能也越来越丰富，目的在于满足人们在生活、工作、娱乐等各方面的需求，并同时提高应用软件的市场占有率。

通常情况下，软件开发人员需要针对目标软件的各个版本的对应用户界面，或者针对目标软件的目标版本的各级用户界面，确定各用户界面之间的差异，从而确定用户界面的布局是否合理性。

相关技术中，软件开发人员针对待测界面中的多个界面元素，通过逐项生成对应的测试用例，并逐项进行代码逻辑测试，以确定待测界面的元素与参考界面的元素之间是否存在差异。然而，采用上述测试方法对用户界面进行检测时，为了不遗漏测试点，保证检测的覆盖率，软件测试人员需要花费较多时间和精力编写大量的测试用例，导致检测效率低。

发明内容

本申请实施例提供一种测试用户界面的方法、装置、电子设备及可读存储介质，旨在提高检测效率。

本申请实施例第一方面提供了一种测试用户界面的方法，所述方法包括：

针对参考用户界面上的目标界面模块，获得该目标界面模块的视图层级树，该视图层级树包括的各个节点分别对应该目标界面模块的各个界面元素；

从所述视图层级树中确定多个目标界面元素；

基于所述多个目标界面元素，执行快照操作，得到参考图；

根据所述多个目标界面元素，从待测用户界面获取多个待测界面元素，所述多个待测界面元素与所述多个目标界面元素一一对应；

基于所述多个待测界面元素，执行快照操作，得到测试图；

将所述测试图与所述参考图进行相似性对比，得到测试结果。

可选地，从所述视图层级树中确定多个目标界面元素，包括：

从所述视图层级树中剔除动态界面元素；

将所述视图层级树中剩余的界面元素确定为多个目标界面元素。

可选地，从所述视图层级树中剔除动态界面元素，包括：

基于所述视图层级树包括的各个界面元素，执行快照操作，得到操作图；

显示所述操作图；

接收用户针对所述操作图中第一指定界面元素的剔除指令；

响应于该剔除指令，将所述第一指定界面元素作为动态界面元素，并剔除该第一指定界面元素。

可选地，从所述视图层级树中剔除动态界面元素，包括：

基于剔除所述第一指定界面元素后，所述视图层级树中的剩余界面元素，执行快照操作，得到第一对照图；

在经过预设时间段后，基于所述视图层级树中的剩余界面元素，执行快照操作，得到第二对照图；

显示所述第一对照图和所述第二对照图；

接收用户针对所述第一对照图或所述第二对照图中第二指定界面元素的剔除指令；

响应于该剔除指令，将所述第二指定界面元素作为动态界面元素，并剔除该第二指定界面元素。

可选地，所述方法还包括：

基于所述多个目标界面元素，生成参考视图层级树，并保存该参考视图层级树，该参考视图层级树包括的各个节点分别对应各个目标界面元素；

根据所述多个目标界面元素，从待测用户界面获取多个待测界面元素，包括：

根据预存的所述参考视图层级树，从待测用户界面获取多个待测界面元素。

可选地，将所述测试图与所述参考图进行相似性对比，包括：

将所述测试图上的各个像素点分别与所述参考图上的相应像素点进行对比。

可选地，所述方法还包括：

在所述测试结果表征所述测试图与所述参考图之间的相似度小于预设阈值的情况下，确定所述测试图与所述参考图之间的差异；

对所述差异进行可视化，得到差异图像；

显示所述差异图像。

本申请实施例第二方面提供一种测试用户界面的装置，所述装置包括：

视图层级树获得模块，用于针对参考用户界面上的目标界面模块，获得该目标界面模块的视图层级树，该视图层级树包括的各个节点分别对应该目标界面模块的各个界面元素；

目标界面元素确定模块，用于从所述视图层级树中确定多个目标界面元素；

参考图获得模块，用于基于所述多个目标界面元素，执行快照操作，得到参考图；

待测界面元素获取模块，用于根据所述多个目标界面元素，从待测用户界面获取多个待测界面元素，所述多个待测界面元素与所述多个目标界面元素一一对应；

测试图获得模块，用于基于所述多个待测界面元素，执行快照操作，得到测试图；

相似性对比模块，用于将所述测试图与所述参考图进行相似性对比，得到测试结果。

可选地，所述目标界面元素确定模块包括：

动态界面元素剔除子模块，用于从所述视图层级树中剔除动态界面元素；

目标界面元素确定子模块，用于将所述视图层级树中剩余的界面元素确定为多个目标界面元素。

可选地，所述动态界面元素剔除子模块包括：

操作图获得子单元，用于基于所述视图层级树包括的各个界面元素，执行快照操作，得到操作图；

第一显示子单元，用于显示所述操作图；

第一指令接收子单元，用于接收用户针对所述操作图中第一指定界面元素的剔除指令；

第一剔除子单元，用于响应于该剔除指令，将所述第一指定界面元素作为动态界面元素，并剔除该第一指定界面元素。

可选地，所述动态界面元素剔除子模块包括：

第一对照图获得子单元，用于基于剔除所述第一指定界面元素后，所述视图层级树中的剩余界面元素，执行快照操作，得到第一对照图；

第二对照图获得子单元，用于在经过预设时间段后，基于所述视图层级树中的剩余界面元素，执行快照操作，得到第二对照图；

第二显示子单元，用于显示所述第一对照图和所述第二对照图；

第二指令接收子单元，用于接收用户针对所述第一对照图或所述第二对照图中第二指定界面元素的剔除指令；

第二剔除子单元，用于响应于该剔除指令，将所述第二指定界面元素作为动态界面元素，并剔除该第二指定界面元素。

可选地，所述装置还包括：

参考视图层级树生成模块，用于基于所述多个目标界面元素，生成参考视图层级树，并保存该参考视图层级树，该参考视图层级树包括的各个节点分别对应各个目标界面元素；

所述待测界面元素获取模块包括：

待测界面元素获取子模块，用于根据预存的所述参考视图层级树，从待测用户界面获取多个待测界面元素。

可选地，所述相似性对比模块包括：

像素点对比子模块，用于将所述测试图上的各个像素点分别与所述参考图上的相应像素点进行对比。

可选地，所述装置还包括：

差异确定模块，用于在所述测试结果表征所述测试图与所述参考图之间的相似度小于预设阈值的情况下，确定所述测试图与所述参考图之间的差异；

差异图像获得模块，用于对所述差异进行可视化，得到差异图像；

差异图像显示模块，用于显示所述差异图像。

本申请实施例第三方面提供一种计算机可读存储介质，其上存储有计算机程序，该计算机程序被处理器执行时，实现如本申请第一方面所述的方法中的步骤。

本申请实施例第四方面提供一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述计算机程序时，实现本申请第一方面所述的方法的步骤。

采用本申请实施例提供的测试用户界面的方法，一方面，针对参考用户界面上的目标界面模块，获得其视图层级树，然后从视图层级树确定需要作为参考的目标界面元素，再针对这些目标界面元素执行快照操作，从而快速获得参考图。另一方面，针对待测用户界面，根据多个目标界面元素，一一对应地从待测用户界面获取多个待测界面元素，然后对这些待测界面元素执行快照操作，从而快速获得测试图。最后，将参考图和测试图进行相似度对比，以迅速获得测试结果，从而提高了检测效率。

附图说明

为了更清楚地说明本申请实施例的技术方案，下面将对本申请实施例的描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。

图1是本申请一实施例提出的测试用户界面的方法的流程图；

图2是本申请一实施例提出的用户界面的示意图；

图3是本申请一实施例提出的视图层级树的示意图；

图4是本申请一实施例提出的操作图的示意图；

图5是本申请另一实施例提出的测试用户界面的方法的流程图；

图6是本申请一实施例提出的参考图、测试图及差异图像的示意图；

图7是本申请一实施例提出的测试用户界面的装置的示意图。

具体实施方式

下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有作出创造性劳动的前提下所获得的所有其他实施例，均应属于本申请保护的范围。

相关技术中，软件开发人员在多种应用场景下，都会产生对两个用户界面进行对比测试的需求。例如，软件在版本更新后，软件开发人员需要检测新版本的用户界面与旧版本的用户界面之间的差异。又例如，对于软件中的不同用户界面，可能会使用到某些相同的界面模块，如导航模块、分类模块等等，软件开发人员需要针对不同用户界面之间共有的界面模块进行检测，以确定两用户界面的界面模块是否统一。此外，还有其他多种应用场景需要软件开发人员对用户界面进行测试，为节省篇幅，本申请不作一一介绍。

本申请发明人发现，在测试期间，软件开发人员需要针对待测界面中的多个界面元素，逐项生成对应的测试用例，并逐项进行代码逻辑层次的测试，从而确定待测界面的元素与参考界面的元素之间是否存在差异。然而，采用上述测试方法对用户界面进行检测时，为了不遗漏测试点，保证检测的覆盖率，软件测试人员需要花费较多时间和精力编写大量的测试用例，导致检测效率低。

有鉴于此，本申请发明人另辟蹊径，针对参考用户界面快速生成参考图，并针对待测用户界面快速生成测试图，然后基于参考图和测试图，从图像层次对参考用户界面和待测用户界面进行对比，从而快速得到待测用户界面的测试结果，以提高检测效率。

参考图1，图1是本申请一实施例提出的测试用户界面的方法的流程图。如图1所示，该方法包括以下步骤：

步骤S11：针对参考用户界面上的目标界面模块，获得该目标界面模块的视图层级树，该视图层级树包括的各个节点分别对应该目标界面模块的各个界面元素。

本实施例中，参考用户界面可以是两个需要进行对比的用户界面中的任一用户界面。或者，在某些应用场景下，当软件的功能经过检测确保无误后，将该软件当前的用户界面作为参考用户界面。如果该软件后期被更新，则将软件更新后的用户界面作为待测用户界面。

本实施例中，界面模块是指在用户界面中，为实现某种功能的多个界面元素的集成。例如，用户界面中通常可以包括：登录模块、导航模块、分类模块、搜索模块、图片展示模块、评论模块等用户界面模块。一个界面模块中通常又集成了多个界面元素，例如文字、图形、边框、按键等界面元素。参考图2，图2是本申请一实施例提出的用户界面的示意图。如图2所示，该用户界面中包括导航模块和登录模块，其中导航模块中又包括“企业邮箱”、“国外用户登录”等文字界面元素，以及两文字界面元素之间的“│”图形界面元素。

本实施例中，目标界面模块是指参考用户界面中需要参与对比的界面模块。目标界面模块可以是参考用户界面中的部分界面模块，也可以是参考用户界面中的全部界面模块。

本实施例中，针对目标界面模块获得视图层级树的方式可以有多种，本申请对具体的获得方式不作限定。参考图3，图3是本申请一实施例提出的视图层级树的示意图。如图3所示，该视图层级树包括多个节点，每个节点对应目标界面模块的一个界面元素。视图层级树中的各节点是可编辑的，例如可以删除其中的某些节点，从而得到新的视图层级树。

示例地，可以针对目标界面模块进行递归计算，从而逐层生成视图层级树。或者，可以利用软件开发工具包自带的Hierarchy Viewer工具，针对目标界面模块生成视图层级树。

步骤S12：从所述视图层级树中确定多个目标界面元素。

本实施例中，目标界面元素是指目标界面模块中需要参与对比的界面元素。目标界面元素可以是目标界面模块中的部分界面元素，也可以是目标界面模块中的全部界面元素。

考虑到用户界面中可能存在一个或多个动态界面元素，例如时钟、倒计时、用户定位、用户行动轨迹等动态界面元素，这些动态界面元素随着时间的变化，其展示在用户界面上的图形也会产生变化。基于此，在从视图层级树中确定多个目标界面元素时，可具体包括以下步骤：

步骤S12-1：从所述视图层级树中剔除动态界面元素；

步骤S12-2：将所述视图层级树中剩余的界面元素确定为多个目标界面元素。

示例地，假设某视图层级树是针对订餐软件中骑手定位模块所生成的视图层级树，该视图层级树中包括送餐倒计时和骑手定位等两个动态界面元素。于是可以将送餐倒计时和骑手定位这两个动态界面元素从该视图层级树中剔除，然后将该视图层级树中剩余的多个界面元素确定为多个目标界面元素。

通过执行上述步骤S12-1和步骤S12-2，将动态界面元素从视图层级树中剔除，并将剩余的界面元素确定为目标界面元素，可以减轻动态因素对后续测试步骤的干扰，使得后续生成的参考图中仅包括少量或不包括动态因素，进而提高参考图的标准性和可靠性。

此外，又考虑到本申请技术方案在实施期间，软件开发人员可以介入用户界面的测试过程，手动地从视图层级树中剔除动态界面元素。在软件开发人员选择手动剔除动态界面元素的情况下，为了便于软件开发人员从视图层级树包括的多个界面元素中快速区分出动态界面元素，在执行步骤S12-1时，可具体包括以下步骤：

基于所述视图层级树包括的各个界面元素，执行快照操作，得到操作图；显示所述操作图；接收用户针对所述操作图中第一指定界面元素的剔除指令；响应于该剔除指令，将所述第一指定界面元素作为动态界面元素，并剔除该第一指定界面元素。

参考图4，图4是本申请一实施例提出的操作图的示意图。如图4所示，该操作图中包括视图层级树中各界面元素的图形。其中，左上角文字界面元素“配”的上标“11”这一数字界面元素可被快速确定为动态界面元素。

通过执行上述步骤，针对视图层级树包括的各个界面元素生成操作图，使得整个视图层级树以图形化的方式展示给软件开发人员。基于此，软件开发人员可以从操作图中更直观地肉眼辨别出动态界面元素，以至于在从操作图中确定出动态界面元素后，将该动态界面元素作为第一指定界面元素，输入针对该第一指定界面元素的剔除指令，从而进一步提高检测效率。

示例地，基于各个界面元素，执行快照操作，得到操作图的具体方式可以是：针对视图层级树一层层地进行快照，然后将各层对应的快照结果进行拼接，得到操作图。或者，也可以直接对整个视图层级树执行整体的快照操作，得到操作图。具体地，例如可采用底层的renderInContext工具，对视图层级树的各层或者视图层级树整体执行快照操作。

示例地，所述操作图中每个界面元素可以携带标识，并且各界面元素的标识可以覆盖在各界面元素的图形上。相应地，视图层级树中相应界面元素也携带对应标识。软件开发人员在从操作图中确定出动态界面元素后，可以输入该动态界面元素的标识，从而使得视图层级树中携带相同标识的界面元素被剔除。其中，软件开发人员输入标识的过程相当于用户输入剔除指令的过程。

或者示例地，操作图中多个界面元素各自的图形与视图层级树中各界面元素一一对应，软件开发人员在从操作图中确定出动态界面元素后，可以点击该动态界面元素的图形，从而使得视图层级树中与被点击图形对应的界面元素被剔除。其中，软件开发人员点击图形的过程相当于用户输入剔除指令的过程。

应当理解的，本申请对于用户以何种方式输入剔除指令不作限定，相应地，对于测试系统以何种方式接收用户输入的提出指令也不作限定。上述示例仅作为本申请多种可实施方式的举例。

此外，还考虑到对于一些对业务不熟悉的软件开发人员，或者对于一些软件开发新手，在根据操作图确定动态界面元素时，可能难以一次性地从操作图中锁定全部的动态界面元素。基于此，为了进一步便于软件开发人员从视图层级树包括的多个界面元素中快速区分出动态界面元素，在执行步骤S12-1时，还可以具体包括以下步骤：

基于剔除所述第一指定界面元素后，所述视图层级树中的剩余界面元素，执行快照操作，得到第一对照图；在经过预设时间段后，基于所述视图层级树中的剩余界面元素，执行快照操作，得到第二对照图；显示所述第一对照图和所述第二对照图；接收用户针对所述第一对照图或所述第二对照图中第二指定界面元素的剔除指令；响应于该剔除指令，将所述第二指定界面元素作为动态界面元素，并剔除该第二指定界面元素。

通过执行上述步骤，如果在从视图层级树中剔除第一指定界面元素后，视图层级树中还存在一些没有被剔除的动态界面元素，则先后生成的第一对照图和第二对照图中，这些动态界面元素的图形将发生变化。基于此，软件开发人员可以较容易地肉眼捕捉到这些变化，从而更快速地确定出被遗漏的动态界面元素，并将这些遗漏的动态界面元素作为第二指定界面元素，输入针对该第二指定界面元素的剔除指令，从而进一步提高检测效率。

示例地，在从视图层级树中剔除第一指定界面元素后，对剩余界面元素执行快照操作，得到第一对照图。假设剩余界面元素中还包括一个倒计时界面元素，得到的第一对照图中，该倒计时界面元素的图形显示的是“15分32秒”。在经过5秒的预设时间段后，对剩余界面元素再次执行快照操作，得到第二对照图。第二对照图中，该倒计时界面元素的图形显示的是“15分27秒”。将第一对照图和第二对照图显示给软件开发人员后，软件开发人员可以较容易地捕捉到这一图形变化，从而将该倒计时界面元素确定为动态界面元素。

应当理解的，步骤S12-1也可以在没有软件开发人员介入的情况下，被测试系统自动执行。例如，测试系统首先针对视图层级树中的所有界面元素生成第三对照图，然后在经过预设时间段后，针对视图层级树中的所有界面元素生成第四对照图。然后将第三对照图和第四对照图进行像素级对比，找出两者之间的差异图形，从而将差异图形对应的界面元素确定为动态界面元素，并剔除。

步骤S13：基于所述多个目标界面元素，执行快照操作，得到参考图。

本实施例中，对于如何进行快照操作，以得到参考图，本申请对此不作限定。

示例地，基于各个目标界面元素，执行快照操作，得到参考图的具体方式可以是：在视图层级树被剔除一些非目标界面元素，而保留目标界面元素后，对该视图层级树一层层地进行快照，然后将各层对应的快照结果进行拼接，得到参考图。或者，也可以直接对该视图层级树执行整体的快照操作，得到参考图。具体地，例如可采用底层的renderInContext工具，对该视图层级树的各层或者该视图层级树整体执行快照操作。

步骤S14：根据所述多个目标界面元素，从待测用户界面获取多个待测界面元素，所述多个待测界面元素与所述多个目标界面元素一一对应。

本实施例中，待测用户界面可以是两个需要进行对比的用户界面中，相对于参考用户界面的另一个用户界面。或者，在某些应用场景下，在早期时，当软件的功能经过检测确保无误后，将软件当时的用户界面作为参考用户界面。后期该软件被更新，则将软件更新后的用户界面作为待测用户界面。

示例地，假设参考用户界面和待测目标界面均包括导航模块，测试任务是针对待测用户界面的导航模块进行测试，以确定待测用户界面的导航模块与参考用户界面的导航模块之间是否存在差异。假设通过步骤S11和步骤S12，从参考用户界面的导航模块包括的15个界面元素中，确定出标识分别为1、2、3、7、8、11、12、13、14和15的十个界面元素为目标界面元素。于是根据这十个目标界面元素，从待测用户界面的导航模块中，确定出标识分别为1、2、3、7、8、11、12、13、14和15的十个界面元素为待测界面元素。

应当理解的，上述示例仅用于说明多个待测界面元素与多个目标界面元素之间具有一一对应的关系，至于上述示例中界面模块配置有标识，或者标识的具体形式是数字形式，并不用于限定本申请。

一方面，本实施例中，为了获取多个待测界面元素，可以借鉴步骤S11和步骤S12中，确定多个目标界面元素的方法。换言之，可以针对待测界面元素的待测界面模块生成视图层级树，然后对该视图层级树中的界面元素进行筛选、剔除等操作，进而获取到多个待测界面元素。

另一方面，本实施例中，为了更快速地获取多个待测界面元素，在执行步骤S14之前，还可以首先基于所述多个目标界面元素，生成参考视图层级树，并保存该参考视图层级树，该参考视图层级树包括的各个节点分别对应各个目标界面元素。然后在执行步骤S14时，具体根据预存的所述参考视图层级树，从待测用户界面获取多个待测界面元素。

其中，根据预存的参考视图层级树，从待测用户界面获取多个待测界面元素，可以简化获取多个待测界面元素的步骤流程，不需要再对待测用户界面的待测界面模块生成的视图参考树进行筛选、剔除等操作，从而进一步提高检测效率。

沿用上述示例，假设通过步骤S11和步骤S12，从参考用户界面的导航模块包括的15个界面元素中，确定出标识分别为1、2、3、7、8、11、12、13、14和15的十个界面元素为目标界面元素。然后针对这十个目标界面元素，生成参考视图层级树。或者，将剔除标识分别为4、5、6、9和10的界面元素后的视图层级树，确定为参考视图层级树。在确定参考视图层级树后，存储该参考视图层级树。后续需要针对待测用户界面执行步骤S14时，可以根据该预存的参考视图层级树所包括的各目标界面元素，从待测用户界面中确定出多个待测界面元素。

步骤S15：基于所述多个待测界面元素，执行快照操作，得到测试图。

本实施例中，对于如何进行快照操作，以得到测试图，本申请对此不作限定。

示例地，基于各个待测界面元素，执行快照操作，得到测试图的具体方式可以是：对多个待测界面元素对应的视图层级树一层层地进行快照，然后将各层对应的快照结果进行拼接，得到测试图。或者，也可以直接对该视图层级树执行整体的快照操作，得到测试图。具体地，例如可采用底层的renderInContext工具，对该视图层级树的各层或者该视图层级树整体执行快照操作。

步骤S16：将所述测试图与所述参考图进行相似性对比，得到测试结果。

本实施例中，对于如何进行相似性对比，本申请对此不作限定。

示例地，可以将测试图和参考图输入预先训练好的图像对比模型，该图像对比模型可输出测试图和参考图之间的相似度，作为测试结果。

或者示例地，可以将所述测试图上的各个像素点分别与所述参考图上的相应像素点进行对比。具体地，例如可以比较两像素点之间的RGB分值是否相等，和/或比较两像素点之间的透明度Alpha是否相等。通过对测试图和参考图进行像素级对比，可以更准确地确定出两者之间的差异，提高检测的精准性。并且针对一些差异较小的异形界面元素，也可以进行有效检测。

通过执行上述包括步骤S11至步骤S16的测试用户界面的方法，针对参考用户界面快速生成参考图，并针对待测用户界面快速生成测试图，然后基于参考图和测试图，对参考用户界面和待测用户界面进行对比，一方面，可以快速得到待测用户界面的测试结果，以提高检测效率。另一方面，针对用户待测的界面模块，可以从图像层次进行图像级对比，对于一些难以通过代码逻辑检测的异形界面元素，也可以有效地实施检测，提高了该方法的适应性。

此外，参考图5，图5是本申请另一实施例提出的测试用户界面的方法的流程图。如图5所示，该方法除了包括步骤S51至步骤S56外，还包括以下步骤：

步骤S57：在所述测试结果表征所述测试图与所述参考图之间的相似度小于预设阈值的情况下，确定所述测试图与所述参考图之间的差异；

步骤S58：对所述差异进行可视化，得到差异图像；

步骤S59：显示所述差异图像。

示例地，在测试结果表征的相似度小于预设阈值的情况下，可以通过Myers差分算法确定测试图与参考图之间的差分数据diff。然后对该差分数据diff进行可视化，得到差异图像，并显示该差异图像。

参考图6，图6是本申请一实施例提出的参考图、测试图及差异图像的示意图。如图6所示，图6中左侧子图表示参考图，中间子图表示测试图，右侧子图表示差异图像。根据可视化的差异图像可以确定，参考图与测试图之间的差异是一个用于指示定位地点的图形。

需要说明的是，附图中，图2、图3、图4以及图6分别对应不同实施例各自的用户界面、视图层级树、操作图、参考图、测试图及差异图像等。由于图2、图3、图4以及图6并不是针对一个测试任务的不同测试阶段的附图，因此图2、图3、图4以及图6各自所示的内容并不具有直接的相互照应关系。

基于同一发明构思，本申请一实施例提供一种测试用户界面的装置。参考图7，图7是本申请一实施例提供的测试用户界面的装置的示意图。如图7所示，该装置包括：

视图层级树获得模块71，用于针对参考用户界面上的目标界面模块，获得该目标界面模块的视图层级树，该视图层级树包括的各个节点分别对应该目标界面模块的各个界面元素；

目标界面元素确定模块72，用于从所述视图层级树中确定多个目标界面元素；

参考图获得模块73，用于基于所述多个目标界面元素，执行快照操作，得到参考图；

待测界面元素获取模块74，用于根据所述多个目标界面元素，从待测用户界面获取多个待测界面元素，所述多个待测界面元素与所述多个目标界面元素一一对应；

测试图获得模块75，用于基于所述多个待测界面元素，执行快照操作，得到测试图；

相似性对比模块76，用于将所述测试图与所述参考图进行相似性对比，得到测试结果。

可选地，所述目标界面元素确定模块包括：

动态界面元素剔除子模块，用于从所述视图层级树中剔除动态界面元素；

目标界面元素确定子模块，用于将所述视图层级树中剩余的界面元素确定为多个目标界面元素。

可选地，所述动态界面元素剔除子模块包括：

操作图获得子单元，用于基于所述视图层级树包括的各个界面元素，执行快照操作，得到操作图；

第一显示子单元，用于显示所述操作图；

第一指令接收子单元，用于接收用户针对所述操作图中第一指定界面元素的剔除指令；

第一剔除子单元，用于响应于该剔除指令，将所述第一指定界面元素作为动态界面元素，并剔除该第一指定界面元素。

可选地，所述动态界面元素剔除子模块包括：

第一对照图获得子单元，用于基于剔除所述第一指定界面元素后，所述视图层级树中的剩余界面元素，执行快照操作，得到第一对照图；

第二对照图获得子单元，用于在经过预设时间段后，基于所述视图层级树中的剩余界面元素，执行快照操作，得到第二对照图；

第二显示子单元，用于显示所述第一对照图和所述第二对照图；

第二指令接收子单元，用于接收用户针对所述第一对照图或所述第二对照图中第二指定界面元素的剔除指令；

第二剔除子单元，用于响应于该剔除指令，将所述第二指定界面元素作为动态界面元素，并剔除该第二指定界面元素。

可选地，所述装置还包括：

参考视图层级树生成模块，用于基于所述多个目标界面元素，生成参考视图层级树，并保存该参考视图层级树，该参考视图层级树包括的各个节点分别对应各个目标界面元素；

所述待测界面元素获取模块包括：

待测界面元素获取子模块，用于根据预存的所述参考视图层级树，从待测用户界面获取多个待测界面元素。

可选地，所述相似性对比模块包括：

像素点对比子模块，用于将所述测试图上的各个像素点分别与所述参考图上的相应像素点进行对比。

可选地，所述装置还包括：

差异确定模块，用于在所述测试结果表征所述测试图与所述参考图之间的相似度小于预设阈值的情况下，确定所述测试图与所述参考图之间的差异；

差异图像获得模块，用于对所述差异进行可视化，得到差异图像；

差异图像显示模块，用于显示所述差异图像。

基于同一发明构思，本申请另一实施例提供一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现如本申请上述任一实施例所述的方法中的步骤。

基于同一发明构思，本申请另一实施例提供一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行时实现本申请上述任一实施例所述的方法中的步骤。

对于装置实施例而言，由于其与方法实施例基本相似，所以描述的比较简单，相关之处参见方法实施例的部分说明即可。

本说明书中的各个实施例均采用递进的方式描述，每个实施例重点说明的都是与其他实施例的不同之处，各个实施例之间相同相似的部分互相参见即可。

本领域内的技术人员应明白，本申请实施例的实施例可提供为方法、装置、或计算机程序产品。因此，本申请实施例可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本申请实施例可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。

本申请实施例是参照根据本申请实施例的方法、终端设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理终端设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理终端设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理终端设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理终端设备上，使得在计算机或其他可编程终端设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程终端设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

尽管已描述了本申请实施例的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例做出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本申请实施例范围的所有变更和修改。

最后，还需要说明的是，在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者终端设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者终端设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者终端设备中还存在另外的相同要素。

以上对本申请所提供的一种测试用户界面的方法、装置、电子设备及可读存储介质，进行了详细介绍，本文中应用了具体个例对本申请的原理及实施方式进行了阐述，以上实施例的说明只是用于帮助理解本申请的方法及其核心思想；同时，对于本领域的一般技术人员，依据本申请的思想，在具体实施方式及应用范围上均会有改变之处，综上所述，本说明书内容不应理解为对本申请的限制。

Claims (12)

1.一种测试用户界面的方法，其特征在于，所述方法包括：

针对参考用户界面上的目标界面模块，获得该目标界面模块的视图层级树，该视图层级树包括的各个节点分别对应该目标界面模块的各个界面元素；

从所述视图层级树中确定多个目标界面元素，包括：从所述视图层级树中剔除动态界面元素；将所述视图层级树中剩余的界面元素确定为多个目标界面元素；

基于所述多个目标界面元素，执行快照操作，得到参考图；

根据所述多个目标界面元素，从待测用户界面获取多个待测界面元素，所述多个待测界面元素与所述多个目标界面元素一一对应；

基于所述多个待测界面元素，执行快照操作，得到测试图；

将所述测试图与所述参考图进行相似性对比，得到测试结果；

其中，从所述视图层级树中剔除动态界面元素，包括：

基于剔除第一指定界面元素后，所述视图层级树中的剩余界面元素，执行快照操作，得到第一对照图；所述第一指定界面元素为操作图中的动态界面元素，所述操作图是针对所述视图层级树包括的各个界面元素生成的；

在经过预设时间段后，基于所述视图层级树中的剩余界面元素，执行快照操作，得到第二对照图；

显示所述第一对照图和所述第二对照图；

接收用户针对所述第一对照图或所述第二对照图中第二指定界面元素的剔除指令；

响应于该剔除指令，将所述第二指定界面元素作为动态界面元素，并剔除该第二指定界面元素。

2.根据权利要求1所述的方法，其特征在于，从所述视图层级树中剔除动态界面元素，包括：

基于所述视图层级树包括的各个界面元素，执行快照操作，得到所述操作图；

显示所述操作图；

接收用户针对所述操作图中所述第一指定界面元素的剔除指令；

响应于该剔除指令，将所述第一指定界面元素作为动态界面元素，并剔除该第一指定界面元素。

3.根据权利要求1或2所述的方法，其特征在于，所述方法还包括：

基于所述多个目标界面元素，生成参考视图层级树，并保存该参考视图层级树，该参考视图层级树包括的各个节点分别对应各个目标界面元素；

根据所述多个目标界面元素，从待测用户界面获取多个待测界面元素，包括：

根据预存的所述参考视图层级树，从待测用户界面获取多个待测界面元素。

4.根据权利要求1或2所述的方法，其特征在于，将所述测试图与所述参考图进行相似性对比，包括：

将所述测试图上的各个像素点分别与所述参考图上的相应像素点进行对比。

5.根据权利要求1或2所述的方法，其特征在于，所述方法还包括：

在所述测试结果表征所述测试图与所述参考图之间的相似度小于预设阈值的情况下，确定所述测试图与所述参考图之间的差异；

对所述差异进行可视化，得到差异图像；

显示所述差异图像。

6.一种测试用户界面的装置，其特征在于，所述装置包括：

视图层级树获得模块，用于针对参考用户界面上的目标界面模块，获得该目标界面模块的视图层级树，该视图层级树包括的各个节点分别对应该目标界面模块的各个界面元素；

目标界面元素确定模块，用于从所述视图层级树中确定多个目标界面元素；所述目标界面元素确定模块包括：动态界面元素剔除子模块，用于从所述视图层级树中剔除动态界面元素；目标界面元素确定子模块，用于将所述视图层级树中剩余的界面元素确定为多个目标界面元素；

参考图获得模块，用于基于所述多个目标界面元素，执行快照操作，得到参考图；

待测界面元素获取模块，用于根据所述多个目标界面元素，从待测用户界面获取多个待测界面元素，所述多个待测界面元素与所述多个目标界面元素一一对应；

测试图获得模块，用于基于所述多个待测界面元素，执行快照操作，得到测试图；

相似性对比模块，用于将所述测试图与所述参考图进行相似性对比，得到测试结果；

其中，所述动态界面元素剔除子模块包括：

第一对照图获得子单元，用于基于剔除第一指定界面元素后，所述视图层级树中的剩余界面元素，执行快照操作，得到第一对照图；所述第一指定界面元素为操作图中的动态界面元素，所述操作图是针对所述视图层级树包括的各个界面元素生成的；

第二对照图获得子单元，用于在经过预设时间段后，基于所述视图层级树中的剩余界面元素，执行快照操作，得到第二对照图；

第二显示子单元，用于显示所述第一对照图和所述第二对照图；

第二指令接收子单元，用于接收用户针对所述第一对照图或所述第二对照图中第二指定界面元素的剔除指令；

第二剔除子单元，用于响应于该剔除指令，将所述第二指定界面元素作为动态界面元素，并剔除该第二指定界面元素。

7.根据权利要求6所述的装置，其特征在于，所述动态界面元素剔除子模块包括：

操作图获得子单元，用于基于所述视图层级树包括的各个界面元素，执行快照操作，得到所述操作图；

第一显示子单元，用于显示所述操作图；

第一指令接收子单元，用于接收用户针对所述操作图中所述第一指定界面元素的剔除指令；

第一剔除子单元，用于响应于该剔除指令，将所述第一指定界面元素作为动态界面元素，并剔除该第一指定界面元素。

8.根据权利要求6或7所述的装置，其特征在于，所述装置还包括：

参考视图层级树生成模块，用于基于所述多个目标界面元素，生成参考视图层级树，并保存该参考视图层级树，该参考视图层级树包括的各个节点分别对应各个目标界面元素；

所述待测界面元素获取模块包括：

待测界面元素获取子模块，用于根据预存的所述参考视图层级树，从待测用户界面获取多个待测界面元素。

9.根据权利要求6或7所述的装置，其特征在于，所述相似性对比模块包括：

像素点对比子模块，用于将所述测试图上的各个像素点分别与所述参考图上的相应像素点进行对比。

10.根据权利要求6或7所述的装置，其特征在于，所述装置还包括：

差异确定模块，用于在所述测试结果表征所述测试图与所述参考图之间的相似度小于预设阈值的情况下，确定所述测试图与所述参考图之间的差异；

差异图像获得模块，用于对所述差异进行可视化，得到差异图像；

差异图像显示模块，用于显示所述差异图像。

11.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，该计算机程序被处理器执行时，实现如权利要求1至5任一所述的方法中的步骤。

12.一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，其特征在于，所述处理器执行所述计算机程序时，实现如权利要求1至5任一所述的方法的步骤。

Images