保姆级教程：从零用Playwright+Pytest写一个带截图和Allure报告的百度搜索测试

零基础玩转PlaywrightPytest手把手打造带截图的Allure测试报告第一次接触UI自动化测试时我盯着满屏的Selenium报错信息发呆。直到发现Playwright这个神器——它像一位耐心的老师用清晰的错误提示和直观的API带我走出了新手村。今天我们就用最接地气的方式从百度搜索这个经典案例开始体验现代测试工具链的丝滑流畅。1. 环境准备五分钟搞定测试装备工欲善其事必先利其器。打开终端让我们用pip这条魔法咒语召唤测试界的四大护法pip install playwright pytest pyyaml allure-pytest python -m playwright install chromium小贴士如果遇到网络问题可以尝试添加--index-url https://pypi.tuna.tsinghua.edu.cn/simple使用国内镜像源验证安装是否成功import playwright print(playwright.__version__) # 应该输出类似1.40.0的版本号注意Allure需要额外安装命令行工具推荐从 官方GitHub仓库 下载最新版本解压后将bin目录加入系统PATH2. 第一个测试脚本让浏览器自动搜索在项目根目录创建test_baidu.py我们来编写一个会自己操作浏览器的机器人import allure from playwright.sync_api import Page def test_baidu_search(page: Page): 测试百度搜索功能 # 访问百度首页 page.goto(https://www.baidu.com) # 定位搜索框并输入关键词 search_box page.locator(#kw) search_box.click() search_box.fill(Playwright自动化测试) # 点击搜索按钮 search_button page.get_by_role(button, name百度一下) search_button.click() # 验证搜索结果 assert playwright.dev in page.title() # 保存截图 page.screenshot(pathsearch_result.png) allure.attach.file(search_result.png, name搜索结果, attachment_typeallure.attachment_type.PNG)运行测试的命令很简单pytest test_baidu.py --alluredir./report allure serve ./report3. 进阶技巧用YAML管理测试数据当测试用例增多时硬编码的数据会成为维护噩梦。我们用YAML来解耦创建data/search_keywords.yamltest_cases: - name: 搜索Python教程 url: https://www.baidu.com keyword: Python入门教程 expected: 菜鸟教程 - name: 搜索自动化测试 url: https://www.baidu.com keyword: UI自动化测试 expected: Playwright修改测试脚本读取YAML数据import yaml import pytest def load_test_data(): with open(data/search_keywords.yaml) as f: return yaml.safe_load(f) pytest.mark.parametrize(case, load_test_data()[test_cases]) def test_baidu_search(page: Page, case): page.goto(case[url]) page.locator(#kw).fill(case[keyword]) page.get_by_role(button, name百度一下).click() assert case[expected] in page.title()4. 打造专业测试报告Allure的魔法Allure能把枯燥的测试结果变成视觉盛宴。我们在conftest.py中添加这些钩子函数import allure import pytest from datetime import datetime pytest.hookimpl(hookwrapperTrue) def pytest_runtest_makereport(item, call): outcome yield report outcome.get_result() if report.when call: # 添加环境信息 allure.dynamic.title(item.function.__doc__ or item.name) allure.dynamic.description( f测试时间: {datetime.now().strftime(%Y-%m-%d %H:%M:%S)}\n f运行时长: {round(report.duration, 3)}秒 ) # 自动附加页面截图 if page in item.funcargs: page item.funcargs[page] screenshot page.screenshot() allure.attach(screenshot, name页面截图, attachment_typeallure.attachment_type.PNG)这样生成的报告会包含美观的时间线图表丰富的环境信息自动截取的页面快照清晰的测试步骤树5. 常见问题排雷指南在实际教学中我发现新手常会遇到这些坑浏览器无法启动确保执行过playwright install chromium检查防火墙是否阻止了浏览器进程尝试添加--headed参数可视化运行pytest --headed test_baidu.py元素定位失败Playwright提供了多种定位策略定位方式示例适用场景CSS选择器page.locator(#kw)常规元素文本定位page.get_by_text(登录)按钮/链接文本角色定位page.get_by_role(button)标准HTML角色XPathpage.locator(//input[namewd])复杂层级结构测试不稳定添加等待策略代替硬性sleeppage.locator(#kw).click(timeout5000) # 显式等待5秒 page.wait_for_selector(.result, statevisible) # 等待结果出现启用重试机制pytest --reruns 3 --reruns-delay 1 # 失败时自动重试3次6. 项目结构最佳实践成熟的测试项目应该像乐高积木一样模块化baidu_test/ ├── conftest.py # 共享fixture和钩子 ├── data/ │ └── search_keywords.yaml ├── pages/ # 页面对象模型 │ └── baidu_page.py ├── tests/ │ └── test_search.py ├── utils/ # 工具函数 │ ├── allure_util.py │ └── screenshot.py └── reports/ # 自动生成其中baidu_page.py封装页面操作class BaiduPage: def __init__(self, page): self.page page self.search_box page.locator(#kw) self.search_button page.get_by_role(button, name百度一下) def navigate(self): self.page.goto(https://www.baidu.com) def search(self, keyword): self.search_box.fill(keyword) self.search_button.click()这样测试用例就变得极其简洁def test_search(baidu_page): baidu_page.navigate() baidu_page.search(Playwright) assert Playwright in baidu_page.page.title()7. 调试技巧让问题无所遁形Playwright自带的调试工具是排查问题的利器录制功能playwright codegen https://www.baidu.com会启动一个浏览器窗口你的所有操作都会自动生成对应的Python代码追踪查看# 在测试开始时启动追踪 context browser.new_context() context.tracing.start(screenshotsTrue, snapshotsTrue) # 测试结束后保存追踪文件 context.tracing.stop(pathtrace.zip)用Playwright Inspector查看追踪文件playwright show-trace trace.zip这个可视化工具能让你逐帧回放测试过程查看每个步骤的DOM快照检查网络请求和响应分析执行时间线8. 持续集成让测试自动运行最后我们让这套测试能在GitHub Actions上每天自动执行创建.github/workflows/test.ymlname: UI Automation Test on: schedule: - cron: 0 0 * * * # 每天UTC时间0点运行 push: branches: [ main ] jobs: test: runs-on: ubuntu-latest steps: - uses: actions/checkoutv3 - name: Set up Python uses: actions/setup-pythonv4 with: python-version: 3.10 - name: Install dependencies run: | python -m pip install --upgrade pip pip install -r requirements.txt python -m playwright install python -m playwright install-deps - name: Run tests run: | pytest --alluredir./report - name: Upload Allure report uses: actions/upload-artifactv3 with: name: allure-report path: ./report在本地开发时我习惯用这个alias快速验证改动alias runtestpytest -xvs allure serve report