自动识别并标注的方法、装置、计算机设备及存储介质与流程

本发明涉及界面自动化测试领域，尤其涉及自动识别并标注的方法、装置、计算机设备及存储介质。

背景技术：

现有技术中，网页页面的界面自动化测试，需要获取页面元素的路径信息，然后通过脚本对页面元素进行点击、输入等模拟人工的操作。

而元素路径信息的获取只能通过人工方式获取，即需要打开控制台定位到元素后，进行路径信息的复制，或者人工根据元素信息手动编写。所以现有技术的页面元素定位方式比较繁琐，且元素较多时，需逐个查看、编写，耗时较多。

技术实现要素：

本发明实施例提供了自动识别并标注的方法、装置、计算机设备及存储介质，旨在解决现有页面元素定位方式步骤繁琐、效率较低的问题。

本发明实施例提供一种网页元素的自动识别并标注的方法，其中，包括：

接收目标网页的网址信息，并根据所述网址信息获取网页源码以及网页页面，以及将所述网页页面保存为网页图片；

对所述网页源码进行解析获取目标元素以及目标元素的xpath路径；

根据所述目标元素的xpath路径获取所述目标元素在所述网页图片中的坐标；

根据所述目标元素在所述网页图片中的坐标，对所述网页图片中的目标元素进行标注；

将标注好的网页图片返回。

优选的，还包括：

根据所述目标元素在所述网页图片中的坐标，对网页图片中的目标元素进行截图，得到目标元素图片，并返回包括目标元素图片在内的元素信息。

优选的，根据所述目标元素在所述网页图片中的坐标，对所述网页图片中的目标元素进行标注，包括：

根据所述目标元素在所述网页图片中的坐标，在所述网页图片中查找目标元素的位置；

根据查找到的位置对所述目标元素进行标注并进行命名。

优选的，还包括：

将目标元素图片与所述目标元素的元素名进行关联。

优选的，所述元素信息还包括目标元素的元素名和xpath路径。

优选的，所述根据查找到的位置对所述目标元素进行标注并进行命名，包括：

使用与所述目标元素形状适配的线条包裹所述目标元素，并在所述线条内显示元素名。

优选的，所述目标元素为输入框、点击按钮、链接元素以及列表中的一种或几种。

本发明实施例还提供一种网页元素的自动识别并标注的装置，其中，包括：

网页获取单元，用于接收目标网页的网址信息，并根据所述网址信息获取网页源码以及网页页面，以及将所述网页页面保存为网页图片；

解析单元，用于对所述网页源码进行解析获取目标元素以及目标元素的xpath路径；

坐标获取单元，用于根据所述目标元素的xpath路径获取所述目标元素在所述网页图片中的坐标；

元素标注单元，用于根据所述目标元素在所述网页图片中的坐标，对所述网页图片中的目标元素进行标注；

返回单元，用于将标注好的网页图片返回。

本发明实施例还提供一种计算机设备，包括存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序，其中，所述处理器执行所述计算机程序时实现如上所述的网页元素的自动识别并标注的方法。

本发明实施例还提供一种计算机可读存储介质，其中，所述计算机可读存储介质存储有计算机程序，所述计算机程序当被处理器执行时使所述处理器执行如上所述的网页元素的自动识别并标注的方法。

本发明实施例提供了自动识别并标注的方法、装置、计算机设备及存储介质，其中，该方法包括：接收目标网页的网址信息，并根据所述网址信息获取网页源码以及网页页面，以及将所述网页页面保存为网页图片；对所述网页源码进行解析获取目标元素以及目标元素的xpath路径；根据所述目标元素的xpath路径获取所述目标元素在所述网页图片中的坐标；根据所述目标元素在所述网页图片中的坐标，对所述网页图片中的目标元素进行标注；将标注好的网页图片返回。通过该方法，可以对目标元素进行标注，这样可以对待测试的元素进行快速定位，提高了定位效率。

附图说明

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

图1为本发明实施例提供的网页元素的自动识别并标注的方法的流程示意图；

图2为本发明实施例提供的网页元素的自动识别并标注的装置的示意性框图。

具体实施方式

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

应当理解，当在本说明书和所附权利要求书中使用时，术语“包括”和“包含”指示所描述特征、整体、步骤、操作、元素和/或组件的存在，但并不排除一个或多个其它特征、整体、步骤、操作、元素、组件和/或其集合的存在或添加。

还应当理解，在此本发明说明书中所使用的术语仅仅是出于描述特定实施例的目的而并不意在限制本发明。如在本发明说明书和所附权利要求书中所使用的那样，除非上下文清楚地指明其它情况，否则单数形式的“一”、“一个”及“该”意在包括复数形式。

