1. browser use简介

Browser Use 是一个基于 Python 开发的开源库，它将先进的 AI 技术与浏览器自动化功能深度融合。通过集成Playwright等浏览器自动化工具，Browser Use允许开发者使用任何支持LangChain的大型语言模型（如GPT-4、Claude等）来自动化浏览网页、提取信息、模拟用户操作等。

1.1. playwright

  • Playwright 是一个由微软开发的现代化 端到端（E2E）测试工具，专门用于自动化 Web 浏览器操作。它支持 Chromium（Chrome、Edge）、Firefox 和 WebKit（Safari）三大浏览器引擎，且适用于跨平台（Windows、macOS、Linux）。

1.2. LangChain

  • LangChain 是一个用于构建大语言模型（LLM）应用的开发框架，它通过模块化设计简化了 LLM 应用的开发流程，支持开发者快速搭建基于语言模型的复杂应用（如聊天机器人、知识库问答、自动化工作流等）。其核心思想是通过“链（Chain）”将不同组件（如模型、数据、工具）灵活组合，实现端到端的功能。

2. 测试demo用例1

2.1. 测试用例提示词

task:
  case:
    - 1. 打开网页 {test_url}/sp/ebdapp/home
    - 2. 点击新建应用
    - 3. 新建应用弹窗下 点击从空白创建
    - 4. 新建应用弹窗下 填写应用名称:AI新建应用{now}
    - 5. 新建应用弹窗下 点击确定按钮
    - 6. 断言提示信息显示 应用新建成功 并判断是否能断言成功
    - 7. 新建应用成功后 切换浏览器到最新的标签页
    - 8. 最新的标签页 点击新建页面
    - 9. 新建页面弹窗 点新建自定义页面
    - 10. 创建页面弹窗 输入页面名称 AI测试新建EB页面{now}
    - 11. 创建页面弹窗 点击确定按钮
    - 12. 断言提示信息显示 保存成功 并判断是否能断言成功
    - 13. 新建EB页面成功后 切换浏览器到最新的标签页
    - 14. 点击页面中间位置 xpath定位为 //div[contains(@class,"weapp-ebde-grid-layout")]
    - 15. 从左侧的组件栏中 查找列表 点击列表
    - 15.1 点击请选择数据源 打开数据源设置弹窗
    - 15.2 数据源设置弹窗下 点击业务模块-点击日志-点击操作日志-点击确定
    - 15.3 点击点击设置字段 打开显示字段弹窗
    - 15.4 显示字段弹窗下 点击全选label-点击确定
    - 16. 等待0.5秒 点击左上的保存按钮
    - 17. 等待1秒 点击预览按钮
    - 18. 获取预览页面的全部信息
  expect:
    show: 序号

2.2. 执行过程

3. 专项事井然-测试用例demo

3.1. 测试用例提示词:

task:
  case:
    - 打开网页 {test_url}/ebdapp/view/1020021532740116481/PAGE
    - 点击 新建项目
    - 点击手动创建 xpath定位为 '//p[text()="手动创建"]'  # 无法定位手动创建
    - 选择项目类型弹窗 点击IT信息化项目类型
    - 切换到新标签页
    - 创建项目页面 输入项目名称 'AI自动化测试项目{now}'
    - 创建项目页面 下拉选择项目状态 '进行中'
    - 创建项目页面 点击保存按钮
    - 打开网页 {test_url}/ebdapp/view/1020021532740116481/PAGE
    - 点击 项目管理, 点击 我的项目
    - 获取项目列表信息,断言新建项目是否成功
  expect:
    show: AI自动化测试项目{now}

3.2. 执行过程

4. 专项九氚汇-测试用例demo2-提交流程

4.1. 测试用例提示词:

task:
  case:
    - 打开网页 {test_url}/ebdapp/view/1024805950238597124/PAGE/1024805976159397672-1024805976159395990?
#    - 打开网页 {test_url}/sp/workflow/flowpage/create/1063406582299271170?  # 调试测试使用,直接访问流程填写页面
    - 点击 流程
    - 点击 全部流程
    - 点击 提交申请
    - 提交申请弹窗 点击 项目采购流程(2025-02-22 22:24:23)
    - 切换新标签页
    - 采购数量 输入 1000
    - 采购单价 输入 100
    - 预估金额 输入 80000
    - 供应商名称 输入 AI测试
    - 点击所属项目的输入框 点击测试11  # 执行很慢,而且成功率不高,测试了3次,成功1次
    - 点击 提交
