AirtestIDE实战：5分钟搞定Web自动化测试（含Chrome配置避坑指南）

如果你是一名刚接触自动化测试的开发者，或者是一名希望将部分手工测试任务自动化的测试工程师，面对市面上众多的工具和框架，可能会感到有些无从下手。Selenium 虽然强大，但学习曲线陡峭；而一些“所见即所得”的录制工具，又往往缺乏灵活性和可维护性。有没有一种方案，既能像录制工具一样快速上手，又能像代码框架一样强大灵活呢？

今天要介绍的 AirtestIDE 结合 airtest-selenium，可能就是你在寻找的答案。它本质上是一个集成了 Airtest（图像识别框架）和 Selenium（Web 自动化标准）的图形化编辑器。最大的亮点在于，它允许你通过截图来定位和操作网页元素，这对于不熟悉 HTML 结构或 CSS 选择器的新手来说，简直是福音。想象一下，你只需要在浏览器里截取一个按钮的图片，就能让脚本自动点击它，这大大降低了编写 Web 自动化脚本的门槛。

本文将带你从零开始，在 5 分钟内完成第一个 Web 自动化脚本。我们会重点解决两个最常绊倒新手的“坑”：Chrome 浏览器路径的正确配置，以及 Selenium 辅助窗口的调出。最后，我们会用一个完整的“百度搜索”案例，演示如何结合图像识别和传统元素定位，写出一段健壮、可读的自动化脚本。无论你是完全的零基础，还是有过一些编程经验，这篇指南都将为你铺平道路。

1. 环境准备与核心概念扫盲

在动手写代码之前，我们需要先理清几个核心概念，并准备好作战环境。AirtestProject 是一个由网易游戏开源的项目生态，我们本次聚焦的 AirtestIDE 是其中的一个图形化集成开发环境。

Airtest 本身是一个基于图像识别的跨平台 UI 自动化框架。它的工作原理是：你在屏幕上截取一张目标图片（比如一个按钮），脚本运行时，Airtest 会在当前屏幕画面中搜索这张图片，找到后计算出它的坐标并进行点击。这种方式不关心应用是用什么技术栈开发的，因此可以用于测试 Android App、iOS App、Windows 桌面程序，当然，还有 Web 页面。

而 airtest-selenium 可以理解为在标准的 Selenium Python 库外面包了一层“糖衣”。Selenium 是 Web 自动化的行业标准，它通过操作浏览器提供的开发者接口（如 Chrome DevTools Protocol）来模拟用户行为。airtest-selenium 在保留所有 Selenium 功能的基础上，额外添加了几个非常实用的方法，例如基于图片的点击和断言。

那么，AirtestIDE 在这里扮演什么角色呢？它是一个“脚手架”和“训练场”。它内置了 Python 环境、Airtest 和 airtest-selenium 库，提供了脚本录制、元素拾取、一键运行和报告生成等可视化功能。你可以在 IDE 里快速完成脚本的原型开发，然后再将代码迁移到你熟悉的编辑器（如 PyCharm、VSCode）中进行更复杂的工程化管理。

为了获得最佳体验，我强烈建议你按照以下步骤准备环境：

1. 下载 AirtestIDE：访问其 GitHub 发布页 或官方网站，下载对应操作系统（Windows/macOS）的压缩包。Windows 用户下载 .zip，解压即可使用，无需安装。
2. 安装 Chrome 浏览器：确保你的电脑上安装了 Google Chrome。最好将其安装在默认路径（如 C:\Program Files\Google\Chrome\Application\），这能避免后续很多路径配置的麻烦。
3. 一点 Python 基础：虽然 AirtestIDE 的录制功能很强大，但要想写出更智能、更健壮的脚本，了解一些基本的 Python 语法（如变量、函数、导入模块）会非常有帮助。如果完全没有基础，也不用担心，我们会尽量用最直白的语言解释每一行代码。

注意：截至本文撰写时，airtest-selenium 的图像识别功能仅在 Windows 平台的 AirtestIDE 中可用。macOS 用户虽然可以使用 AirtestIDE 和 Selenium 的基础功能，但无法使用 airtest_touch 等基于图片的方法。不过，纯 Selenium 的脚本在 macOS 上是可以正常运行的。

