airtest测试网页_Airtest之web自动化（一）

Airtest之web自动化(一)

[此文档有许多涉及到gif动图的地方，请全屏观看]

了解Airtest：

简介：

Airtest是由网易团队开发的一款自动化框架，前期运用与游戏测试(通过截图识别)，后来又被运用到安卓测试以及web测试。这款自动化框架如此强大的原因来自其团队自己开发的一个图像识别框架，这个框架的祖宗就是一种新颖的图形脚本语言Sikuli。Sikuli这个框架的原理是这样的，计算机用户不需要一行行的去写代码，而是用屏幕截屏的方式，用截出来的图形摆列组合成神器的程序，这是Airtest的一部分。另外，Airtest也基于poco这个UI控件搜索框架，这个框架也是网易自家的跨平台UI测试框架，原理类似于appium，通过控件的名称，id之类的来定位目标控件，然后调用函数方法，例如click(),send_keys()之类的方法来对目标控件进行点击或者是操作。

Airtest展示：

这个动图是Airtest官方文档中截取的，细心的同学可能已经发现：Airtest实现的脚本是python+selenium，刚刚接触到这款框架的时候，我在想这不就是python+selenium的再封装吗，也没有什么新颖的地方。但是细心认真的看，才会发现Airtest强大的之处...

一：Airtest打开浏览器，导入必须的类

在配置好chrome浏览器，以及webdriver之后(此操作很简单)，点击AirtestIDE中selenium窗左上方的像地球一样的图标，打开浏览器，然后脚本编辑窗会提示你是否导入必要的模块，点击yes(已经导入了的就点击No)

点击yes后结果：可以看到此处除了导入必要的类以外，还实例化了driver：(driver = WebChrome())，并设置了隐性等待时间：(driver.implicitly_wait(20))，这些都是可以编辑的

start_web按钮：实现driver.get()操作

start_web按钮点击就会生成代码，这样类型的按钮还有许多，他们被称为直接生成代码按钮：(这一类按钮，点击后直接生成代码。不需多余操作，不过部分按钮会根据当前浏览器实际情况生成不同的参数。 对于Firefox，不会在页面上显示检视器，而是直接生成代码)

start_web: 点击该按钮后生成当前浏览器所访问的页面地址的语句。例： driver.get("https://github.com/AirtestProject")

snapshot: 点击该按钮后生成对当前页面进行截图的语句。例： driver.snapshot()

new_tab: 点击该按钮生成一条跳转在最新出现的标签页的语句，一般用在一个生成新的标签页的语句后面。例：driver.switch_to_latest_window()

previous_tab: 点击该按钮生成一条跳转到当前标签页之前的标签页(父标签)的语句。例：driver.switch_to_last_window()

back: 点击该按钮，生成后退到上一个页面的语句。例：driver.back()

forward: 点击该按钮，生成前进到下一个页面的语句。例：driver.forward()

airtest—录制:

如动图所示：点击AirtestIDE中selenium窗中右上角摄像头的图标之后便可以开始录制，在浏览器中的每一步操作都会变为python代码保存在脚本编辑窗中。当然录制也会有些弊端，所以需要酌情使用。弊端：元素定位时不能通过id，name这种简单方式定位，且xpath过长时可能会出现bug(此处可以自己尝试一下)，解决方案，所有的元素定位都可以自己写，也可以通过airtest_touch(图像识别点击)跳过元素定位——后面细讲

类似于录制的按钮也还存在许多，这类按钮被称作： Inspect类按钮(这一类按钮点击后，不会直接生成代码；浏览器会进入inspect模式，用户可以在浏览器中选择自己想要操作的元素进行点击，然后编辑框内会生成代码定位到对应元素，并生成对应操作的代码)

Inspect按钮: 点击这个按钮后，选取页面元素，会生成一个定位到该元素的语句。但不会在后面生成对应的操作代码，用户可以自行补充想要执行的selenium语句。例： driver.find_element_by_xpath("//*[@id=\"navbarContent\"]/ul/li[2]/a")还支持其他查找元素的方法*