#    - 提交确认弹窗 点击一级审批下的审批人员下的请选择输入框 选择普通成员一
#    - 提交确认弹窗 向下滚动
#    - 提交确认弹窗 二级审批下的审批人员 选择普通成员二
#    - 提交确认弹窗 向下滚动
#    - 提交确认弹窗 三级审批下的审批人员 选择普通成员三
    - 提交确认弹窗 点击 确认并提交流程
    - 切换回原标签页
    - 点击全部流程
    - 获取返回当前页的全部显示信息
  expect:
    show: 项目采购流程(2025-02-22 22:24:23)

4.2. 执行过程

5. 多家大语言的执行速度和执行效果测试

5.1. gpt-4o

  • 优点: 效果最好的, 速度快, 操作的准确率也较高
  • 缺点: 需要网络代理,且价格较贵,差不多是deepseekR1费用的7倍,仅测试几天的使用就用完了5美金的赠送费用
  • 执行test_task用例: 45秒

5.2. deepseek官方接口

  • 优点: 聪明
  • 缺点1: deepseek官方接口目前很不稳定,经常无法调用.或者第一次调用成功,第二次就失败.
  • 缺点2: 太慢了,作为推理模型,即使是很简单的问题,也会推理思考很久,就像是一个知识渊博,但回答慢的让人着急的老教授,不适合作用于我们这种测试场景

5.3. 公司本地部署的deepseek-R1-14B

  • 优点: 成本低,无需网络代理, 本地部署不存在数据泄露风险
  • 缺点: 速度慢,执行时间是gpt-4o的2-3倍,而且操作成功率也更低

5.4. 硅基流动的大模型接口

  • model="deepseek-ai/DeepSeek-V3", # 慢,不够聪明
  • model="deepseek-ai/DeepSeek-R1-Distill-Qwen-32B", # 聪明,但是太慢了,作为推理模型,即使是很简单的问题,也会推理思考很久.就像是一个知识渊博,但回答慢的让人着急的老教授,不适合作用于我们这种测试场景
  • model="Qwen/Qwen2.5-14B-Instruct", # 相对上面两个deepseek的更快, 执行test_task用例:40秒-62
  • model="Qwen/Qwen2.5-32B-Instruct", # 比14B相对更聪明，执行时间也没有多多少, 执行test_task用例: 55秒
  • model="Qwen/Qwen2.5-7B-Instruct", # 执行test_task用例:太笨了, 直接执行失败了
  • model="01-ai/Yi-1.5-9B-Chat-16K", # 模型不支持
  • model="THUDM/glm-4-9b-chat", # 智谱AI: 不够聪明,返回数据的格式都不符合要求
  • model="Pro/THUDM/glm-4-9b-chat", # 智谱AI: 不够聪明,执行失败
  • model="meta-llama/Meta-Llama-3.1-8B-Instruct", # 不够聪明,执行失败
  • model="meta-llama/Meta-Llama-3.1-70B-Instruct", # 不够聪明,执行失败
  • model="meta-llama/Llama-3.3-70B-Instruct", # 执行到最后直接卡死了,不操作也不报错停止

5.5. 阿里云百炼大模型接口

  • model="qwen-max", # 执行效果还行
  • model="qwen-plus", # 执行登录用例: 3分钟
  • model="qwen-turbo", # 执行登录用例: 2分钟,有点笨,执行一直循环

5.6. 字节火山大模型-豆包

  • model="ep-20250220153306-tswkf", # Doubao-1.5-lite-32k,执行结果数据不符合要求,无法使用
  • model="ep-20250220154403-wfw29", # Doubao-1.5-pro-32k,执行结果数据不符合要求,无法使用

5.7. 大模型试用总结

  • 效果最好的是gpt4o,但是价格太贵,且使用麻烦,需要网络代理.国产的大模型又没有那个能做到高效执行且精准操作的.

目前体验勉强能用的两个:

  1. 硅基流动的Qwen/Qwen2.5-32B-Instruct
  2. 阿里云百联的qwen-max和qwen-plus

6. 可能需要通过二开解决的问题