2. 关键配置：调出Selenium窗口与Chrome路径避坑

打开 AirtestIDE 后，你可能会觉得界面有些复杂。别慌，我们一步一步来。第一个目标就是让 IDE 显示出专门用于 Web 自动化的“Selenium Window”辅助面板。

2.1 调出 Selenium 辅助窗口

默认情况下，Selenium 窗口是隐藏的。你需要手动开启它。

1. 点击 IDE 顶部菜单栏的 窗口。
2. 在下拉菜单中，找到并勾选 Selenium Window。

勾选后，IDE 主界面的左侧（或下方，取决于你的布局）会出现一个新的面板，标题就是“Selenium”。这个面板就是我们后续进行脚本录制、元素拾取和快速插入代码的“控制台”。

2.2 配置 Chrome 浏览器路径（避坑核心）

这是新手遇到问题最多的环节。很多同学在点击“初始化”按钮后，会弹出一个令人困惑的提示：please set chrome path on options。这是因为 IDE 不知道你的 Chrome 浏览器安装在哪里。

为什么需要配置这个路径？ airtest-selenium 底层需要启动一个真正的 Chrome 浏览器进程。它需要知道 chrome.exe 这个可执行文件的具体位置。请注意，这里配置的是 chrome.exe，而不是 chromedriver.exe。chromedriver 是 Selenium 用来与 Chrome 通信的桥梁，通常 AirtestIDE 会尝试自动处理或使用内置版本。

正确配置步骤：

1. 再次点击顶部菜单栏的 选项 -> 设置。
2. 在弹出的设置窗口中，找到 Selenium 分类。
3. 你会看到一项叫 Chrome Path 的配置。点击右侧的文件夹图标，或者直接在输入框中粘贴你的 Chrome 浏览器主程序的完整路径。
   • Windows 典型路径：C:\Program Files\Google\Chrome\Application\chrome.exe
   • Windows 64位系统可能：C:\Program Files (x86)\Google\Chrome\Application\chrome.exe
4. 点击 确定 保存。

为了确保你找到的是正确的文件，这里有一个快速验证的方法：打开文件资源管理器，导航到上述路径，你应该能看到 chrome.exe 文件。请务必选择这个 .exe 文件，而不是它的快捷方式。

配置项	正确示例	错误示例	说明
Chrome Path	C:\Program Files\Google\Chrome\Application\chrome.exe	C:\Program Files\Google\Chrome\Application\ (目录)	必须指向可执行文件
		C:\Users\YourName\Desktop\Chrome.lnk (快捷方式)	必须指向实际安装路径
		C:\Program Files\Google\Chrome\Application\chromedriver.exe	这是驱动，不是浏览器

常见问题与解决方案：

如果你在后续步骤中遇到 unknown error: cannot find Chrome binary 错误，请按以下顺序排查：

1. 检查上述路径配置：确保 Chrome Path 指向了正确的 chrome.exe。
2. 检查 ChromeDriver 版本：Selenium 需要通过 chromedriver 来驱动 Chrome。如果 Chrome 浏览器自动更新了，而 chromedriver 版本太旧，就会不兼容。AirtestIDE 通常内置了一个兼容的版本，但如果问题持续，可以尝试手动下载匹配的 chromedriver。
   • 查看你的 Chrome 版本：在浏览器地址栏输入 chrome://settings/help。
   • 访问 ChromeDriver 官网 下载对应版本，并将其所在目录添加到系统的 PATH 环境变量中，或者将其放在 AirtestIDE 的安装目录下。
3. 使用代码指定路径（高级）：如果以上都不行，你可以在脚本中显式指定浏览器和驱动的路径（见下文实战部分）。

3. 第一个脚本：从“录制”到“理解”

配置好环境后，我们就可以开始创建第一个 Web 自动化脚本了。AirtestIDE 提供了强大的录制功能，我们可以先通过录制生成一个脚本框架，然后再去理解和完善它。

3.1 新建项目与初始化浏览器

