1. 从手工点查询到脚本自动跑Trae Playwright 要解决的真实痛点做电商或后台系统的同学大概率都经历过这种循环需求评审说「商品列表查询」要支持名称模糊、价格区间、分类下拉三种条件组合测试同学手工点一遍回归时再点一遍改个字段又得从头来。查询功能看起来简单但它的测试矩阵特别碎——正向、反向、组合、边界、空值、导出一个功能能拆出七八个场景。手工点不是不行是重复劳动太消耗人。这篇要聊的是怎么用 Trae 这个 AI 编辑器把「自然语言描述的测试场景」直接变成可运行的 Playwright 脚本并且让脚本稳定跑起来。核心链路是Trae 负责理解你的中文测试指令并生成代码Playwright 负责真实驱动浏览器执行断言而模型调用这一层用 TaoToken 统一 Key 和 API 通道来兜底避免你在多个模型供应商之间来回切配置。适合谁看已经会一点 Python 或 JavaScript、想入门自动化测试的开发者被回归测试折磨、想用 AI 提效的测试同学以及已经在用 Trae 但还没把 AI 生成脚本跑通的人。读完你能拿到一份可复制的 config.toml 骨架、一段查询用例脚本以及跑通验证的完整步骤。2. 前置准备TaoToken 统一 Key 与 API 通道配置Trae 本身是个 AI 编辑器它生成脚本的质量取决于背后接的模型。如果你直接在每个项目里硬编码不同厂商的 Key换模型时改配置能改到崩溃。TaoToken 的思路是提供一个统一的 API 入口你只维护一份 Key模型切换在配置层完成。先拿到你的 Key进入控制台创建 API Key地址是 https://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewrite 。创建后复制保存后面配置里要用。TaoToken 的 API 基础地址是 https://taotoken.net/api 注意这个地址不带任何查询参数配置时直接填这个即可。它的作用是把你对模型的请求统一转发你不需要关心底层是哪个模型服务只要在配置里声明模型名就行。对于 Trae 这类支持自定义模型接入的编辑器通常有两种配置方式一种是在图形界面的设置里填 API Base 和 Key另一种是直接改配置文件。下面给一份 config.toml 骨架你可以按自己的目录结构放。这份骨架的重点是把 provider 的 base_url 指向 TaoToken把 api_key 用环境变量注入避免明文写死在文件里。# config.toml —— Trae 模型接入配置骨架 # 作用把模型请求统一指向 TaoTokenKey 从环境变量读取 [provider] name taotoken # TaoToken 统一 API 入口不带任何查询参数 base_url https://taotoken.net/api # 从环境变量读取避免明文泄露 api_key ${TAOTOKEN_API_KEY} # 请求超时单位秒生成脚本时可能较慢给足时间 timeout 120 [model] # 按你实际可用的模型名填写这里用占位示例 name claude-sonnet max_tokens 8192 temperature 0.2 [editor] # 让 Trae 在生成代码时优先输出可运行脚本 auto_format true配置完记得在终端里导出环境变量Linux/macOS 用 exportWindows PowerShell 用 $env:。这一步不做的话api_key 会读成空字符串后面请求直接 401。# Linux / macOS export TAOTOKEN_API_KEY你的Key # Windows PowerShell $env:TAOTOKEN_API_KEY你的Key如果你用的是 Claude Code 这类命令行工具配合 Trae配置方式略有不同可以参考 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewrite 里的接入说明把 base_url 和 Key 对应填进去。核心逻辑是一样的统一入口、统一 Key、模型名在配置层切换。3. 可复制配置Playwright 环境与查询用例脚本落地环境准备分两步装 Playwright装浏览器驱动。Playwright 官方推荐用 pip 或 npm 安装Python 项目用 pip 更顺手。# 创建虚拟环境可选但推荐 python -m venv venv source venv/bin/activate # Windows 用 venv\Scripts\activate # 安装 Playwright pip install playwright # 安装浏览器驱动chromium 够用 playwright install chromium装完之后用 Trae 生成脚本。你可以在 Trae 里新建一个 .py 文件然后把下面这段自然语言测试指令贴进去让它生成 Playwright 代码。指令要写清楚页面地址、操作步骤、断言条件越具体生成质量越高。登录后访问商品列表页面https://example.com/product-list 场景1商品名称模糊查询 - 在商品名称输入框输入手机 - 点击「查询」按钮 - 断言列表商品名称均包含手机且数量大于等于1 场景2价格区间加分类组合查询 - 选择分类家电 - 输入最小价格1000 - 输入最大价格2000 - 点击「查询」按钮 - 断言列表商品分类为家电价格在1000到2000之间 场景3不存在数据查询 - 输入商品名称xxx123 - 点击「查询」按钮 - 断言页面显示暂无数据提示 场景4空条件查询 - 直接点击「查询」按钮 - 断言页面提示请至少填写一个查询条件 场景5导出功能验证 - 输入商品名称耳机 - 点击「查询」按钮 - 点击「导出Excel」按钮 - 断言下载文件存在后缀为.xlsxTrae 生成后你大概率需要微调选择器。下面给一份我实测下来比较稳的脚本结构把登录态复用、断言封装、下载监听都写进去了。选择器用占位符你按自己页面替换。# test_product_query.py # 查询功能自动化测试名称模糊、组合查询、空值、导出 import re import pytest from playwright.sync_api import sync_playwright, expect BASE_URL https://example.com/product-list pytest.fixture(scopesession) def browser_context(): with sync_playwright() as p: browser p.chromium.launch(headlessTrue) context browser.new_context(accept_downloadsTrue) # 复用登录态先登录再存 storage_state后续用例直接加载 page context.new_page() page.goto(https://example.com/login) page.fill(#username, your_user) page.fill(#password, your_pass) page.click(#login-btn) page.wait_for_url(**/dashboard) context.storage_state(pathauth_state.json) yield context browser.close() def test_name_fuzzy_query(browser_context): page browser_context.new_page() page.goto(BASE_URL) page.fill(#product-name, 手机) page.click(#search-btn) # 等待列表渲染 page.wait_for_selector(.product-item) items page.locator(.product-item .name).all_inner_texts() assert len(items) 1, 查询结果数量应大于等于1 for name in items: assert 手机 in name, f商品名 {name} 不包含关键字 def test_price_category_combo(browser_context): page browser_context.new_page() page.goto(BASE_URL) page.select_option(#category, label家电) page.fill(#min-price, 1000) page.fill(#max-price, 2000) page.click(#search-btn) page.wait_for_selector(.product-item) prices page.locator(.product-item .price).all_inner_texts() for p in prices: value float(re.sub(r[^\d.], , p)) assert 1000 value 2000, f价格 {value} 超出区间 def test_empty_condition(browser_context): page browser_context.new_page() page.goto(BASE_URL) page.click(#search-btn) expect(page.locator(.toast)).to_have_text(请至少填写一个查询条件) def test_no_result(browser_context): page browser_context.new_page() page.goto(BASE_URL) page.fill(#product-name, xxx123) page.click(#search-btn) expect(page.locator(.empty-tip)).to_have_text(暂无数据) def test_export_excel(browser_context): page browser_context.new_page() page.goto(BASE_URL) page.fill(#product-name, 耳机) page.click(#search-btn) page.wait_for_selector(.product-item) with page.expect_download() as download_info: page.click(#export-btn) download download_info.value assert download.suggested_filename.endswith(.xlsx)这份脚本的关键点有三个一是用 storage_state 复用登录态避免每个用例都重新登录二是断言用 expect 配合 locatorPlaywright 会自动等待元素出现比裸 assert 稳三是下载用 expect_download 上下文管理器能拿到真实文件名做后缀断言。4. 运行验证从 pytest 到成功结果脚本写好后直接跑 pytest。建议先跑单个用例确认环境没问题再跑全量。# 跑单个用例加 -s 看输出 pytest test_product_query.py::test_name_fuzzy_query -s # 跑全量生成 HTML 报告 pytest test_product_query.py --htmlreport.html --self-contained-html成功的话你会看到类似这样的输出collected 5 items test_product_query.py ..... [100%] 5 passed in 18.42s 如果某个用例失败pytest 会打印断言失败的具体信息比如「商品名 XX 不包含关键字」你据此回去检查选择器或页面逻辑。Playwright 还支持失败自动截图和录屏在 config 里加 trace 配置即可排查时非常有用。# 在 browser_context fixture 里加 trace context.tracing.start(screenshotsTrue, snapshotsTrue) # 用例结束后 context.tracing.stop(pathtrace.zip)trace 文件可以用 playwright show-trace trace.zip 打开能看到每一步的 DOM 快照和网络请求定位问题比看日志快得多。5. 本篇常见错排查报错一401 Unauthorized。九成是 api_key 没读到。检查环境变量是否在当前终端会话里导出config.toml 里写的是 ${TAOTOKEN_API_KEY} 这种占位符如果你的工具不支持变量替换就得改成实际值或换一种注入方式。另外确认 base_url 填的是 https://taotoken.net/api 不要多加路径。报错二TimeoutError等待选择器超时。通常是选择器写错了或者页面还没渲染完。先用 page.pause() 打开 Playwright Inspector手动点一遍看元素的实际属性。列表类元素建议用 wait_for_selector 显式等待别用固定 sleep。报错三登录态失效用例跑到一半跳回登录页。storage_state 存的是某个时间点的 cookie如果服务端 session 过期时间短跑全量时后面的用例会掉线。解决办法是在 fixture 里加一个登录态有效性检查失效就重新登录或者把 session 过期时间调长。报错四下载断言失败拿不到文件名。检查 browser.new_context 是否传了 accept_downloadsTrue没传的话 expect_download 会直接超时。另外下载按钮如果触发了新窗口要用 page.expect_popup 配合处理。报错五AI 生成的脚本选择器全是猜的。这是最常见的情况。Trae 生成代码时看不到你的真实 DOM选择器往往是它根据语义猜的。正确做法是先把页面 HTML 结构喂给它或者生成后自己用 Inspector 核对一遍。别指望一次生成就能跑微调选择器是必经步骤。6. 把 AI 生成脚本接进你的日常流程跑通单个脚本只是开始。真正提效的做法是把这套流程固化下来用 Trae 批量生成场景脚本用 TaoToken 统一模型通道避免配置漂移用 pytest 做用例管理和报告。长期做编码和 Agent 类任务的话可以考虑 Coding Plan 这类按量方案地址是 https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewrite 适合需要持续调用模型的场景。如果你只是想先验证模型对话效果可以到模型对话页面直接试 https://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewrite 。接入文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewrite 配置遇到问题先翻文档大部分坑里面都有说明。最后说个我踩过的坑别一上来就追求全场景覆盖。先把「名称模糊查询」这一个正向用例跑通确认登录态、选择器、断言三件事都对了再往上叠组合查询和边界用例。自动化测试的稳定性比覆盖率重要一个天天挂的脚本还不如手工点。 Trae 助力自动化测试：查询功能实现全攻略（TaoToken 配置与 Playwright 脚本验证）
1. 从手工点查询到脚本自动跑Trae Playwright 要解决的真实痛点做电商或后台系统的同学大概率都经历过这种循环需求评审说「商品列表查询」要支持名称模糊、价格区间、分类下拉三种条件组合测试同学手工点一遍回归时再点一遍改个字段又得从头来。查询功能看起来简单但它的测试矩阵特别碎——正向、反向、组合、边界、空值、导出一个功能能拆出七八个场景。手工点不是不行是重复劳动太消耗人。这篇要聊的是怎么用 Trae 这个 AI 编辑器把「自然语言描述的测试场景」直接变成可运行的 Playwright 脚本并且让脚本稳定跑起来。核心链路是Trae 负责理解你的中文测试指令并生成代码Playwright 负责真实驱动浏览器执行断言而模型调用这一层用 TaoToken 统一 Key 和 API 通道来兜底避免你在多个模型供应商之间来回切配置。适合谁看已经会一点 Python 或 JavaScript、想入门自动化测试的开发者被回归测试折磨、想用 AI 提效的测试同学以及已经在用 Trae 但还没把 AI 生成脚本跑通的人。读完你能拿到一份可复制的 config.toml 骨架、一段查询用例脚本以及跑通验证的完整步骤。2. 前置准备TaoToken 统一 Key 与 API 通道配置Trae 本身是个 AI 编辑器它生成脚本的质量取决于背后接的模型。如果你直接在每个项目里硬编码不同厂商的 Key换模型时改配置能改到崩溃。TaoToken 的思路是提供一个统一的 API 入口你只维护一份 Key模型切换在配置层完成。先拿到你的 Key进入控制台创建 API Key地址是 https://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewrite 。创建后复制保存后面配置里要用。TaoToken 的 API 基础地址是 https://taotoken.net/api 注意这个地址不带任何查询参数配置时直接填这个即可。它的作用是把你对模型的请求统一转发你不需要关心底层是哪个模型服务只要在配置里声明模型名就行。对于 Trae 这类支持自定义模型接入的编辑器通常有两种配置方式一种是在图形界面的设置里填 API Base 和 Key另一种是直接改配置文件。下面给一份 config.toml 骨架你可以按自己的目录结构放。这份骨架的重点是把 provider 的 base_url 指向 TaoToken把 api_key 用环境变量注入避免明文写死在文件里。# config.toml —— Trae 模型接入配置骨架 # 作用把模型请求统一指向 TaoTokenKey 从环境变量读取 [provider] name taotoken # TaoToken 统一 API 入口不带任何查询参数 base_url https://taotoken.net/api # 从环境变量读取避免明文泄露 api_key ${TAOTOKEN_API_KEY} # 请求超时单位秒生成脚本时可能较慢给足时间 timeout 120 [model] # 按你实际可用的模型名填写这里用占位示例 name claude-sonnet max_tokens 8192 temperature 0.2 [editor] # 让 Trae 在生成代码时优先输出可运行脚本 auto_format true配置完记得在终端里导出环境变量Linux/macOS 用 exportWindows PowerShell 用 $env:。这一步不做的话api_key 会读成空字符串后面请求直接 401。# Linux / macOS export TAOTOKEN_API_KEY你的Key # Windows PowerShell $env:TAOTOKEN_API_KEY你的Key如果你用的是 Claude Code 这类命令行工具配合 Trae配置方式略有不同可以参考 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewrite 里的接入说明把 base_url 和 Key 对应填进去。核心逻辑是一样的统一入口、统一 Key、模型名在配置层切换。3. 可复制配置Playwright 环境与查询用例脚本落地环境准备分两步装 Playwright装浏览器驱动。Playwright 官方推荐用 pip 或 npm 安装Python 项目用 pip 更顺手。# 创建虚拟环境可选但推荐 python -m venv venv source venv/bin/activate # Windows 用 venv\Scripts\activate # 安装 Playwright pip install playwright # 安装浏览器驱动chromium 够用 playwright install chromium装完之后用 Trae 生成脚本。你可以在 Trae 里新建一个 .py 文件然后把下面这段自然语言测试指令贴进去让它生成 Playwright 代码。指令要写清楚页面地址、操作步骤、断言条件越具体生成质量越高。登录后访问商品列表页面https://example.com/product-list 场景1商品名称模糊查询 - 在商品名称输入框输入手机 - 点击「查询」按钮 - 断言列表商品名称均包含手机且数量大于等于1 场景2价格区间加分类组合查询 - 选择分类家电 - 输入最小价格1000 - 输入最大价格2000 - 点击「查询」按钮 - 断言列表商品分类为家电价格在1000到2000之间 场景3不存在数据查询 - 输入商品名称xxx123 - 点击「查询」按钮 - 断言页面显示暂无数据提示 场景4空条件查询 - 直接点击「查询」按钮 - 断言页面提示请至少填写一个查询条件 场景5导出功能验证 - 输入商品名称耳机 - 点击「查询」按钮 - 点击「导出Excel」按钮 - 断言下载文件存在后缀为.xlsxTrae 生成后你大概率需要微调选择器。下面给一份我实测下来比较稳的脚本结构把登录态复用、断言封装、下载监听都写进去了。选择器用占位符你按自己页面替换。# test_product_query.py # 查询功能自动化测试名称模糊、组合查询、空值、导出 import re import pytest from playwright.sync_api import sync_playwright, expect BASE_URL https://example.com/product-list pytest.fixture(scopesession) def browser_context(): with sync_playwright() as p: browser p.chromium.launch(headlessTrue) context browser.new_context(accept_downloadsTrue) # 复用登录态先登录再存 storage_state后续用例直接加载 page context.new_page() page.goto(https://example.com/login) page.fill(#username, your_user) page.fill(#password, your_pass) page.click(#login-btn) page.wait_for_url(**/dashboard) context.storage_state(pathauth_state.json) yield context browser.close() def test_name_fuzzy_query(browser_context): page browser_context.new_page() page.goto(BASE_URL) page.fill(#product-name, 手机) page.click(#search-btn) # 等待列表渲染 page.wait_for_selector(.product-item) items page.locator(.product-item .name).all_inner_texts() assert len(items) 1, 查询结果数量应大于等于1 for name in items: assert 手机 in name, f商品名 {name} 不包含关键字 def test_price_category_combo(browser_context): page browser_context.new_page() page.goto(BASE_URL) page.select_option(#category, label家电) page.fill(#min-price, 1000) page.fill(#max-price, 2000) page.click(#search-btn) page.wait_for_selector(.product-item) prices page.locator(.product-item .price).all_inner_texts() for p in prices: value float(re.sub(r[^\d.], , p)) assert 1000 value 2000, f价格 {value} 超出区间 def test_empty_condition(browser_context): page browser_context.new_page() page.goto(BASE_URL) page.click(#search-btn) expect(page.locator(.toast)).to_have_text(请至少填写一个查询条件) def test_no_result(browser_context): page browser_context.new_page() page.goto(BASE_URL) page.fill(#product-name, xxx123) page.click(#search-btn) expect(page.locator(.empty-tip)).to_have_text(暂无数据) def test_export_excel(browser_context): page browser_context.new_page() page.goto(BASE_URL) page.fill(#product-name, 耳机) page.click(#search-btn) page.wait_for_selector(.product-item) with page.expect_download() as download_info: page.click(#export-btn) download download_info.value assert download.suggested_filename.endswith(.xlsx)这份脚本的关键点有三个一是用 storage_state 复用登录态避免每个用例都重新登录二是断言用 expect 配合 locatorPlaywright 会自动等待元素出现比裸 assert 稳三是下载用 expect_download 上下文管理器能拿到真实文件名做后缀断言。4. 运行验证从 pytest 到成功结果脚本写好后直接跑 pytest。建议先跑单个用例确认环境没问题再跑全量。# 跑单个用例加 -s 看输出 pytest test_product_query.py::test_name_fuzzy_query -s # 跑全量生成 HTML 报告 pytest test_product_query.py --htmlreport.html --self-contained-html成功的话你会看到类似这样的输出collected 5 items test_product_query.py ..... [100%] 5 passed in 18.42s 如果某个用例失败pytest 会打印断言失败的具体信息比如「商品名 XX 不包含关键字」你据此回去检查选择器或页面逻辑。Playwright 还支持失败自动截图和录屏在 config 里加 trace 配置即可排查时非常有用。# 在 browser_context fixture 里加 trace context.tracing.start(screenshotsTrue, snapshotsTrue) # 用例结束后 context.tracing.stop(pathtrace.zip)trace 文件可以用 playwright show-trace trace.zip 打开能看到每一步的 DOM 快照和网络请求定位问题比看日志快得多。5. 本篇常见错排查报错一401 Unauthorized。九成是 api_key 没读到。检查环境变量是否在当前终端会话里导出config.toml 里写的是 ${TAOTOKEN_API_KEY} 这种占位符如果你的工具不支持变量替换就得改成实际值或换一种注入方式。另外确认 base_url 填的是 https://taotoken.net/api 不要多加路径。报错二TimeoutError等待选择器超时。通常是选择器写错了或者页面还没渲染完。先用 page.pause() 打开 Playwright Inspector手动点一遍看元素的实际属性。列表类元素建议用 wait_for_selector 显式等待别用固定 sleep。报错三登录态失效用例跑到一半跳回登录页。storage_state 存的是某个时间点的 cookie如果服务端 session 过期时间短跑全量时后面的用例会掉线。解决办法是在 fixture 里加一个登录态有效性检查失效就重新登录或者把 session 过期时间调长。报错四下载断言失败拿不到文件名。检查 browser.new_context 是否传了 accept_downloadsTrue没传的话 expect_download 会直接超时。另外下载按钮如果触发了新窗口要用 page.expect_popup 配合处理。报错五AI 生成的脚本选择器全是猜的。这是最常见的情况。Trae 生成代码时看不到你的真实 DOM选择器往往是它根据语义猜的。正确做法是先把页面 HTML 结构喂给它或者生成后自己用 Inspector 核对一遍。别指望一次生成就能跑微调选择器是必经步骤。6. 把 AI 生成脚本接进你的日常流程跑通单个脚本只是开始。真正提效的做法是把这套流程固化下来用 Trae 批量生成场景脚本用 TaoToken 统一模型通道避免配置漂移用 pytest 做用例管理和报告。长期做编码和 Agent 类任务的话可以考虑 Coding Plan 这类按量方案地址是 https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewrite 适合需要持续调用模型的场景。如果你只是想先验证模型对话效果可以到模型对话页面直接试 https://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewrite 。接入文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewrite 配置遇到问题先翻文档大部分坑里面都有说明。最后说个我踩过的坑别一上来就追求全场景覆盖。先把「名称模糊查询」这一个正向用例跑通确认登录态、选择器、断言三件事都对了再往上叠组合查询和边界用例。自动化测试的稳定性比覆盖率重要一个天天挂的脚本还不如手工点。