6.1. 需二开解决的问题

  • 执行过程中每个步骤都会频繁的获取和保存cookie,这个需要二开修改限制获取cookie的次数
  • 目前获取cookie的方法是通过登录用例获取,但无法处理验证码,后续需要追加接口登录获取cookie
  • 目前默认执行保存全部操作的GIF动图,用例多了之后文件大小或很大,需要二开修改会仅保存断言截图,或仅保存失败用例的GIF动图(已修改)
  • 部分目前不支持的操作(1.用例执行过程中断言截图,2.键盘事件如回车搜索),需要在controller中自定义新增符合我们需求的action,但源码较复杂,二开的难度较大(已新增鼠标悬停方法)
  • 部分元素无法定位的问题, 可能也需要通过二开修改DOM数据解析方法实现,但这个的二开难度更大,需要熟悉前端的同事协助评估
  • 执行报告GIF中的步骤说明,中文乱码,需要处理(修改了源码中使用的字体解决了GIF中文乱码)

6.2. 鼠标悬停方法(二开新增)

6.2.1. controller下的servise.py
# Element Interaction Actions
@self.registry.action('Mouse Hover', param_model=MouseHoverAction)
async def mouse_hover(params: MouseHoverAction, browser: BrowserContext):
    """二开新增 - 鼠标悬停动作"""
    session = await browser.get_session()
    state = session.cached_state

    if params.index not in state.selector_map:
        raise Exception(
            f'Element with index {params.index} does not exist - retry or use alternative actions')

    element_node = state.selector_map[params.index]
    msg = None
    try:
        # 执行鼠标悬停操作
        await browser._mouse_hover_node(element_node)
        msg = f'🖱️  MouseHover element with index {params.index}: {element_node.get_all_text_till_next_clickable_element(max_depth=2)}'
        logger.info(msg)
        logger.debug(f'Element xpath: {element_node.xpath}')
        return ActionResult(extracted_content=msg, include_in_memory=True)
    except Exception as e:
        logger.warning(
            f'Element not MouseHover with index {params.index} - most likely the page changed')
        return ActionResult(error=str(e))
6.2.2. controller下的views.py
class MouseHoverAction(BaseModel):
	# 鼠标悬停动作的数据参数类型, 通过定义数据模型,确保AI按照提示词生成的输入数据的类型,和结构是否正确。
	index: int
	xpath: Optional[str] = None
6.2.3. browser下的context.py
async def _mouse_hover_node(self, element_node: DOMElementNode) -> Optional[str]:
    """
    二次开发 - 增加鼠标悬停操作方法
    """
    page = await self.get_current_page()

    try:
        # Highlight before clicking
        if element_node.highlight_index is not None:
            await self._update_state(focus_element=element_node.highlight_index)

        element_handle = await self.get_locate_element(element_node)

        if element_handle is None:
            raise Exception(f'Element: {repr(element_node)} not found')

        async def mouse_hover(hover_func):
            """实际执行的鼠标悬停方法"""
            await hover_func()
            await page.wait_for_load_state()
            await self._check_and_handle_navigation(page)

        try:
            # 使用playwright的hover方法
            return await mouse_hover(lambda: element_handle.hover(timeout=1500))
        except URLNotAllowedError as e:
            raise e
        except Exception:
            try:
                # 继续尝试JS执行鼠标悬停
                return await mouse_hover(lambda: page.evaluate(
                    '(el) => { const event = new MouseEvent("mouseover", { bubbles: true }); el.dispatchEvent(event); }',
                    element_handle
                ))
            except URLNotAllowedError as e:
                raise e
            except Exception as e:
                raise Exception(f'Failed to mouse hover element: {str(e)}')

    except URLNotAllowedError as e:
        raise e
    except Exception as e:
        raise Exception(f'Failed to mouse hover element: {repr(element_node)}. Error: {str(e)}')

7. 提示词总结

7.1. 系统提示词

  • class SystemPrompt: 提示词类中定义了核心的系统提示词,给AI设定了身份,告知了AI需要做什么,以什么格式返回数据,包含那些可
7.1.1. 重要规则

系统提示词

用途

补充

RESPONSE FORMAT

规范返回数据的格式

ACTIONS

告诉AI如何执行动作

ELEMENT INTERACTION

规范元素操作的方式

NAVIGATION & ERROR HANDLING

执行中遇到错误时的处理逻辑

TASK COMPLETION