1. 点击 IDE 左上角的 文件 -> 新建脚本。
2. 选择 .air Airtest项目。我推荐新手使用 .air 格式，因为 IDE 会对它提供更完整的支持，比如自动管理截图文件、一键生成报告等。
3. 为项目起个名字，例如 first_web_test。
4. 在左侧的 Selenium 窗口中，点击那个像 地球仪 一样的 初始化 按钮。
5. 此时，IDE 的脚本编辑区会弹出一个黄色提示框，询问你是否插入初始化代码，选择 Yes。

神奇的事情发生了：一个 Chrome 浏览器窗口被自动打开，同时你的脚本编辑器中出现了以下几行代码：

# -*- encoding=utf8 -*-
__author__ = "AirtestProject"

from airtest.core.api import *
from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from airtest_selenium.proxy import WebChrome

driver = WebChrome()
driver.implicitly_wait(20)

代码解读：

• from airtest_selenium.proxy import WebChrome：导入 airtest-selenium 提供的 WebChrome 类。这是我们能使用图像识别功能的关键。
• driver = WebChrome()：创建一个浏览器驱动对象。这行代码执行后，才会弹出你刚才看到的 Chrome 窗口。
• driver.implicitly_wait(20)：设置隐式等待时间为 20 秒。这意味着，如果后续的 find_element 操作没有立刻找到元素，驱动会最多等待 20 秒，期间不断重试。这是一个好习惯，可以避免因为网络或页面加载慢导致的脚本失败。

3.2 录制一个简单的操作流程

现在，让我们用录制功能来完成一次百度搜索。

1. 在刚刚打开的 Chrome 浏览器中，手动输入网址 https://www.baidu.com 并访问。
2. 回到 AirtestIDE 的 Selenium 窗口，点击 start_web 按钮。你会发现它自动在脚本中插入了一行代码：driver.get("https://www.baidu.com/")。这行代码的作用就是让浏览器跳转到指定网址。
3. 将鼠标移动到百度首页的搜索输入框，然后点击 Selenium 窗口中的 text 按钮。IDE 会尝试定位这个输入框，并插入输入文本的代码。你可能需要稍作修改，比如将输入内容改为“Airtest”。
4. 类似地，找到“百度一下”按钮，点击 Selenium 窗口中的 touch 按钮，插入点击代码。
5. 最后，点击 Selenium 窗口中的 录制 按钮（红色圆点），然后在浏览器里随意点击几下，再点击 停止录制。观察脚本的变化。

完成这些操作后，你的脚本可能看起来像这样：

# -*- encoding=utf8 -*-
__author__ = "AirtestProject"

from airtest.core.api import *
from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from airtest_selenium.proxy import WebChrome

driver = WebChrome()
driver.implicitly_wait(20)

# 访问百度
driver.get("https://www.baidu.com/")
sleep(1.0) # 等待1秒，确保页面加载

# 在搜索框输入“Airtest”
driver.find_element_by_id("kw").send_keys("Airtest")
# 点击“百度一下”按钮
driver.find_element_by_id("su").click()

# 以下是录制产生的代码，可能包含图像识别语句
# touch(Template(...))
# ...

3.3 运行脚本与查看报告

脚本写好了，怎么运行呢？非常简单。

1. 点击 IDE 顶部工具栏的 运行 按钮（绿色的三角形）。
2. IDE 会自动执行你的脚本，并在下方的 Log 窗口中输出运行过程。
3. 运行结束后，点击工具栏的 查看报告 按钮。
4. IDE 会自动生成一个 HTML 格式的测试报告，并在浏览器中打开。这个报告会清晰地展示每一步的操作、是否成功、以及当时的屏幕截图，对于调试和结果确认非常有帮助。

至此，你已经完成了第一个 Web 自动化脚本的完整流程：配置 -> 录制 -> 运行 -> 看报告。但这只是开始，录制的脚本往往比较脆弱，且不易维护。接下来，我们要深入其中，学习如何“手写”一个更优的脚本。

4. 实战：手写一个健壮的百度搜索脚本

我们将抛开录制，从头开始编写一个脚本。这个脚本将演示多种元素定位方式，并巧妙地结合 Airtest 的图像识别功能来处理一些“疑难杂症”。

