Web自动化框架LazyUI使用手册（3）--单个xpath抓取插件详解（selenium元素抓取，有此插件，便再无所求！）

概述

前面的一篇博文粗略介绍了基于lazyUI的第一个demo，本文将详细描述此工具的设计和使用。

元素获取插件：LazyUI Elements Extractor，作为Chrome插件，用于抓取页面上的常用控件（可批量或单个抓取），获得控件所在的frame和三个唯一定位控件的xpath，并生成基于LazyUI框架的Java代码，解决繁杂的元素的获取问题。

下载：

http://download.csdn.net/detail/kaka1121/9571942

拖拽安装到chrome即可右键使用

工具由来：

熟悉控件获取的同学都知道，selenium webdriver定位元素大概有八种方式详见：

http://blog.csdn.net/kaka1121/article/details/51850881

文中前七种方式，都可以归结到第七种，即使用Xpath的方式，和元素定位相关的Xpath语法详见：

http://blog.csdn.net/kaka1121/article/details/51811296

元素获取作为Web端自动化工作中最重要的事情之一，大概占去了3分之一的工作，而元素定位均可归结于Xpath的获取。

因此，如何获取能唯一定位元素，且稳定的Xpath，便成为了web自动化的重中之重。

Xpath的获取，在仔细的总结和推敲之下，完全可以用工具来代替，再配合较好的前端可测性（唯一ID等），便可极大简化web自动化工作。

 

工具设计思路：

1. 工具需要抓取的控件类型：

常用的控件大概有几种：

①输入框（包含输入区域）

②按钮

③下拉菜单

④单选框

⑤复选框

⑥链接（文字和图片）

⑦标准表格

⑧标准日历

⑨文本区域

⑩标准文件上传

可以进一步抽象为以下八种控件，并提供其对应的常用方法：

1. 输入控件①，提供方法：

     点击、清空、输入、获取文本

2. 点击控件②⑥，提供方法：

     点击

3. 下拉控件③，提供方法：

     根据展示的文字（VisibleText）选中、根据展示的文字反选、根据序号选中、根据序号反选、根据值（value）选中、根据值（value）反选、获取所有可选项、获取所有已选项、清除为初始状态

4. 点选控件④⑤，提供方法：

     勾选、取消勾选、查看是否勾选

5. 表格控件⑦，提供方法：

     获取所有单元格的文本值、获得某行某列单元格的文本值、获得table的大小&行数&列数

6. 日历控件⑧，提供方法：

     清除日期、输入日期、获取当前输入日期文本

7. 文本控件⑨，提供方法：

     获取文本、点击

8. 上传控件⑩，提供方法：

     上传文件

 

2. 单个控件获取

需求：

右键到某个控件上，就能获取到至多三个可以唯一定位该元素的相对Xpath，并将其标记为以上8种抽象控件之一。

可抓取控件节点名:

input（type=="text"、"submit"、"button"、"reset"、"image"、"checkbox"、"radio"、"file"）

textarea、select、table、a、button、span、img、i、font、div

和上面抽象出来的8种控件对应起来，如下图：

抓取优先级&策略

如上图所示：

1.如果存在id，且唯一，则直接用id，其Xpath为：

//input[@id=’main’]

2.其次，如果存在name，且唯一，则直接用name，其Xpath为：

//a[@name=’name’]

3.再次，如果存在text，且唯一，则直接用text，其Xpath为：

//span[contains(text(),’aaa’]

4.如果还不能唯一定位，且存在name、text，二者组合能唯一定位，则其Xpath类似：

//Select[@name=’name’ and contains(text(),’aaa’]

5. 如果还不能唯一定位，则依次尝试"value","title","class","style"，如果能通过其一唯一定位，则其Xpath类似：

//XXX[@class(或者是value、title、style)=’class’]

6.如果还不能唯一定位，则递归寻找其父节点(依次单看id、name、text、title)，直到找到唯一。 。

再从其父节点开始，取绝对路径（元素索引），加起来唯一定位，其Xpath类似：

//input[@id=’main’]/div[1]/span[2]

当然，这种情况开始，就应该跟开发提可测性，增加唯一的id、name之类了。

7.如果还不能唯一定位，则寻找其所有子节点(依次单看id、name、text、title)，直到找到唯一。

再使用其子节点Xpath来唯一定位，其Xpath类似：

//input[@id=’main’]/parent::XXX

8.如果还不能唯一定位，则寻找其所有兄弟节点(依次单看id、name、text、title),和自己在兄弟节点中的index，直到找到唯一。

//input[@id=’main’]/parent::XXX/XX[3]

9.以上全不满足，则给出其绝对路径（元素索引），来唯一定位，其Xpath类似：

/XXX[1]/XX[2]/X[5]/XXXXX[2]

 

3.示例：

右键—>点击

抓取结果：

如上图所示，以百度首页--“百度一下”按钮为抓取对象，抓取出的三个能唯一定位的Xpath如图中③所示。

另外，插件还对控件所在frame（①）进行抓取，此处无frame信息。

如上图中②所示，控件被识别为click类，提供”点击”方法。

如上图中④所示，控件被命名为“su”,调用时使用该名字，并附上备注“su”(⑤)作为控件的说明。

点击“生成代码”

生成基于框架的代码入下：

@Xpath(xpath={"//input[@id='su']", "//input[contains(@value,'百度一下')]", "//input[contains(@class,'bg s_btn btnhover')]"})
@Frame(frame="")
@Description(description="su")
public Click su;

结合，框架，便能对控件进行点击操作。

单个抓取就说到这，了解批量抓取请点击：

Web自动化框架LazyUI使用手册（4）--控件抓取工具Elements Extractor详解（批量抓取）