Midscene.js介绍和使用

Midscene.js介绍和使用

由于课程任务的需要，本人去寻找了 AI + 软件测试的相关应用，发现了 Midscene 这一便利的 UI 自动化测试工具。本篇博客主要对 Midscene 作了介绍，也给出了本人在使用 Midscene 过程中遇到的问题及摸索到的解决方案。

Midscene.js 是一个开源的基于多模态大型语言模型的 UI 自动化测试工具，它是由字节的 web-infra 团队开发。它能够智能地“解析”用户界面并自动执行所需操作，从而简化端到端（e2e）测试流程。借助多模态大模型，Midscene 使测试人员可以用自然语言描述测试步骤，从而显著降低了编写测试脚本的难度。无论是查找页面元素、进行交互操作还是确认页面状态，Midscene 都能通过解读自然语言指令来高效完成这些任务。

快速体验

Midscene 的一大亮点是它集成了浏览器插件形式，以此能快速体验其核心功能。我们能在 Chrome 浏览器的拓展商店轻松找到它。

Midscene 的浏览器插件形式如图所示：

要使用 Midscene 拓展，我们需要配置插件环境，这要求我们配置相应的大模型API。Midscene 默认集成了 OpenAI SDK 调用 AI 服务。但我们也可以使用其他兼容此类接口的模型服务。因为 OpenAI 已经不向我国提供服务了，我们需要选择其他的大模型。官方教程中也给出了许多其他模型的配置示例，这里我用了阿里云的qwen-vl-max-latest模型，新用户有一定的免费额度。

Midscene 主要提供了三种AI执行方法：交互, 提取和断言。

• 交互 - 用 .ai 或.aiAction方法描述步骤并执行交互。你可以在 Action 栏中用自然语言输入想要让 AI 执行的操作。

• 提取 - 用 .aiQuery 从 UI 中“理解”并提取数据，返回值是 JSON 格式，你可以尽情描述想要的数据结构。你可以在 Query 栏中用自然语言输入你想让 AI 在当前页面提取的信息。下图使用了Midscene 的 Query 功能提取了北京未来五天的最高温和最低温的 json 格式数据。

• 断言 - 用 .aiAssert 来执行断言。在 Assert 栏中用自然语言输入 AI 需要执行的对于当前页面的断言。

通过Midscene浏览器插件相信你可以很快地掌握和理解Midsce