4.1 项目初始化与基础操作

首先，我们创建一个新的 .air 脚本，并手动输入以下基础代码：

# -*- encoding=utf8 -*-
__author__ = "YourName"

from airtest.core.api import *
from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from airtest_selenium.proxy import WebChrome

# 初始化驱动，这里我们显式指定一些选项，避免环境问题
chrome_options = webdriver.ChromeOptions()
# 可选：设置为无头模式（不显示浏览器界面），适合在服务器上运行
# chrome_options.add_argument('--headless')
# 可选：禁用GPU加速，有时能解决一些渲染问题
# chrome_options.add_argument('--disable-gpu')
# 可选：设置窗口大小
chrome_options.add_argument('--window-size=1920,1080')

# 创建驱动实例
driver = WebChrome(options=chrome_options)
# 设置隐式等待
driver.implicitly_wait(10)
# 设置脚本执行超时时间
driver.set_script_timeout(30)
# 设置页面加载超时时间
driver.set_page_load_timeout(30)

# 访问百度
driver.get("https://www.baidu.com")
print("已访问百度首页")
sleep(2)  # 显式等待2秒，让页面充分加载

代码精讲：

• 我们使用了 webdriver.ChromeOptions() 来创建浏览器选项对象，它可以让我们对浏览器行为进行更精细的控制。
• WebChrome(options=chrome_options) 将选项传入我们的驱动。
• 除了隐式等待，我们还设置了 set_script_timeout 和 set_page_load_timeout，这能让脚本在遇到异步加载或网络异常时更可控。
• sleep(2) 是一个简单的强制等待。在关键页面跳转后使用，可以作为一种稳健的补充，但不应滥用。

4.2 多种元素定位方式与输入操作

百度首页的搜索输入框和按钮，我们可以用多种 Selenium 标准方式来定位。

# 方法1：通过ID定位（最常用，最快速）
search_input = driver.find_element_by_id("kw")
search_input.clear()  # 清空输入框，避免残留内容
search_input.send_keys("Airtest自动化测试")
print("已输入搜索关键词")

# 方法2：通过CSS选择器定位按钮
search_button = driver.find_element_by_css_selector("#su")
# 方法3：通过XPath定位（同样的按钮）
# search_button = driver.find_element_by_xpath('//input[@id="su"]')

# 点击搜索按钮
search_button.click()
print("已点击搜索按钮")
sleep(3)  # 等待搜索结果页加载

定位方式对比表：

定位方式	示例	优点	缺点	适用场景
By.ID	find_element_by_id("kw")	速度最快，唯一性强	需要元素有id属性	首选，用于有固定ID的元素
By.CSS_SELECTOR	find_element_by_css_selector("#su")	语法强大，灵活，性能好	学习成本稍高	复杂选择，类名组合等
By.XPATH	find_element_by_xpath('//input[@value="百度一下"]')	功能最强大，可遍历DOM树	速度相对慢，表达式可能冗长脆弱	当ID、类名都不可用时
By.NAME	find_element_by_name("wd")	语义化，对于表单元素常用	可能不唯一	定位表单字段
By.CLASS_NAME	find_element_by_class_name("s_ipt")	直接	类名常不唯一，易变	快速定位，需结合其他条件

提示：在 AirtestIDE 中，你可以使用 Selenium 窗口的 元素检测 功能。点击那个“瞄准镜”图标，然后将鼠标移动到浏览器页面的元素上，IDE 会自动分析并显示该元素的各种定位信息，并可以一键生成定位代码，是学习定位的绝佳工具。

4.3 引入图像识别处理动态元素

假设搜索结果页的某个“百科”链接，其 HTML 结构非常复杂或者动态生成，用传统方式定位很困难。这时，Airtest 的图像识别优势就体现出来了。

我们首先在浏览器中，手动将想要的“百科”链接截图，并保存。在 AirtestIDE 中，你可以使用 Selenium 窗口的 airtest_touch 按钮来截图并生成代码。

手动编写的图像识别部分代码如下：