touch按钮：这个按钮，点击后会生成点击对应元素的代码。例： driver.find_element_by_xpath("//*[@id=\"navbarContent\"]/ul/li[2]/a").click()

text按钮：点击这个按钮，会生成一条在指定元素内输入文本的语句，生成代码后，用户需自行在内部填入需要输入的文本。同时，用户可以定义在输入后执行某个键盘事件，如回车。例： driver.find_element_by_xpath("//input[@placeholder='Search']").send_keys("Airtest Project", Keys.ENTER)

assert按钮：assert按钮在点击后，生成一条assert页面元素是否存在的语句。这是一条Airtest-Selenium封装的语句，在运行时会尝试用参数代表的方法去寻找元素，如果找到会返回True，如果没找到会返回False。可用于测试脚本是否成功的判读。例： driver.assert_exist("//*[@id=\"js-pjax-container\"]/div/header/div/nav/a[2]", "xpath")

Airtest——Airtest_touch

可以避免复杂的元素定位，以及框架的频繁切换的情况

airtest—assert_template(基于图片识别的断言)

上面的两个按钮是Airtest自带的图像识别按钮(这一类按钮，点击后进入截取图像模式，对当前屏幕进行框选区域并截图。)

airtest_touch: 点击该按钮开启截屏模式，对当前屏幕进行截屏，可从浏览器中截取区域图片。表示对截取图片进行点击。例：

1_airtest_touch

assert_template: 点击该按钮后，对当前屏幕截图。表示断言当前浏览器存在该图片。例

1_assert_template

airtest——测试报告：

Airtest脚本运行完成之后会自动生成测试报告，点击IDE上方的LOG页签按钮及可查看，测试报告会将整个脚本的每一个步骤记录下来，最新版本的测试报告与动图展示的样式还有些不一样，但是内容是差不多的：

Airtest其他操作：

Airtest生成的代码是纯python代码，所以还有很多其他操作可以直接用python+selenium实现

上传文件：

1、定位页面上用于上传文件的input元素，其属性应该是type为file(通常为上传文件的那个框或按钮)

2、用driver.find_element_by...定位该元素

3、对该元素进行send_Keys()操作，内容为你要上传的文件

加载用户配置文件：有时候需要绕过验证码，或者用到浏览器中其他配置时使用

1、在浏览器启动代码之前创建ChromeOptions()属性option

2、在option中通过add_argument()方法添加属性‘--user--data--dir’

3、在调用webChrome方法启动浏览器之前，加上chrome_options = option参数加载用户配置文件

4、访问网站，就可以加载本地浏览器已经记录的cookie

代码如下:

option = ChromeOptions()

​

option.add_argument(‘--user--data--dir = "你的浏览器存储配置文件的路径"’)

​

driver = WebChrome(chrome_options = option)

附：

附一个之前为了这片介绍而写的一个小脚本：

本来想用这个脚本的实现过程来自己来录制gif讲解的，但是太录制出来的效果不怎么好，也太耗时了，于是就放弃了。

总结一波Airtest的亮点：

1、能够快速定位元素，一键实现许多我们常用的动作(点击，输入，前进，后退，截图...)

2、将selenium关于元素的断言实现了封装

3、可以录制脚本，降低了自动化的难度

4、一键切换窗口，少去了通过句柄切换窗口的烦恼

5、基于图片识别的点击和断言，避免了元素难定位，iframe切换频繁的问题

整个脚本实现过程就在2分钟左右，用Airtest来辅助写自动化脚本的效率真的很高，但是现在的唯一的问题是找不到整套可以预期配合的自动化框架，也难以实现PO设计理念，测试报告对于整个项目来说也是相当冗余的。

但是Airtest录制的脚本是可以在其他python环境中运行，需要我们安装其依赖的两个库：’atrtest‘以及’poco‘，这样的话，上面所讲的缺点还是有办法解决的(下一贴再讲)。