这篇文章将提供一份清晰且实用的指南,介绍AI在端到端测试自动化中的应用。我将使用AI来验证产品的端到端功能,确保其符合所需规格。
首先,让我们观看一个演示 👀👀,然后我会详细解释其工作原理。
(视频没有加速。我选择Vinted.com作为示例,因为我经常从我妻子那里听到它...
我告诉AI代理,它必须打开主页,搜索产品,然后打开产品详情页,并在产品页面上检查价格。
上面的视频展示了AI代理如何感知这个过程——自主解释面向业务的测试用例,评估网页的当前状态(截图),制定计划和决策,并执行测试。它参与多步决策,利用各种类型的推理来实现其目标。
1. 端到端测试的角色
再次强调:端到端测试的主要目标是通过模拟客户行为来验证新功能和回归功能是否符合产品需求和设计。
端到端测试是一种广泛用于回归验证的测试方法。它可以手动执行——例如编写一个健全性检查清单并手动执行测试——或者通过使用Playwright或Appium等工具编写测试脚本来自动化执行。
上图描述了端到端测试的三个关键方面:
- 理解用户从功能中获得的益处——识别功能为用户带来的价值。
- 从用户的角度设计测试用例——创建与真实用户交互一致的测试场景。
- 在开发过程中迭代测试执行——在整个开发过程中持续运行测试用例,以验证实现的代码是否符合所需功能。
2. 实际操作——使用AI代理执行测试用例
在传统的端到端测试自动化中,通常的方法如下:
- 分析功能——理解功能及其预期行为。
- 分析和编写测试用例——根据用户交互和需求定义测试场景。
- 编写自动化脚本——使用自动化框架实现测试用例。
现在,让我们看看AI代理如何优化这个过程。
2.1 - 多决策AI代理可以优化测试过程
从上面的视频中,这是AI代理读取的测试用例:
场景:客户可以从搜索结果中搜索并打开产品详情页
- 打开 https://www.vinted.com
- 国家选择弹出窗口可见
- 选择法国作为我居住的国家
- 接受所有隐私偏好
- 搜索结果'Chanel',然后按Enter键
- 向下滚动到第一个产品
- 点击产品列表中第一行的第二个产品
- 断言价格可见
因此,AI代理实际上读取了一些面向业务的语言,而不是像“点击A”/“输入B”这样的指令。AI代理本身会进行推理并规划步骤。
运行此测试需要以下硬件:
- Nvidia L40s - 1 x GPU,48GB GPU内存,7 x vCPU,40GB CPU内存
2.2 - 此AI代理解决了哪些问题
回顾我们在第1部分提到的内容,端到端测试可以通过编写自动化测试脚本或手动执行测试来完成。
随着AI代理的引入,出现了一种新方法——只需将测试用例提供给AI代理,无需编写测试脚本。AI代理通过自主执行测试用例取代了手动执行。
具体来说,它解决了以下问题:
- 降低手动测试成本——AI代理可以解释任何人编写的测试用例,无需编写测试脚本,并允许随时执行测试。
- 降低测试脚本维护工作量——AI代理自主确定下一步浏览器操作,减少了因小UI更改而修改测试的需要。
- 提高可访问性和参与度——从传统QA工程师编写自动化脚本,到开发人员贡献,现在发展到任何精通英语并熟悉产品的人可以编写端到端测试用例。
2.3 - 嵌入到Playwright中
test("[UI-Tars - Business]用户可以搜索然后查看产品", async ({ page, ai, aiAssert, aiWaitFor }) => {
await page.goto("https://www.vinted.com")
await aiWaitFor('国家选择弹出窗口可见')
await ai("选择法国作为我居住的国家")
await page.waitForURL((url: URL) => url.hostname.indexOf('vinted.fr') >= 0)
await ai("接受所有隐私偏好")
await ai("点击搜索栏,然后搜索'Chanel',并按Enter键")
await ai("向下滚动到第一个产品")
await ai("点击产品列表中第一行的第二个产品")
expect(page.url()).toContain("/items/")
await aiAssert("价格可见")
})
3. 介绍UI-Tars LLM和Midscene
3.1 UI-Tars
UI-Tars是一个本地的、开源的GUI多模态LLM,它基于qwen-2.5-VL(通义千问2.5 VL)重建。该模型可以同时处理文本和GUI图像,并提供STF和DPO两种模型,具有大量GUI截图。UI-Tars专为与GUI交互而设计。
它在以下方面表现出色:
- 浏览器应用
- 桌面和桌面应用
- 移动和移动应用
它支持两种语言的提示:
- 中文
- 英文
更多详细信息 - 请阅读论文
3.2 Midscene
Midscene是一个状态机,它使用提供的模型构建一个多推理AI代理。
它支持以下LLM:
- UI-Tars(主分支不支持AIAssert、AIQuery和AIWaitfor,但可以查看我的分支)
- Qwen-2.5 VL(通义千问2.5,我真的很喜欢这个名字...)
- GPT-4o
4. UI-Tars与Midscene之间的机制
4.1 编排和比较
其核心能力是基于视觉输入和指令自主规划、推理和执行多步操作,就像人类一样,直到确定任务完成。
它具备以下3项关键能力:
- 跨平台多步规划——根据指令,可以在网络浏览器、桌面或移动应用中规划多个操作。
- 工具利用执行——它可以利用外部工具来执行计划的操作。
- 自主推理与适应——它可以确定任务是否完成,或者在必要时采取额外操作。
我比较了截至2025年2月底市场上最受欢迎的解决方案:
解决方案 | 是否为AI代理 | 成本 | LLM的额外输入 | 如何获取HTML元素 | 多步决策与自主推理 | Playwright集成 | 移动应用支持 | 桌面应用 |
---|---|---|---|---|---|---|---|---|
UI-Tars(/GPT-4o) + Midscene | 是 | 1.8/小时(UI−Tars:7B)或约0.1263875/测试(OpenAI GPT-4o) | GUI截图 | GUI截图处理 | 是 | 是 | 是 | 是 |
Llama 3.2 + 绑定工具 + LangGraph | 是 | 0.2\$/测试 | HTML | HTML DOM处理 | 否 | 是 | 尚未支持 | 否 |
ZeroStep / auto-playwright | 有点 | 未知 | HTML | HTML DOM处理 | 否 | 是 | 未知 | 否 |
StageHand(GPT-4o或Claude 3.5) | 是 | 未知 | HTML & GUI截图 | HTML DOM处理 | 尚未支持 | 是 | 尚未支持 | 否 |
总结 - UI-Tars(或GPT-4o)与Midscene的解决方案似乎是适用性和成本最低的方法。
4.2 多步决策和推理
让我们看一下上面示例中的一个实际步骤——搜索'Chanel',然后按Enter键。
4.2.1 Midscene向UI-Tars发送系统消息
Midscene将测试步骤作为系统消息的一部分发送给LLM,同时附上当前截图。
4.2.2 UI-Tars返回思考和操作
由于这个“用户步骤”需要多个浏览器操作,例如识别搜索栏的位置,然后点击搜索栏,然后输入“channel”,最后按“Enter”键。因此,UI-Tars做出第一个决策“点击搜索栏”。
4.2.3 UI-Tars开始推理并迭代计划同一用户步骤的下一个浏览器操作
Midscene目前在每次推理之前都会截取屏幕截图,因此UI-Tars始终知道浏览器的最新状态。此外,UI-Tars在推理时会将所有聊天历史记录发送回UI-Tars。
4.2.4 UI-Tars自主检查用户步骤是否完成
5. 代码
6. 此PoC的成本
(UI-Tars成本)
(GPT-4o成本)