# 假设我们已经截取了“百度百科”链接的图片，并命名为 baike_logo.png
# 注意：图片文件需要放在与 .air 脚本同级的目录下，或者指定正确路径
from airtest.core.api import Template

# 使用图像识别点击“百度百科”链接
# Template 对象封装了图片信息
baike_logo = Template(r"baike_logo.png") # r 表示原始字符串，避免转义符问题
try:
    driver.airtest_touch(baike_logo)
    print("已通过图像识别点击百度百科链接")
except TargetNotFoundError:
    print("未在屏幕上找到百度百科图片，可能页面未加载或样式已改变")
    # 这里可以加入备用方案，比如用传统方式查找链接
    # driver.find_element_by_partial_link_text("百科").click()

图像识别要点：

• Template(r“baike_logo.png”) 创建了一个图片模板对象。
• driver.airtest_touch(template) 是 airtest-selenium 扩展的方法，用于点击图片所在位置。
• 一定要用 try...except 包裹，因为图像识别可能失败（如图片样式变化、页面未加载完全）。
• 图像识别应作为传统定位方式的补充，而不是替代。它适合处理图标、验证码、复杂动态组件等场景。

4.4 标签页切换与断言

点击链接后，可能会在新标签页打开。我们需要切换到新标签页才能继续操作。

# 点击链接后，等待新标签页打开
sleep(2)

# 获取当前所有窗口的句柄
all_handles = driver.window_handles
print(f"当前共有 {len(all_handles)} 个标签页")

# 切换到最新打开的标签页（通常最后一个就是）
driver.switch_to.window(all_handles[-1])
print("已切换到新标签页")

# 或者使用 airtest-selenium 封装的更语义化的方法
# driver.switch_to_new_tab()

# 在新页面进行断言，例如判断标题是否包含“百度百科”
assert “百度百科” in driver.title, f"页面标题不符合预期，当前标题是：{driver.title}"
print("页面标题断言通过")

# 也可以使用图像断言，确认某个特定图片出现在页面中
# assert_template_result = driver.assert_template(Template(r"baike_verified.png"), “未找到认证标志”)
# if assert_template_result:
#     print(“图像断言通过，找到认证标志”)

标签页管理：

• driver.window_handles 返回一个列表，按打开顺序存储所有标签页的标识符。
• driver.switch_to.window(handle) 切换到指定标签页。
• driver.switch_to_new_tab() 是 airtest-selenium 的便捷方法，直接切换到最新标签页。
• driver.switch_to_previous_tab() 则切换回上一个标签页。

断言： 断言是自动化测试的灵魂，用于验证结果是否符合预期。除了 Python 自带的 assert 语句，Selenium 和 airtest-selenium 也提供了丰富的断言方法。

4.5 收尾工作与报告生成

脚本最后，我们需要进行一些清理工作，并确保报告能正确生成。

# 关闭当前标签页（百科页面）
driver.close()
print("已关闭百科标签页")

# 切换回最初的标签页（百度搜索结果页）
driver.switch_to.window(all_handles[0])
# 或使用 driver.switch_to_previous_tab()

# 可以在原始页面继续其他操作...
# driver.find_element_by_link_text("下一页").click()

# 最后，关闭浏览器（quit会关闭所有窗口并结束驱动进程）
sleep(1)
driver.quit()
print("浏览器已关闭，脚本执行完毕。")

close() vs quit()：

• driver.close()：关闭当前标签页。
• driver.quit()：关闭所有关联的标签页，并终止 WebDriver 会话。这是结束脚本的推荐方式，它能确保释放所有资源。

运行这个完整的脚本后，别忘了点击 查看报告。你会看到一个详细的步骤列表，包含了每个操作的成功状态、日志和屏幕截图。这个报告对于调试、结果验证和团队分享都至关重要。

5. 进阶技巧与最佳实践

掌握了基础之后，下面这些技巧能让你的自动化脚本更上一层楼。

5.1 使用 Page Object 模式组织代码（强烈推荐）

当脚本越来越复杂时，将所有操作堆在一个文件里会难以维护。Page Object (PO) 模式将每个页面封装成一个类，页面的元素定位和操作作为类的方法。这样，业务逻辑脚本会变得非常清晰。

