个人开发者 | Playwright工程化实践 | 团队效率翻倍

▌ 技术引导

我见过太多个人开发者在自动化测试和爬虫领域挣扎，Playwright确实能帮你省不少力。但真正让效率翻倍的，不是Playwright本身，而是对它进行工程化实践的细节处理。比如，用配置文件统一管理浏览器选项、页面标签、执行路径，这样每次跑任务都无需手动敲命令。我在实际项目中用到了launch配置 + config文件 + 启动脚本的三段式方案，把测试任务分成了低耦合模块，不只是跑脚本那么简单。再比如，利用Playwright的headless模式和record功能，既能保证运行速度又能保留视频日志，方便复盘。这玩意儿不是装个库就能完成的，得把整个流程自动化、标准化，而且要结合CI/CD一起用，不然还是单机思考。我见过有人直连Git仓库，用playwright test触发脚本，结果跑着跑着代码越改越多，反而更乱。所以得把脚本和配置分离开，再配合环境变量控制运行模式。这些才是真正的血泪经验。

▌ 技术参考

Playwright是现代浏览器自动化工具，它支持多浏览器、多设备同步执行，而且能自动处理CAPTCHA和验证码，这种能力对个人开发者来说简直是梦中情梦。我之前用它处理一个电商抓取任务，屏幕翻转、缩放、滑动都能自动完成，不用再自己写坐标转换逻辑。它内置了wait_for_selector、click、fill等方法，比Selenium更贴近真实操作，而且能识别动态内容。配置文件我用的是YAML格式，里面设定了user-agent、device-viewport、timezone这些参数，还设置了自动录制的路径，这样所有任务都能有视频回放。

在工程化实践中，我倾向于把所有测试脚本放在一个项目目录下，用playwright test命令启动，所有测试用例都通过配置文件注入环境变量。比如在config.js中定义process.env.ENV='dev'或'prod'，然后在playwright配置文件中根据这个变量切换执行策略。另外，我还会用dotenv加载本地.env文件，这样不同环境的参数可以统一管理。这种模式避免了手动切换浏览器选项，也不用担心配置混乱。我见过有人直接把配置写在代码里，结果每次修改都要重新编译，根本没法快速迭代。

Playwright的分布式执行能力是它的一大亮点，但很多人用错了。我之前用playwright run命令配合docker启动多个实例，结果发现同一个任务被多个浏览器重复执行，任务队列反而乱了。后来改成用playwright test --config=dist.config.js，然后在config里设置workers参数，这样就能让多个浏览器实例并行跑任务，效率提升明显。同时，我也会用record功能把每次运行的视频保存下来，便于后续排查问题。视频存储路径是通过record.output设置的，配置项里还得加上录制的浏览器类型和设备选项，否则容易出错。

在调试阶段，我习惯用playwright show-trace命令回放任务，它会生成一个trace文件，里面详细记录了每个操作的时间线和状态。这个文件可以用vscode的debugger直接打开，还能看到每个点击和输入的细节。另外，我会通过addEventListener监听页面加载事件，这样就能在任务出错时快速定位问题点。这些调试手段比单纯的console.log更直观，也更高效。我之前有个项目因为定位不准导致抓取失败，用trace文件才发现是某个动态加载的元素没识别到。

Playwright的异步等待机制很关键，比如wait_for_selector和wait_for_function，它们能自动处理DOM更新，不用再自己加sleep或等待时间。我之前用过wait_for_timeout，结果任务经常卡在某个界面，后来改成用wait_for_selector配合特定选择器，效率直接翻了一倍。在实际使用中，推荐用playwright的retry功能，特别是对不稳定网络环境下的任务，这样失败了能自动重试，不用反复手动执行。我的项目里用的是playwright retry=3，这样即使遇到临时网络抖动也能继续执行。

在性能优化方面，我主要从两个维度入手。一是减少不必要的页面加载，用playwright的page.goto方法时，最好加上wait_for_selector参数，让页面等元素加载完成后再继续。这样能避免因为页面未加载而执行失败，而且能提升整体执行速度。二是合理设置浏览器选项，比如用headless模式能节省资源，但某些任务可能需要开启record来记录操作，这时候就得权衡性能和调试需求。我在一个爬虫项目里用了headless + record，结果发现录制视频会占用额外内存，后来改成只在测试环境开启录制。