还应当进一步理解，在本发明说明书和所附权利要求书中使用的术语“和/或”是指相关联列出的项中的一个或多个的任何组合以及所有可能组合，并且包括这些组合。

请参阅图1，图1为本发明实施例提供的一种网页元素的自动识别并标注的方法的流程示意图，其包括步骤s101～s105：

s101、接收目标网页的网址信息，并根据所述网址信息获取网页源码以及网页页面，以及将所述网页页面保存为网页图片；

此步骤中，先获取目标网页的网址信息，然后根据该网址信息获取网页源码和网页页面。

具体的，可以使用seleniumwebdriver打开目标网页的网址，从而展示目标网页的网页页面，并将网页页面保存为网页图片。同时可获取目标网页的网页源码。

启动浏览器后，可通过控制对象的get方法来控制浏览器打开指定网址，例如：

driver.get('http://www.163.com')

执行完上一行后，浏览器将会访问http://www.163.com这个网址。浏览器可能不会等待目标网页完全加载完成即返回。所以，本发明实施例还可等待目标网页的指定元素出现再进行后续操作，该指定元素可以是加载时间较长的一些元素，当指定元素加载完成，说明目标网页也加载完成。

此外，可通过seleniumwebdriver提供的current_url接口获取当前页面的链接；通过seleniumwebdriver提供的page_source接口获取当前页面的源码；通过seleniumwebdriver提供的title接口获取当前页面的标题。

s102、对所述网页源码进行解析获取目标元素以及目标元素的xpath路径；

此步骤中，可对所述网页源码进行解析，获取其中的目标元素，并且还获取目标元素的xpath路径。在一实施例中，所述目标元素可以是输入框、点击按钮、链接元素以及列表中的一种或几种。

其中的xpath路径表达方法可以是//*[@id＝"username"])。

s103、根据所述目标元素的xpath路径获取所述目标元素在所述网页图片中的坐标；

本步骤是根据目标元素的xpath路径来获取目标元素在网页图片中的坐标。具体的可通过seleniumwebdriver获取目标元素在网页图片中的坐标。

s104、根据所述目标元素在所述网页图片中的坐标，对所述网页图片中的目标元素进行标注；

对于使用者来说，其并不知道之前获取的xpath路径对应目标网页上的位置，所以需要找到这个xpath路径对应在网页图片上的坐标，然后在网页图片中标注出来，这样使用者在查看该网页图片时，就可以知道此xpath路径对应在网页图片上哪个位置。也就是根据目标元素在网页图片中的坐标对目标元素进行标注。

在一实施例中，所述步骤s104包括：

根据所述目标元素在所述网页图片中的坐标，在所述网页图片中查找目标元素的位置；

根据查找到的位置对所述目标元素进行标注并进行命名。

本实施例中，可以先根据目标元素在所述网页图片中的坐标，来查找到目标元素的位置，该位置是指目标元素处于网页图片中的相对位置，然后根据查找到的位置来对目标元素进行标注。在标注时还可以进行命名，从而得到目标元素的元素名，命名的方式可以是编号，那么元素名就是元素编号。

s105、将标注好的网页图片返回。

此步骤是指将标注好的网页图片返回给使用者，这样使用者便能根据标注出来的信息快速定位到目标元素。

本发明实施例特别适合于批量对网页图片上的目标元素进行标注，这样可以大大节省时间，提高定位效率。

在一实施例中，所述的网页元素的自动识别并标注的方法还包括：

根据所述目标元素在所述网页图片中的坐标，对网页图片中的目标元素进行截图，得到目标元素图片，并返回包括目标元素图片在内的元素信息。

此步骤中，基于目标元素在所述网页图片中的坐标对网页图片中的目标元素进行截图，具体可通过opencv截取出目标元素，得到目标元素图片。opencv是一个基于bsd许可(开源)发行的跨平台计算机视觉库，可以运行在linux、windows、android和macos操作系统上。opencv具有轻量级而且高效的特点，具体是由一系列c函数和少量c++类构成，同时提供了python、ruby、matlab等语言的接口，实现了图像处理和计算机视觉方面的很多通用算法。

在一实施例中，所述的网页元素的自动识别并标注的方法还包括：

将目标元素图片与所述目标元素的元素名进行关联。

此步骤是将前述步骤中截图得到的目标元素图片与命名得到的元素名进行关联，这样可以根据元素名查找目标元素图片。