# 示例：base_page.py
class BasePage:
    def __init__(self, driver):
        self.driver = driver
        self.timeout = 10

    def find_element(self, *loc):
        return self.driver.find_element(*loc)

# 示例：baidu_home_page.py
from selenium.webdriver.common.by import By
from base_page import BasePage

class BaiduHomePage(BasePage):
    # 定位器
    SEARCH_INPUT = (By.ID, 'kw')
    SEARCH_BUTTON = (By.ID, 'su')

    def input_search_keyword(self, keyword):
        elem = self.find_element(*self.SEARCH_INPUT)
        elem.clear()
        elem.send_keys(keyword)

    def click_search(self):
        self.find_element(*self.SEARCH_BUTTON).click()

# 在主脚本中使用
from baidu_home_page import BaiduHomePage
home_page = BaiduHomePage(driver)
home_page.input_search_keyword(“PO模式”)
home_page.click_search()

5.2 处理弹窗、iframe 和下拉框

• 弹窗 (Alert)：使用 driver.switch_to.alert 来获取弹窗对象，然后进行接受、拒绝或输入文本操作。
• iframe：在操作 iframe 内的元素前，必须先用 driver.switch_to.frame(frame_reference) 切换进去。操作完后用 driver.switch_to.default_content() 切回主文档。
• 下拉框 (Select)：Selenium 提供了 Select 类来专门处理 <select> 元素，比模拟点击选项更稳定。

5.3 让脚本更稳定：显式等待 (WebDriverWait)

隐式等待 (implicitly_wait) 是全局的，有时不够精确。显式等待允许你为某个特定条件设置等待。

from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.by import By

# 等待“百度一下”按钮可点击，最多等10秒，每0.5秒检查一次
wait = WebDriverWait(driver, 10, poll_frequency=0.5)
search_button = wait.until(EC.element_to_be_clickable((By.ID, 'su')))
search_button.click()

5.4 脱离 AirtestIDE 运行脚本

当你需要将脚本集成到 CI/CD 流水线，或者在服务器上定时执行时，就需要脱离 IDE 环境。

1. 准备独立的 Python 环境：在目标机器上安装 Python。
2. 安装依赖库：

   pip install airtest-selenium
   pip install pynput  # airtest-selenium 的依赖
   # 如果你还需要生成报告
   pip install airtest
   

3. 将你的 .air 脚本转换为纯 .py 脚本。主要注意图片路径问题，.air 项目中的图片通常放在同级目录，在 .py 脚本中需要使用相对或绝对路径正确引用 Template。
4. 使用命令行运行：

   python your_web_script.py
   

5. 命令行生成报告（如果需要）：

   airtest run your_script.air --device Android:/// --log log/ --report report.html --plugin airtest_selenium.report
   

6. 总结：从工具到思维

通过这篇指南，我们走完了从零配置到编写一个健壮 Web 自动化脚本的完整旅程。AirtestIDE 的强大之处在于它极大地降低了自动化测试的初始门槛。你不需要一开始就深入理解 HTTP 协议、DOM 结构或复杂的 CSS 选择器，通过图像识别和录制，就能快速获得正反馈，看到浏览器自动运行起来，这对建立学习信心非常重要。

然而，工具的价值最终取决于使用它的人。随着你项目的深入，你会逐渐发现，图像识别虽然方便，但执行效率较低，且受屏幕分辨率、缩放、UI 样式变更影响较大。而传统的基于元素定位的方式，虽然学习成本高，但更精确、更快速、更易于维护。因此，最佳的实践策略是 “两者结合，优势互补”：用图像识别处理那些难以定位的“顽疾”，用元素定位构建脚本的主体骨架。

我个人的经验是，在快速原型验证和探索性测试时，多依赖录制和图像识别；而在构建稳定、可回归的自动化测试套件时，则要花时间打磨出可靠的元素定位策略，并采用 Page Object 等设计模式来组织代码。AirtestIDE 在这个过程中，始终是一个优秀的“起点”和“调试助手”。希望你能利用好这个工具，让自动化测试真正成为提升你和团队研发效率的利器，而不是又一个堆积在任务列表里的负担。