1. 项目概述当AI开始写测试脚本如果你是一名测试工程师或者正在学习自动化测试那么下面这个场景你一定不陌生产品经理扔过来一个需求文档上面写着“用户登录后点击首页的‘我的订单’筛选出最近一个月的订单并导出为Excel”。然后你打开IDE开始思考用Selenium还是Playwright定位元素用ID、XPath还是CSS Selector等待策略用隐式等待还是显式等待接着你开始一行行地敲代码调试元素定位处理各种异步加载和弹窗一个简单的功能点可能就要耗费大半天。但现在情况正在发生变化。你只需要对着电脑说一句“帮我写一个测试脚本用Playwright打开Chrome浏览器访问我们的测试环境登录后进入订单页面筛选上个月的订单数据。”几秒钟后一段结构清晰、包含了必要等待和错误处理的Playwright Python代码就呈现在你面前。这不再是科幻电影里的情节而是“AI自动生成Selenium/Playwright脚本”技术正在带来的现实变革。简单来说这个项目的核心就是利用大语言模型LLM将人类用自然语言描述的测试需求直接转换为可执行的、高质量的Web自动化测试脚本。它瞄准的痛点非常明确降低自动化测试的编写门槛将测试工程师从重复、繁琐的代码编写中解放出来让他们能更专注于测试用例设计、业务逻辑验证和结果分析这些更具创造性的工作。无论是对于刚入门的新手还是追求效率的资深工程师这项技术都意味着工作流的重塑。新手不再需要死记硬背复杂的API和定位语法老手则可以将重复性的脚本编写工作交给AI自己进行审核和优化效率提升可能不止一倍。接下来我们就深入拆解看看这背后的技术是如何运作的以及在实际操作中我们该如何用好这把“利器”。2. 核心思路与技术选型解析2.1 为什么是Selenium和Playwright在讨论AI生成之前必须先理解它生成的目标——Selenium和Playwright。它们是当前Web UI自动化测试领域的两大主流框架但各有侧重。Selenium可以看作是这个领域的“老牌贵族”历史悠久生态成熟社区庞大。它的核心是WebDriver协议这是一个W3C标准意味着它支持几乎所有主流浏览器Chrome、Firefox、Safari、Edge等。它的优势在于稳定性和广泛的行业认可度无数企业的自动化测试体系都构建在Selenium之上。学习Selenium你几乎是在学习行业标准。然而它的缺点也源于其设计年代较早比如对现代Web应用单页应用SPA中复杂的异步加载处理起来比较笨拙需要编写大量的显式等待WebDriverWait原生API在某些场景下也显得不够简洁。Playwright则是近几年微软推出的“新锐力量”。它生来就是为了解决现代Web测试的痛点。其核心优势非常突出自动等待Playwright的大多数操作如clickfill内置了智能等待会自动等待元素可操作这省去了大量编写等待代码的精力。多浏览器支持它通过一个统一的API来操控Chromium、Firefox和WebKitSafari的引擎保证了跨浏览器行为的一致性。强大的网络拦截与模拟可以轻松模拟离线状态、不同的网络速度拦截和修改网络请求这对于测试特定场景至关重要。丰富的设备模拟内置了多种移动设备视口和User-Agent方便进行响应式测试。那么AI生成器为何同时支持两者这背后是策略性的考量。支持Selenium是为了兼容存量项目和团队既有的技术栈让那些已经投资了Selenium框架的团队能够平滑地引入AI辅助而不需要推翻重来。支持Playwright则是面向未来和追求极致效率的新项目因为Playwright的代码通常更简洁、更健壮AI生成这类代码的“成品率”和可读性往往更高。在实际的AI生成工具中你通常会看到一个下拉框让你在生成前就选择目标框架。2.2 AI生成脚本的核心工作原理AI并不是魔法它生成代码的过程可以理解为一个高度专业化的“翻译”过程。这个过程通常分为几个关键步骤第一步需求理解与结构化自然语言处理这是最核心的一步。当你输入“登录后搜索商品‘手机’并加入购物车”时AI模型如GPT-4、Claude 3或专门微调的代码模型需要做语义分析。它会识别出几个关键动作实体“登录”、“搜索”、“加入购物车”以及参数“手机”。同时它要理解这些动作之间的时序关系先登录才能搜索和逻辑关系搜索关键词是“手机”。一个优秀的生成器甚至会通过多轮对话来澄清模糊点比如“登录”是指用默认测试账号还是需要你提供账号密码第二步框架API映射与代码块组装在理解了结构化需求后AI会将其映射到目标框架Selenium或Playwright的具体API上。这需要模型在训练时“学习”了大量高质量的测试脚本范例。例如“打开浏览器” -driver webdriver.Chrome()(Selenium) 或browser p.chromium.launch(headlessFalse)(Playwright)“输入文本‘手机’” -search_box.send_keys(“手机”)(Selenium) 或search_box.fill(“手机”)(Playwright)“点击搜索按钮” -search_button.click()AI会根据最佳实践自动组装这些代码块并插入必要的导入语句、初始化代码和基础结构如if __name__ ‘__main__’:。第三步智能增强与健壮性处理这是区分普通代码补全和高级脚本生成的关键。一个成熟的AI生成器不会只产出“裸”的API调用它会自动注入提升脚本质量的元素智能等待在可能发生元素加载的地方自动添加显式等待Selenium或利用Playwright的自动等待特性。元素定位策略优先选择稳定、唯一的定位器如ID或>python --version # 或 python3 --version如果显示类似Python 3.10.11的版本信息说明安装成功。2. 安装Node.js (16)前往Node.js官网下载LTS长期支持版安装包。同样安装过程基本一路下一步即可。安装后验证node --version npm --version分别显示版本号即表示成功。Node.js自带了npm包管理工具后续会用到。3. 安装代码编辑器/IDE强烈推荐使用Visual Studio Code。它轻量、免费且对Python、JavaScript/TypeScript以及AI插件有极佳的支持。从官网下载安装即可。3.2 核心工具选择Cursor与Claude Desktop目前最直接体验AI生成代码的方式是使用集成了强大AI模型的IDE或客户端。这里我推荐两个方案方案一Cursor——为AI编程而生的编辑器Cursor可以看作是深度整合了AI背后是GPT-4等模型的VS Code。它最大的特点是可以通过快捷键CtrlK直接与AI对话让它编写、修改、解释代码上下文感知能力极强。下载安装访问Cursor官网下载对应系统的安装包。配置安装后你需要一个API Key来激活其AI功能。通常它支持OpenAI的API Key。你可以在OpenAI平台注册并获取。将Key填入Cursor的设置中即可。优势无缝集成在编辑器中可以直接针对当前文件或选中的代码进行对话和生成体验流畅。方案二Claude Desktop VS Code插件Anthropic推出的Claude Desktop应用提供了强大的Claude 3模型访问能力。同时在VS Code中安装“Claude”或“Continue”等插件可以将Claude的能力引入代码编辑器。安装Claude Desktop从官网下载安装。安装VS Code插件在VS Code扩展商店搜索“Claude”或“Continue”安装并配置通常需要关联你的Claude账户或API。优势Claude在代码生成和理解上表现非常出色特别是对复杂指令的遵循和代码安全性方面有独特优势。实操心得对于测试脚本生成这种特定任务我个人更倾向于使用Cursor。因为它对编程场景的优化更彻底“生成代码”的意图识别非常准确且生成的代码格式规整开箱即用。你可以两个都试试看哪个更符合你的操作习惯。3.3 目标框架环境配置为了让AI生成的脚本能够直接运行我们需要提前配置好Selenium或Playwright的本地测试环境。1. 配置Selenium环境打开命令行使用pip安装Selenium库pip install selenium接下来你需要下载浏览器驱动如ChromeDriver。这里有个关键点驱动版本必须与你本地安装的Chrome浏览器版本严格匹配。查看Chrome版本在浏览器地址栏输入chrome://version/查看“Google Chrome”后面的版本号例如120.0.6099.109。下载对应驱动访问ChromeDriver官网下载完全相同主版本号例如120.x.x.x的驱动。放置驱动将下载的chromedriver.exe文件放在一个目录下并将该目录添加到系统的PATH环境变量中。或者更简单的方法是在Python脚本中指定驱动路径from selenium import webdriver driver webdriver.Chrome(executable_pathr‘C:\path\to\your\chromedriver.exe’)2. 配置Playwright环境Playwright的环境配置要简单得多因为它自带浏览器内核。使用pip安装Playwright的Python包pip install playwright安装完成后运行以下命令来下载它需要的浏览器Chromium, Firefox, WebKitplaywright install这个命令会下载所需的浏览器二进制文件通常需要一些时间请耐心等待。完成后你的Playwright环境就准备好了无需单独管理驱动。注意事项playwright install默认从官方源下载在国内网络环境下可能速度很慢甚至失败。一个有效的解决办法是使用环境变量指定镜像源。在运行安装命令前先设置# Windows (CMD) set PLAYWRIGHT_DOWNLOAD_HOSThttps://npmmirror.com/mirrors/playwright playwright install chromium # Windows (PowerShell) $env:PLAYWRIGHT_DOWNLOAD_HOST“https://npmmirror.com/mirrors/playwright” playwright install chromium # macOS/Linux PLAYWRIGHT_DOWNLOAD_HOSThttps://npmmirror.com/mirrors/playwright playwright install chromium这样可以显著提升下载速度。4. 实战演练手把手生成你的第一个AI测试脚本环境就绪让我们进入最激动人心的环节让AI为我们写代码。我将以测试一个经典的“TODO MVC”应用为例分别演示如何生成Selenium和Playwright脚本。4.1 场景定义与Prompt工程首先我们需要清晰地告诉AI我们要做什么。这就是“Prompt工程”。模糊的指令得到模糊的代码清晰的指令得到可用的代码。一个糟糕的Prompt“帮我写个测试脚本。”一个良好的Prompt需要包含以下要素目标框架明确指定Selenium或Playwright。编程语言Python。被测应用提供具体的URL。测试步骤用清晰、有序的自然语言描述。额外要求比如是否需要无头模式、是否需要添加等待、是否需要错误处理。我们的测试场景测试一个在线的TODO列表应用。应用地址https://demo.playwright.dev/todomvc测试步骤打开Chrome浏览器访问上述网址。在输入框中添加三个待办事项“学习AI生成脚本”、“编写测试用例”、“执行自动化测试”。标记第一个事项“学习AI生成脚本”为已完成。筛选并只查看“活跃”未完成的待办事项。验证此时列表中只剩下两个未完成事项。清理所有待办事项。关闭浏览器。4.2 生成Selenium脚本打开Cursor或你的AI编程工具新建一个Python文件例如test_todo_selenium.py。然后在AI聊天框中输入以下Prompt请使用Python和Selenium WebDriver编写一个测试脚本实现以下功能 1. 打开Chrome浏览器访问 https://demo.playwright.dev/todomvc。 2. 在页面的待办事项输入框中依次添加三个事项“学习AI生成脚本”、“编写测试用例”、“执行自动化测试”。提示输入框的class可能包含‘new-todo’ 3. 找到第一个添加的事项文本是“学习AI生成脚本”点击它前面的复选框将其标记为完成。 4. 点击页面底部的“Active”按钮筛选出未完成的事项。 5. 断言assert此时页面中显示的待办事项数量是2。 6. 点击“Clear completed”按钮清理已完成的事项。 7. 最后关闭浏览器。 请使用显式等待WebDriverWait来确保元素加载完成并为关键操作添加必要的注释。将代码保存到一个完整的、可运行的Python文件中。几秒钟后AI可能会生成类似下面的代码我已对AI可能生成的代码进行了优化和格式整理使其更符合最佳实践from selenium import webdriver from selenium.webdriver.common.by import By from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC from selenium.common.exceptions import TimeoutException import time def test_todo_mvc(): # 1. 初始化浏览器驱动 driver webdriver.Chrome() # 确保chromedriver已在PATH中或指定executable_path driver.maximize_window() wait WebDriverWait(driver, 10) # 创建显式等待对象最多等10秒 try: # 2. 访问目标网址 driver.get(“https://demo.playwright.dev/todomvc”) print(“已打开TODO MVC应用页面”) # 定位待办事项输入框 todo_input wait.until( EC.presence_of_element_located((By.CLASS_NAME, “new-todo”)) ) # 3. 添加三个待办事项 todos [“学习AI生成脚本”, “编写测试用例”, “执行自动化测试”] for todo in todos: todo_input.clear() todo_input.send_keys(todo) todo_input.send_keys(Keys.RETURN) # 按回车键添加 time.sleep(0.5) # 短暂等待确保项目被添加到列表 print(“已添加三个待办事项”) # 4. 标记第一个事项为完成 # 寻找第一个待办事项的复选框。通常每个事项的复选框在一个包含‘toggle’类的元素里 first_todo_checkbox wait.until( EC.element_to_be_clickable((By.XPATH, “//ul[class‘todo-list’]/li[1]//input[class‘toggle’]”)) ) first_todo_checkbox.click() print(“已将第一个事项标记为完成”) # 5. 点击‘Active’筛选器 active_filter wait.until( EC.element_to_be_clickable((By.XPATH, “//a[contains(text(), ‘Active’)]”)) ) active_filter.click() print(“已切换到‘Active’视图”) # 给页面一点时间刷新 time.sleep(1) # 6. 断言未完成事项数量为2 # 在Active视图下所有显示的li都应该是未完成的 active_todo_items driver.find_elements(By.CSS_SELECTOR, “ul.todo-list li:not(.completed)”) actual_count len(active_todo_items) expected_count 2 assert actual_count expected_count, f“断言失败期望有{expected_count}个未完成事项实际找到{actual_count}个。” print(f“断言成功找到{actual_count}个未完成事项。”) # 7. 清理已完成的事项可选因为我们在Active视图可能看不到Clear completed按钮 # 先切换回‘All’视图 all_filter wait.until( EC.element_to_be_clickable((By.XPATH, “//a[contains(text(), ‘All’)]”)) ) all_filter.click() time.sleep(0.5) clear_completed_button wait.until( EC.element_to_be_clickable((By.CLASS_NAME, “clear-completed”)) ) clear_completed_button.click() print(“已清理已完成事项”) except TimeoutException as e: print(f“操作超时元素未找到或不可点击: {e}”) # 可以在这里截图方便调试 driver.save_screenshot(“timeout_error.png”) except Exception as e: print(f“测试执行过程中发生未知错误: {e}”) finally: # 8. 等待片刻后关闭浏览器 time.sleep(2) driver.quit() print(“浏览器已关闭”) if __name__ “__main__”: test_todo_mvc()代码解析与AI的“思考”AI自动导入了必要的Selenium模块。它创建了WebDriverWait对象来处理等待这是编写健壮Selenium脚本的关键。在定位元素时它混合使用了CLASS_NAME和XPATH。对于输入框使用类名是直接且稳定的。对于列表中的第一个复选框它构造了一个相对复杂的XPATH这通常是AI根据页面结构推断的在实际项目中可能需要根据实际HTML结构调整。它添加了基本的try-except错误处理捕获超时异常并打印信息这是一个很好的实践。在断言部分它使用了assert语句并给出了详细的错误信息。最后它确保了无论测试成功与否浏览器都会在finally块中被关闭避免了资源泄漏。4.3 生成Playwright脚本现在让我们看看用Playwright实现同样的功能AI会生成什么样的代码。新建一个文件test_todo_playwright.py输入Prompt请使用Python和Playwright编写一个测试脚本实现以下功能 1. 启动Chromium浏览器非无头模式访问 https://demo.playwright.dev/todomvc。 2. 在待办事项输入框中依次添加三个事项“学习AI生成脚本”、“编写测试用例”、“执行自动化测试”。 3. 将第一个事项“学习AI生成脚本”标记为完成。 4. 点击“Active”筛选器只查看未完成的事项。 5. 验证此时列表中只剩下两个待完成的事项。 6. 清理所有已完成的事项。 7. 关闭浏览器。 请使用Playwright的自动等待特性并确保代码结构清晰。使用同步API即可。AI生成的Playwright代码可能如下from playwright.sync_api import sync_playwright def test_todo_mvc_with_playwright(): # 使用 sync_playwright 上下文管理器自动管理Playwright生命周期 with sync_playwright() as p: # 1. 启动Chromium浏览器headlessFalse表示显示界面 browser p.chromium.launch(headlessFalse) # 创建新的浏览器上下文和页面 context browser.new_context() page context.new_page() try: # 2. 导航到目标页面 page.goto(“https://demo.playwright.dev/todomvc”) print(“页面加载完成。”) # 定位输入框 - Playwright的定位器非常强大 input_box page.locator(“.new-todo”) # 3. 添加三个待办事项 todo_items [“学习AI生成脚本”, “编写测试用例”, “执行自动化测试”] for item in todo_items: input_box.fill(item) input_box.press(“Enter”) print(“已添加三个待办事项。”) # 4. 标记第一个事项为完成 # 定位第一个待办事项的复选框并点击 first_todo_checkbox page.locator(“ul.todo-list li”).first.locator(“.toggle”) first_todo_checkbox.click() print(“已将第一个事项标记为完成。”) # 5. 点击‘Active’筛选器 active_filter page.locator(“a:has-text(‘Active’)”) active_filter.click() print(“已切换到‘Active’视图。”) # 6. 验证未完成事项数量为2 # 在Active视图下所有可见的li都是未完成的 visible_todos page.locator(“ul.todo-list li:not(.completed)”) count visible_todos.count() expected_count 2 # 使用assert进行断言Playwright推荐使用expect但这里用assert演示 assert count expected_count, f“期望有 {expected_count} 个未完成事项但实际有 {count} 个。” print(f“验证成功找到 {count} 个未完成事项。”) # 7. 清理已完成的事项需要先回到‘All’视图 all_filter page.locator(“a:has-text(‘All’)”) all_filter.click() # 等待一下确保‘Clear completed’按钮出现如果需要 page.wait_for_selector(“.clear-completed”, state“visible”) clear_button page.locator(“.clear-completed”) clear_button.click() print(“已清理已完成事项。”) except Exception as e: print(f“测试执行出错: {e}”) # 出错时可以截图 page.screenshot(path“playwright_error.png”) finally: # 8. 关闭浏览器 browser.close() print(“浏览器已关闭。”) if __name__ “__main__”: test_todo_mvc_with_playwright()Playwright代码亮点分析代码更简洁没有了显式的WebDriverWait和expected_conditions导入因为Playwright的locator和大多数操作click(),fill()本身就内置了智能等待。定位器更强大、更易读page.locator(“a:has-text(‘Active’)”)这种写法非常直观意思是“定位一个包含文本‘Active’的a标签”。first.locator()的链式调用也很清晰。同步API直观使用sync_playwright和同步API代码流程是线性的对于从Selenium转过来的开发者非常友好。自动等待page.goto()会等待页面加载事件locator.click()会等待元素可点击这大大减少了编写等待代码的心智负担。实操心得对比两份代码你可以直观感受到Playwright在代码简洁性和开发体验上的优势。AI在生成Playwright脚本时往往能产出更“干净”、更接近人类工程师手写风格的代码。对于新项目我个人会优先推荐使用Playwright作为AI生成的目标框架。5. 进阶技巧如何让AI生成更高质量的脚本生成能跑的代码只是第一步生成健壮、可维护、符合工程规范的代码才是目标。这需要我们在与AI交互时运用一些技巧。5.1 提供上下文与约束AI不知道你们项目的特定约定。如果你直接让它生成脚本它可能会用自己“认为”最好的方式但这可能不符合你的项目规范。技巧先给AI看样板代码。在对话中你可以先粘贴一段你们项目中已有的、风格良好的测试脚本例如使用了Page Object Model模式然后说“请参考下面这段代码的风格和结构为‘用户登录后修改个人信息’这个场景生成一个Playwright测试脚本。”技巧明确技术栈和版本。“请使用Playwright for Python的同步API版本兼容1.40以上。” “请使用Selenium 4并配合pytest框架来组织测试用例包含setup和teardown。”技巧指定元素定位策略。“我们项目约定优先使用>
AI自动生成Selenium/Playwright测试脚本：原理、实战与进阶技巧
1. 项目概述当AI开始写测试脚本如果你是一名测试工程师或者正在学习自动化测试那么下面这个场景你一定不陌生产品经理扔过来一个需求文档上面写着“用户登录后点击首页的‘我的订单’筛选出最近一个月的订单并导出为Excel”。然后你打开IDE开始思考用Selenium还是Playwright定位元素用ID、XPath还是CSS Selector等待策略用隐式等待还是显式等待接着你开始一行行地敲代码调试元素定位处理各种异步加载和弹窗一个简单的功能点可能就要耗费大半天。但现在情况正在发生变化。你只需要对着电脑说一句“帮我写一个测试脚本用Playwright打开Chrome浏览器访问我们的测试环境登录后进入订单页面筛选上个月的订单数据。”几秒钟后一段结构清晰、包含了必要等待和错误处理的Playwright Python代码就呈现在你面前。这不再是科幻电影里的情节而是“AI自动生成Selenium/Playwright脚本”技术正在带来的现实变革。简单来说这个项目的核心就是利用大语言模型LLM将人类用自然语言描述的测试需求直接转换为可执行的、高质量的Web自动化测试脚本。它瞄准的痛点非常明确降低自动化测试的编写门槛将测试工程师从重复、繁琐的代码编写中解放出来让他们能更专注于测试用例设计、业务逻辑验证和结果分析这些更具创造性的工作。无论是对于刚入门的新手还是追求效率的资深工程师这项技术都意味着工作流的重塑。新手不再需要死记硬背复杂的API和定位语法老手则可以将重复性的脚本编写工作交给AI自己进行审核和优化效率提升可能不止一倍。接下来我们就深入拆解看看这背后的技术是如何运作的以及在实际操作中我们该如何用好这把“利器”。2. 核心思路与技术选型解析2.1 为什么是Selenium和Playwright在讨论AI生成之前必须先理解它生成的目标——Selenium和Playwright。它们是当前Web UI自动化测试领域的两大主流框架但各有侧重。Selenium可以看作是这个领域的“老牌贵族”历史悠久生态成熟社区庞大。它的核心是WebDriver协议这是一个W3C标准意味着它支持几乎所有主流浏览器Chrome、Firefox、Safari、Edge等。它的优势在于稳定性和广泛的行业认可度无数企业的自动化测试体系都构建在Selenium之上。学习Selenium你几乎是在学习行业标准。然而它的缺点也源于其设计年代较早比如对现代Web应用单页应用SPA中复杂的异步加载处理起来比较笨拙需要编写大量的显式等待WebDriverWait原生API在某些场景下也显得不够简洁。Playwright则是近几年微软推出的“新锐力量”。它生来就是为了解决现代Web测试的痛点。其核心优势非常突出自动等待Playwright的大多数操作如clickfill内置了智能等待会自动等待元素可操作这省去了大量编写等待代码的精力。多浏览器支持它通过一个统一的API来操控Chromium、Firefox和WebKitSafari的引擎保证了跨浏览器行为的一致性。强大的网络拦截与模拟可以轻松模拟离线状态、不同的网络速度拦截和修改网络请求这对于测试特定场景至关重要。丰富的设备模拟内置了多种移动设备视口和User-Agent方便进行响应式测试。那么AI生成器为何同时支持两者这背后是策略性的考量。支持Selenium是为了兼容存量项目和团队既有的技术栈让那些已经投资了Selenium框架的团队能够平滑地引入AI辅助而不需要推翻重来。支持Playwright则是面向未来和追求极致效率的新项目因为Playwright的代码通常更简洁、更健壮AI生成这类代码的“成品率”和可读性往往更高。在实际的AI生成工具中你通常会看到一个下拉框让你在生成前就选择目标框架。2.2 AI生成脚本的核心工作原理AI并不是魔法它生成代码的过程可以理解为一个高度专业化的“翻译”过程。这个过程通常分为几个关键步骤第一步需求理解与结构化自然语言处理这是最核心的一步。当你输入“登录后搜索商品‘手机’并加入购物车”时AI模型如GPT-4、Claude 3或专门微调的代码模型需要做语义分析。它会识别出几个关键动作实体“登录”、“搜索”、“加入购物车”以及参数“手机”。同时它要理解这些动作之间的时序关系先登录才能搜索和逻辑关系搜索关键词是“手机”。一个优秀的生成器甚至会通过多轮对话来澄清模糊点比如“登录”是指用默认测试账号还是需要你提供账号密码第二步框架API映射与代码块组装在理解了结构化需求后AI会将其映射到目标框架Selenium或Playwright的具体API上。这需要模型在训练时“学习”了大量高质量的测试脚本范例。例如“打开浏览器” -driver webdriver.Chrome()(Selenium) 或browser p.chromium.launch(headlessFalse)(Playwright)“输入文本‘手机’” -search_box.send_keys(“手机”)(Selenium) 或search_box.fill(“手机”)(Playwright)“点击搜索按钮” -search_button.click()AI会根据最佳实践自动组装这些代码块并插入必要的导入语句、初始化代码和基础结构如if __name__ ‘__main__’:。第三步智能增强与健壮性处理这是区分普通代码补全和高级脚本生成的关键。一个成熟的AI生成器不会只产出“裸”的API调用它会自动注入提升脚本质量的元素智能等待在可能发生元素加载的地方自动添加显式等待Selenium或利用Playwright的自动等待特性。元素定位策略优先选择稳定、唯一的定位器如ID或>python --version # 或 python3 --version如果显示类似Python 3.10.11的版本信息说明安装成功。2. 安装Node.js (16)前往Node.js官网下载LTS长期支持版安装包。同样安装过程基本一路下一步即可。安装后验证node --version npm --version分别显示版本号即表示成功。Node.js自带了npm包管理工具后续会用到。3. 安装代码编辑器/IDE强烈推荐使用Visual Studio Code。它轻量、免费且对Python、JavaScript/TypeScript以及AI插件有极佳的支持。从官网下载安装即可。3.2 核心工具选择Cursor与Claude Desktop目前最直接体验AI生成代码的方式是使用集成了强大AI模型的IDE或客户端。这里我推荐两个方案方案一Cursor——为AI编程而生的编辑器Cursor可以看作是深度整合了AI背后是GPT-4等模型的VS Code。它最大的特点是可以通过快捷键CtrlK直接与AI对话让它编写、修改、解释代码上下文感知能力极强。下载安装访问Cursor官网下载对应系统的安装包。配置安装后你需要一个API Key来激活其AI功能。通常它支持OpenAI的API Key。你可以在OpenAI平台注册并获取。将Key填入Cursor的设置中即可。优势无缝集成在编辑器中可以直接针对当前文件或选中的代码进行对话和生成体验流畅。方案二Claude Desktop VS Code插件Anthropic推出的Claude Desktop应用提供了强大的Claude 3模型访问能力。同时在VS Code中安装“Claude”或“Continue”等插件可以将Claude的能力引入代码编辑器。安装Claude Desktop从官网下载安装。安装VS Code插件在VS Code扩展商店搜索“Claude”或“Continue”安装并配置通常需要关联你的Claude账户或API。优势Claude在代码生成和理解上表现非常出色特别是对复杂指令的遵循和代码安全性方面有独特优势。实操心得对于测试脚本生成这种特定任务我个人更倾向于使用Cursor。因为它对编程场景的优化更彻底“生成代码”的意图识别非常准确且生成的代码格式规整开箱即用。你可以两个都试试看哪个更符合你的操作习惯。3.3 目标框架环境配置为了让AI生成的脚本能够直接运行我们需要提前配置好Selenium或Playwright的本地测试环境。1. 配置Selenium环境打开命令行使用pip安装Selenium库pip install selenium接下来你需要下载浏览器驱动如ChromeDriver。这里有个关键点驱动版本必须与你本地安装的Chrome浏览器版本严格匹配。查看Chrome版本在浏览器地址栏输入chrome://version/查看“Google Chrome”后面的版本号例如120.0.6099.109。下载对应驱动访问ChromeDriver官网下载完全相同主版本号例如120.x.x.x的驱动。放置驱动将下载的chromedriver.exe文件放在一个目录下并将该目录添加到系统的PATH环境变量中。或者更简单的方法是在Python脚本中指定驱动路径from selenium import webdriver driver webdriver.Chrome(executable_pathr‘C:\path\to\your\chromedriver.exe’)2. 配置Playwright环境Playwright的环境配置要简单得多因为它自带浏览器内核。使用pip安装Playwright的Python包pip install playwright安装完成后运行以下命令来下载它需要的浏览器Chromium, Firefox, WebKitplaywright install这个命令会下载所需的浏览器二进制文件通常需要一些时间请耐心等待。完成后你的Playwright环境就准备好了无需单独管理驱动。注意事项playwright install默认从官方源下载在国内网络环境下可能速度很慢甚至失败。一个有效的解决办法是使用环境变量指定镜像源。在运行安装命令前先设置# Windows (CMD) set PLAYWRIGHT_DOWNLOAD_HOSThttps://npmmirror.com/mirrors/playwright playwright install chromium # Windows (PowerShell) $env:PLAYWRIGHT_DOWNLOAD_HOST“https://npmmirror.com/mirrors/playwright” playwright install chromium # macOS/Linux PLAYWRIGHT_DOWNLOAD_HOSThttps://npmmirror.com/mirrors/playwright playwright install chromium这样可以显著提升下载速度。4. 实战演练手把手生成你的第一个AI测试脚本环境就绪让我们进入最激动人心的环节让AI为我们写代码。我将以测试一个经典的“TODO MVC”应用为例分别演示如何生成Selenium和Playwright脚本。4.1 场景定义与Prompt工程首先我们需要清晰地告诉AI我们要做什么。这就是“Prompt工程”。模糊的指令得到模糊的代码清晰的指令得到可用的代码。一个糟糕的Prompt“帮我写个测试脚本。”一个良好的Prompt需要包含以下要素目标框架明确指定Selenium或Playwright。编程语言Python。被测应用提供具体的URL。测试步骤用清晰、有序的自然语言描述。额外要求比如是否需要无头模式、是否需要添加等待、是否需要错误处理。我们的测试场景测试一个在线的TODO列表应用。应用地址https://demo.playwright.dev/todomvc测试步骤打开Chrome浏览器访问上述网址。在输入框中添加三个待办事项“学习AI生成脚本”、“编写测试用例”、“执行自动化测试”。标记第一个事项“学习AI生成脚本”为已完成。筛选并只查看“活跃”未完成的待办事项。验证此时列表中只剩下两个未完成事项。清理所有待办事项。关闭浏览器。4.2 生成Selenium脚本打开Cursor或你的AI编程工具新建一个Python文件例如test_todo_selenium.py。然后在AI聊天框中输入以下Prompt请使用Python和Selenium WebDriver编写一个测试脚本实现以下功能 1. 打开Chrome浏览器访问 https://demo.playwright.dev/todomvc。 2. 在页面的待办事项输入框中依次添加三个事项“学习AI生成脚本”、“编写测试用例”、“执行自动化测试”。提示输入框的class可能包含‘new-todo’ 3. 找到第一个添加的事项文本是“学习AI生成脚本”点击它前面的复选框将其标记为完成。 4. 点击页面底部的“Active”按钮筛选出未完成的事项。 5. 断言assert此时页面中显示的待办事项数量是2。 6. 点击“Clear completed”按钮清理已完成的事项。 7. 最后关闭浏览器。 请使用显式等待WebDriverWait来确保元素加载完成并为关键操作添加必要的注释。将代码保存到一个完整的、可运行的Python文件中。几秒钟后AI可能会生成类似下面的代码我已对AI可能生成的代码进行了优化和格式整理使其更符合最佳实践from selenium import webdriver from selenium.webdriver.common.by import By from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC from selenium.common.exceptions import TimeoutException import time def test_todo_mvc(): # 1. 初始化浏览器驱动 driver webdriver.Chrome() # 确保chromedriver已在PATH中或指定executable_path driver.maximize_window() wait WebDriverWait(driver, 10) # 创建显式等待对象最多等10秒 try: # 2. 访问目标网址 driver.get(“https://demo.playwright.dev/todomvc”) print(“已打开TODO MVC应用页面”) # 定位待办事项输入框 todo_input wait.until( EC.presence_of_element_located((By.CLASS_NAME, “new-todo”)) ) # 3. 添加三个待办事项 todos [“学习AI生成脚本”, “编写测试用例”, “执行自动化测试”] for todo in todos: todo_input.clear() todo_input.send_keys(todo) todo_input.send_keys(Keys.RETURN) # 按回车键添加 time.sleep(0.5) # 短暂等待确保项目被添加到列表 print(“已添加三个待办事项”) # 4. 标记第一个事项为完成 # 寻找第一个待办事项的复选框。通常每个事项的复选框在一个包含‘toggle’类的元素里 first_todo_checkbox wait.until( EC.element_to_be_clickable((By.XPATH, “//ul[class‘todo-list’]/li[1]//input[class‘toggle’]”)) ) first_todo_checkbox.click() print(“已将第一个事项标记为完成”) # 5. 点击‘Active’筛选器 active_filter wait.until( EC.element_to_be_clickable((By.XPATH, “//a[contains(text(), ‘Active’)]”)) ) active_filter.click() print(“已切换到‘Active’视图”) # 给页面一点时间刷新 time.sleep(1) # 6. 断言未完成事项数量为2 # 在Active视图下所有显示的li都应该是未完成的 active_todo_items driver.find_elements(By.CSS_SELECTOR, “ul.todo-list li:not(.completed)”) actual_count len(active_todo_items) expected_count 2 assert actual_count expected_count, f“断言失败期望有{expected_count}个未完成事项实际找到{actual_count}个。” print(f“断言成功找到{actual_count}个未完成事项。”) # 7. 清理已完成的事项可选因为我们在Active视图可能看不到Clear completed按钮 # 先切换回‘All’视图 all_filter wait.until( EC.element_to_be_clickable((By.XPATH, “//a[contains(text(), ‘All’)]”)) ) all_filter.click() time.sleep(0.5) clear_completed_button wait.until( EC.element_to_be_clickable((By.CLASS_NAME, “clear-completed”)) ) clear_completed_button.click() print(“已清理已完成事项”) except TimeoutException as e: print(f“操作超时元素未找到或不可点击: {e}”) # 可以在这里截图方便调试 driver.save_screenshot(“timeout_error.png”) except Exception as e: print(f“测试执行过程中发生未知错误: {e}”) finally: # 8. 等待片刻后关闭浏览器 time.sleep(2) driver.quit() print(“浏览器已关闭”) if __name__ “__main__”: test_todo_mvc()代码解析与AI的“思考”AI自动导入了必要的Selenium模块。它创建了WebDriverWait对象来处理等待这是编写健壮Selenium脚本的关键。在定位元素时它混合使用了CLASS_NAME和XPATH。对于输入框使用类名是直接且稳定的。对于列表中的第一个复选框它构造了一个相对复杂的XPATH这通常是AI根据页面结构推断的在实际项目中可能需要根据实际HTML结构调整。它添加了基本的try-except错误处理捕获超时异常并打印信息这是一个很好的实践。在断言部分它使用了assert语句并给出了详细的错误信息。最后它确保了无论测试成功与否浏览器都会在finally块中被关闭避免了资源泄漏。4.3 生成Playwright脚本现在让我们看看用Playwright实现同样的功能AI会生成什么样的代码。新建一个文件test_todo_playwright.py输入Prompt请使用Python和Playwright编写一个测试脚本实现以下功能 1. 启动Chromium浏览器非无头模式访问 https://demo.playwright.dev/todomvc。 2. 在待办事项输入框中依次添加三个事项“学习AI生成脚本”、“编写测试用例”、“执行自动化测试”。 3. 将第一个事项“学习AI生成脚本”标记为完成。 4. 点击“Active”筛选器只查看未完成的事项。 5. 验证此时列表中只剩下两个待完成的事项。 6. 清理所有已完成的事项。 7. 关闭浏览器。 请使用Playwright的自动等待特性并确保代码结构清晰。使用同步API即可。AI生成的Playwright代码可能如下from playwright.sync_api import sync_playwright def test_todo_mvc_with_playwright(): # 使用 sync_playwright 上下文管理器自动管理Playwright生命周期 with sync_playwright() as p: # 1. 启动Chromium浏览器headlessFalse表示显示界面 browser p.chromium.launch(headlessFalse) # 创建新的浏览器上下文和页面 context browser.new_context() page context.new_page() try: # 2. 导航到目标页面 page.goto(“https://demo.playwright.dev/todomvc”) print(“页面加载完成。”) # 定位输入框 - Playwright的定位器非常强大 input_box page.locator(“.new-todo”) # 3. 添加三个待办事项 todo_items [“学习AI生成脚本”, “编写测试用例”, “执行自动化测试”] for item in todo_items: input_box.fill(item) input_box.press(“Enter”) print(“已添加三个待办事项。”) # 4. 标记第一个事项为完成 # 定位第一个待办事项的复选框并点击 first_todo_checkbox page.locator(“ul.todo-list li”).first.locator(“.toggle”) first_todo_checkbox.click() print(“已将第一个事项标记为完成。”) # 5. 点击‘Active’筛选器 active_filter page.locator(“a:has-text(‘Active’)”) active_filter.click() print(“已切换到‘Active’视图。”) # 6. 验证未完成事项数量为2 # 在Active视图下所有可见的li都是未完成的 visible_todos page.locator(“ul.todo-list li:not(.completed)”) count visible_todos.count() expected_count 2 # 使用assert进行断言Playwright推荐使用expect但这里用assert演示 assert count expected_count, f“期望有 {expected_count} 个未完成事项但实际有 {count} 个。” print(f“验证成功找到 {count} 个未完成事项。”) # 7. 清理已完成的事项需要先回到‘All’视图 all_filter page.locator(“a:has-text(‘All’)”) all_filter.click() # 等待一下确保‘Clear completed’按钮出现如果需要 page.wait_for_selector(“.clear-completed”, state“visible”) clear_button page.locator(“.clear-completed”) clear_button.click() print(“已清理已完成事项。”) except Exception as e: print(f“测试执行出错: {e}”) # 出错时可以截图 page.screenshot(path“playwright_error.png”) finally: # 8. 关闭浏览器 browser.close() print(“浏览器已关闭。”) if __name__ “__main__”: test_todo_mvc_with_playwright()Playwright代码亮点分析代码更简洁没有了显式的WebDriverWait和expected_conditions导入因为Playwright的locator和大多数操作click(),fill()本身就内置了智能等待。定位器更强大、更易读page.locator(“a:has-text(‘Active’)”)这种写法非常直观意思是“定位一个包含文本‘Active’的a标签”。first.locator()的链式调用也很清晰。同步API直观使用sync_playwright和同步API代码流程是线性的对于从Selenium转过来的开发者非常友好。自动等待page.goto()会等待页面加载事件locator.click()会等待元素可点击这大大减少了编写等待代码的心智负担。实操心得对比两份代码你可以直观感受到Playwright在代码简洁性和开发体验上的优势。AI在生成Playwright脚本时往往能产出更“干净”、更接近人类工程师手写风格的代码。对于新项目我个人会优先推荐使用Playwright作为AI生成的目标框架。5. 进阶技巧如何让AI生成更高质量的脚本生成能跑的代码只是第一步生成健壮、可维护、符合工程规范的代码才是目标。这需要我们在与AI交互时运用一些技巧。5.1 提供上下文与约束AI不知道你们项目的特定约定。如果你直接让它生成脚本它可能会用自己“认为”最好的方式但这可能不符合你的项目规范。技巧先给AI看样板代码。在对话中你可以先粘贴一段你们项目中已有的、风格良好的测试脚本例如使用了Page Object Model模式然后说“请参考下面这段代码的风格和结构为‘用户登录后修改个人信息’这个场景生成一个Playwright测试脚本。”技巧明确技术栈和版本。“请使用Playwright for Python的同步API版本兼容1.40以上。” “请使用Selenium 4并配合pytest框架来组织测试用例包含setup和teardown。”技巧指定元素定位策略。“我们项目约定优先使用>