在一实施例中，所述元素信息还包括目标元素的元素名和xpath路径。即通过获取前述的元素名和xpath路径，并与目标元素图片一同返回。

这样，在返回了上述元素信息后，使用者就可以通过目标元素图片、元素名和xpath路径，结合标注后的网页图片，从而快速定位网页上的目标元素，大大缩短了元素定位时间，提高了定位效率。

在一实施例中，所述根据查找到的位置对所述目标元素进行标注并进行命名，包括：

使用与所述目标元素形状适配的线条包裹所述目标元素，并在所述线条内显示元素名。

本实施例中，具体可以使用线条来框柱所述目标元素，从而对网页图片中的目标元素进行标注。具体地，由于目标元素的形状均有所不同，有些目标元素的形状是矩形的，有些目标元素的形状是圆形的，有些目标元素的形状是多边形的，有些目标元素的形状是椭圆的，所以不能以统一形状的线条进行标注，否则标注不准确。本实施例是根据目标元素的形状来确定标注的线条形状，例如目标元素是圆形的，那么就使用圆形线条来包裹目标元素，目标元素是矩形的，那么就使用矩形线条来包裹目标元素。这样可以使线条的形状与目标元素的形状适配。本发明实施例中，标注的线条还应将目标元素包裹，同时与目标元素的距离不超过阈值，这样既能保证将目标元素全部框在线条内，同时又能避免将其他元素框在线条内，减少占用面积。其中，所述阈值可以根据目标元素的大小来确定，例如将所述阈值设置为所述目标元素中两点之间最长距离的1/10，从而适应不同大小的目标元素场景。同时也能方便使用者清晰的看到标注的线条，并与目标元素之间具有合适的间隙。

请参阅图2，图2为本发明实施例提供的一种网页元素的自动识别并标注的装置的示意性框图，该装置200可以包括：

网页获取单元201，用于接收目标网页的网址信息，并根据所述网址信息获取网页源码以及网页页面，以及将所述网页页面保存为网页图片；

解析单元202，用于对所述网页源码进行解析获取目标元素以及目标元素的xpath路径；

坐标获取单元203，用于根据所述目标元素的xpath路径获取所述目标元素在所述网页图片中的坐标；

元素标注单元204，用于根据所述目标元素在所述网页图片中的坐标，对所述网页图片中的目标元素进行标注；

返回单元205，用于将标注好的网页图片返回。

在一实施例中，该装置200还包括：

截图单元，用于根据所述目标元素在所述网页图片中的坐标，对网页图片中的目标元素进行截图，得到目标元素图片，并返回包括目标元素图片在内的元素信息。

在一实施例中，所述元素标注单元204包括：

元素查找单元，用于根据所述目标元素在所述网页图片中的坐标，在所述网页图片中查找目标元素的位置；

标注命名单元，用于根据查找到的位置对所述目标元素进行标注并进行命名。

在一实施例中，该装置200还包括：

关联单元，用于将目标元素图片与所述目标元素的元素名进行关联。

在一实施例中，所述元素信息还包括目标元素的元素名和xpath路径。

在一实施例中，所述标注命名单元包括：

线条标注单元，用于使用与所述目标元素形状适配的线条包裹所述目标元素，并在所述线条内显示元素名。

在一实施例中，所述目标元素为输入框、点击按钮、链接元素以及列表中的一种或几种。

本发明实施例还提供一种计算机设备，包括存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现如上所述的网页元素的自动识别并标注的方法。

本发明实施例还提供一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，所述计算机程序当被处理器执行时使所述处理器执行如上所述的网页元素的自动识别并标注的方法。

所属领域的技术人员可以清楚地了解到，为了描述的方便和简洁，上述描述的设备、装置和单元的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。本领域普通技术人员可以意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，能够以电子硬件、计算机软件或者二者的结合来实现，为了清楚地说明硬件和软件的可互换性，在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本发明的范围。

在本发明所提供的几个实施例中，应该理解到，所揭露的设备、装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如，所述单元的划分，仅仅为逻辑功能划分，实际实现时可以有另外的划分方式，也可以将具有相同功能的单元集合成一个单元，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另外，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口、装置或单元的间接耦合或通信连接，也可以是电的，机械的或其它的形式连接。

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本发明实施例方案的目的。

另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以是两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。

所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分，或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：u盘、移动硬盘、只读存储器(rom，read-onlymemory)、磁碟或者光盘等各种可以存储程序代码的介质。

以上所述，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到各种等效的修改或替换，这些修改或替换都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应以权利要求的保护范围为准。