从录制到集成：手把手教你用Playwright + Robot Framework + Jenkins搭建UI自动化流水线-编程实验室

从录制到集成：手把手教你用Playwright + Robot Framework + Jenkins搭建UI自动化流水线

在数字化转型浪潮中，UI自动化测试已成为保障产品质量的关键环节。但许多团队常陷入"脚本开发容易，持续集成难"的困境——单个测试脚本或许能快速完成，但要构建稳定运行的自动化流水线却面临诸多挑战。本文将带你从零开始，用Playwright作为浏览器自动化引擎，Robot Framework作为测试框架，Jenkins作为持续集成平台，打造一套完整的UI自动化解决方案。

1. 环境准备与工具链搭建

1.1 版本兼容性矩阵

现代测试工具链的版本兼容性往往是第一个"拦路虎"。根据实际项目经验，推荐以下稳定组合：

工具	推荐版本	备注
Python	3.7.9	兼容Robot Framework RIDE的最佳选择
Playwright	1.9.0	新版本API变动较大，1.9.0稳定性最佳
Robot Framework	4.1.3	主流稳定版本
Robot Framework RIDE	2.0b1	仅支持Python 3.7及以下版本

安装时建议使用虚拟环境隔离依赖：

# 创建虚拟环境 python -m venv playwright_venv source playwright_venv/bin/activate # Linux/Mac playwright_venv\Scripts\activate # Windows # 安装指定版本 pip install playwright==1.9.0 playwright install chromium pip install robotframework==4.1.3 pip install robotframework-ride==2.0b1

提示：Windows系统若遇到DLL load failed错误，通常是Python环境问题，建议完全卸载后重新安装Python 3.7.9。

1.2 浏览器录制实战

Playwright的codegen功能可快速生成基础脚本：

# 基本录制命令 playwright codegen --target python -o search_test.py https://baidu.com # 处理HTTPS证书问题 playwright codegen --ignore-https-errors --target python -o secure_test.py https://example.com

录制生成的脚本需要二次优化才能用于生产环境。典型改进包括：

添加显式等待替代固定sleep
封装公共操作（登录/登出）
加入异常处理和日志记录

2. Robot Framework集成策略

2.1 自定义Library开发

将Playwright脚本封装为Robot Framework关键字是架构设计的关键。创建PlaywrightLibrary.py：

from robot.api.deco import keyword from playwright.sync_api import sync_playwright class PlaywrightLibrary: def __init__(self): self.playwright = sync_playwright().start() self.browser = None self.page = None @keyword def open_browser(self, url, browser="chromium"): self.browser = self.playwright[browser].launch(headless=False) self.page = self.browser.new_page() self.page.goto(url) @keyword def click_element(self, selector): self.page.click(selector) @keyword def close_browser(self): self.browser.close() self.playwright.stop()

在Robot测试套件中引用：

*** Settings *** Library PlaywrightLibrary *** Test Cases *** 百度搜索测试 Open Browser https://www.baidu.com Click Element input[name="wd"] Input Text input[name="wd"] Robot Framework Click Element text=百度一下 Close Browser

2.2 元素定位最佳实践

Playwright支持多种定位策略，在Robot中可封装为独立关键字：

定位方式	示例	适用场景
Text定位	`text=登录`	按钮/链接文本明确时
CSS选择器	`input#username`	有固定ID/Class的元素
XPath	`//button[@aria-label='搜索']`	复杂层级结构
组合定位	`button:has-text("提交")`	需要多重条件确认时

*** Keywords *** 输入搜索关键词 [Arguments] ${keyword} Fill Text input[name="wd"] ${keyword} 点击搜索按钮 Click text=百度一下

3. Jenkins持续集成方案

3.1 流水线配置要点

创建Jenkinsfile定义完整构建流程：

pipeline { agent any environment { PLAYWRIGHT_BROWSERS_PATH = "${env.WORKSPACE}/ms-playwright" } stages { stage('Setup') { steps { bat ''' python -m venv venv call venv\\Scripts\\activate pip install -r requirements.txt playwright install ''' } } stage('Test') { steps { bat ''' call venv\\Scripts\\activate robot --outputdir reports tests/ ''' } } stage('Report') { steps { robotPublisher( outputPath: 'reports', outputFileName: 'output.xml', reportFileName: 'report.html', logFileName: 'log.html', disableArchiveOutput: false ) } } } }

3.2 常见问题解决方案

问题1：ms-playwright路径错误

Error: browser.launch: Failed to launch chromium because executable doesn't exist at...

解决方案：

在Jenkins系统配置中添加环境变量：

PLAYWRIGHT_BROWSERS_PATH=/path/to/shared/ms-playwright

或直接在构建节点上执行：

playwright install --path /shared/ms-playwright

问题2：邮件通知失败

Not sending mail to unregistered user...

修复步骤：

进入Jenkins → 系统配置 → 邮件通知
设置SMTP服务器和认证信息

在Extended E-mail Notification中配置：

Default Recipients: team@example.com Reply-To List: no-reply@example.com

4. 高级技巧与性能优化

4.1 并行测试执行

利用Playwright的BrowserContext实现并行：

def run_test(context): page = context.new_page() # 测试逻辑... with sync_playwright() as p: browser = p.chromium.launch() context1 = browser.new_context() context2 = browser.new_context() # 并行执行 thread1 = threading.Thread(target=run_test, args=(context1,)) thread2 = threading.Thread(target=run_test, args=(context2,)) thread1.start() thread2.start()

在Robot中可通过pabot实现套件级并行：

pabot --processes 4 tests/

4.2 智能等待策略

避免使用固定等待，推荐组合策略：

自动等待：Playwright内置的page.click()已包含等待

显式等待：

page.wait_for_selector("#loading", state="hidden")

自定义等待：

Wait Until Keyword Succeeds 3x 1s Click Element button:has-text("提交")

### 4.3 视频与追踪配置 在`playwright.config.js`中启用高级记录： ```javascript module.exports = { use: { headless: false, viewport: { width: 1280, height: 720 }, video: 'on-first-retry', trace: 'retain-on-failure', }, };

分析追踪文件：