Playwright的断言功能也很实用，我习惯用expect(page).toHaveTextContaining来检查页面内容是否包含特定信息，这样比传统的assert更自然。在实际使用中，我还会用expect(page).toHaveTitle配合正则表达式，让标题匹配更灵活。另外，我用过checker函数来验证抓取内容是否符合预期，比如用page.locator获取数据后，再通过检查器函数确认格式是否正确。这种组合方式在数据校验阶段非常有用，能快速识别出异常情况。

团队协作时，我更倾向于用playwright的test suite功能来分类任务，比如把电商抓取和内容采集分成不同的suite，这样就能通过suite参数控制执行范围。在CI/CD环境中，我会用playwright test --config=ci.config.js，里面设定了只运行指定的suite，避免不必要的任务。另外，用playwright的reporter参数来生成HTML报告，这样队友就能在浏览器里直接查看结果。我在一个项目里用的是list reporter，因为它能按时间顺序展示所有测试用例的执行状态，比文本报告更清晰。

Playwright的test runner支持并行执行，我用过playwright test --parallel=4来同时运行四个任务，这样就能充分利用多核CPU。但要注意，并行执行可能会导致浏览器实例冲突，特别是某些需要登录态的任务。我解决这个问题的方式是为每个任务分配独立的上下文，用playwright.newContext来创建多个浏览器环境，这样不同任务之间就不会互相干扰。在配置文件里，我设定了parallel和workers参数，确保任务不会同时跑在同一个浏览器里。

在实际部署中，我遇到过一个问题，就是同一个任务在不同机器上执行时表现不一致。后来发现是环境变量没有统一管理，导致某些参数在不同机器上有差异。解决方法是用dotenv加载.env文件，并在playwright config中用process.env读取参数。比如在配置里设置baseURL: process.env.BASE_URL，这样就能保证不同机器使用相同的执行环境。此外，我还会用playwright的baseURL参数来统一接口地址，避免硬编码带来的麻烦。

Playwright的录制功能确实强大，但不是所有任务都适合开启。我之前在一个数据采集项目中开启record，结果发现录制的视频文件太大，占用了大量存储空间。后来改用playwright的record功能配合压缩参数，比如设置record.outputCompression为true，这样视频文件就能自动压缩，节省磁盘空间。同时，我也学会了用record.exclude来过滤不需要录制的页面，比如登录页和配置页就不需要录制，只保留核心执行流程。这样既能保留关键信息，又不会浪费资源。

在使用Playwright时，我遇到过一个棘手的问题，就是某些页面加载太慢，导致测试用例一直卡住。后来发现是因为没有正确设置超时时间，导致任务卡在某个步骤。解决方法是用page.setDefaultTimeout方法，把默认超时时间从30秒调到60秒，这样就能给页面更多加载时间。但要注意，不要盲目调高超时时间，否则会影响整体执行效率。我通常会先用playwright的debugger功能查看加载过程，再根据实际耗时调整参数。

对于需要登录的爬虫任务，我用Playwright的context功能来管理会话信息。比如在初始化时用playwright.newContext创建新的浏览器环境，然后通过context.addCookies方法添加登录后的Cookie信息。这样就能避免每次任务都需要重复登录，节省了大量时间。我之前在一个电商项目中用的是这种方式，结果发现某些Cookie失效，导致任务失败。后来改成用context.setUserAgent配合登录后的Token，这样就能更稳定地维持会话状态。

在分布式执行时，我遇到过一个bug，就是某些任务在不同机器上执行顺序混乱。后来发现是playwright的test runner没有正确使用worker分配，导致任务在同一个worker上重复执行。解决方法是用playwright的workers参数控制并发数，比如设置workers=4，这样就能确保每个任务都有独立的worker处理。同时，我还会在CI环境中使用playwright test --workers=auto，这样就能根据机器资源自动调整并发数，避免资源浪费。

Playwright的录制功能虽然好用，但生成的视频文件有时会太大。我之前处理一个数据抓取项目，每天生成的视频文件占用几十GB存储空间。后来通过record.outputCompression参数设置为true，再配合record.outputFormat为webm，这样就能有效减小文件体积。同时，我也学会了用record.exclude来排除不需要录制的页面，比如登录页和配置页，只保留核心执行流程。这样既能保留关键信息，又不会占用过多存储空间。