规定任务完成的条件:

  1. 所有步骤执行完毕才算完成
  2. 完成只能执行一次
  3. 任务未完成前,不要停止执行
  4. 如果完成条件需要特定的信息,确保获取到对应信息,才完成

可以尝试通过完成条件的第4点进行用例断言

VISUAL CONTEXT

增加视觉相关的辅助功能

目前仅gpt-4o能比较好的支持视觉,国产常用的几个大模型都不支持

Form filling

表格填写时可能遇到的注意事项

ACTION SEQUENCING

动作序列:

1.规范动作执行的方式

2.提高动作执行的效率

Long tasks

针对长任务的补充说明

Extraction

说明提取信息的方法和调用方法
7.1.2. 输入格式input_format
  • 规范AI转换用户输入的文本为可操作的语句给到框架的格式.需要包含URL,可用标签页,可操作元素.
7.1.3. 获取系统信息get_system_message
  • 规范获取信息的方式和方法
7.1.4. 用户自定义补充系统提示词
  • 继承系统提示词类,添加额外的系统提示词,但目前测试的效果比较一般,部分提示词不生效,比如捕获页面错误
class MySystemPrompt(SystemPrompt):
    """前置添加额外的提示词"""
    def important_rules(self):
        existing_rules = super().important_rules()
        new_rules1 = '大多数情况下,按钮点击都是点确定按钮,不要点取消按钮'
        new_rules2 = '任何执行阶段,只要出现错误提示弹窗(弹窗内容可能为:系统错误,error,500等),则判断用例执行失败,并停止运行'
        new_rules3 = '当遇见不明弹窗遮挡时,点击右上的x关闭弹窗'
        return f'{existing_rules}\n{new_rules1}\n{new_rules2}\n{new_rules3}'

7.2. 动作提示词

  • 以下为框架内目前支持的动作,其它的动作可能需要二开补充,或通过优化提示词实现操作
  • 目前不支持或操作困难的组件: 人员选择框, 浏览选择框, 日期时间选择框, 符号操作按钮

中文提示词

对应controller中action

说明

谷歌搜索

search_google

可以参考这个方法,尝试新增动作

点击

click_element

输入

input_text

快捷键

send_keys

举例: Backspace, Insert, PageDown, Delete, Control+Shift+T

打开网页

go_to_url

切换选项卡/标签页

switch_tab

打开 一个新的选项卡/标签页

open_tab

提取/获取页面内容

extract_content

向下/向上滚动

scroll_down, scroll_up

滚动到文本

scroll_to_text

获取下拉选项

get_dropdown_options

选择下拉选项

select_dropdown_option

看源码应该仅支持<select>标签

鼠标悬停

mouse_hover

二开新增的操作方法

7.3. 其它自己总结的提示词

中文提示词

作用

补充

点击页面中间位置 xpath定位为 //div[contains(@class,"weapp-ebde-grid-layout")]

定位部分不好描述的元素

目前demo1是可用的,但还未大批量验证,这样写是否可行

点击所属项目的输入框 点击测试11

操作选择浏览框数据

执行很慢,而且成功率不高,测试了3次,成功1次

编辑操作组弹窗 点击已设置操作者下 所有人列的启用按钮

但存在重复的中文时,尽量详细的描述去,帮助AI找到你想操作的元素

8. browser use中使用的第三方库总结

8.1. Pydantic

  1. 用在views.py中,用于数据验证和设置管理。通过定义数据模型,确保AI按照提示词生成的输入数据的类型,和结构是否正确。
  2. 数据验证：自动验证输入数据是否符合类型和规则。
  3. 数据转换：将原始数据转换为符合模型的 Python 对象。
  4. 序列化与反序列化：支持将模型转换为字典或 JSON。
  5. IDE 友好：利用类型提示提供自动补全和错误提示。
# 人工智能
Logo
DeepSeek技术社区

欢迎加入DeepSeek 技术社区。在这里，你可以找到志同道合的朋友，共同探索AI技术的奥秘。

更多推荐

cover

DeepSeek本地部署全攻略：保姆级教程带你轻松上手

avatar DeepSeek技术社区
cover

或许是全网最全的 DeepSeek 使用指南，90% 的人都不知道的使用技巧

avatar DeepSeek技术社区
cover

最全面的DeepSeek提示词总结，轻松应对各个时期各个阶段的论文问题

avatar DeepSeek技术社区