1、Playwright初探：什么是Playwright？它和Selenium、Puppeteer比有什么优势？如何安装Playwright？

大家好，我是老张。今天咱们来聊聊Playwright。

说实话，我第一次接触Playwright是在2020年。那时候我正被Selenium的稳定性问题折磨得够呛——测试跑着跑着就超时，元素定位时不时抽风。后来一个同事甩给我一句：「试试Playwright吧，微软出的。」

嗯，这一试，就回不去了。

1.1 什么是Playwright？

Playwright是微软开源的一个浏览器自动化框架。它支持Chromium、Firefox和WebKit三大浏览器引擎。说白了，就是你能用一套API，同时操控Chrome、Edge、Firefox、Safari这些浏览器。

它的核心能力很简单：模拟用户操作。点击、输入、滚动、截图、爬数据、做测试……你能想到的浏览器操作，它基本都能干。

我个人习惯把它看作「浏览器里的机器人」。你写一段脚本，它就能自动帮你完成各种重复操作。

1.2 它和Selenium、Puppeteer比有什么优势？

这个问题我经常被问到。咱们直接上对比表，一目了然。

对比维度	Playwright	Selenium	Puppeteer
浏览器支持	Chromium + Firefox + WebKit	所有主流浏览器	仅Chromium
自动等待	内置，智能等待	需手动配置	部分支持
网络拦截	原生支持，API简洁	需借助第三方库	原生支持
移动端模拟	内置设备模拟器	需额外配置	部分支持
安装复杂度	一条命令搞定	需下载驱动	需单独安装
速度	快（原生协议）	中等（WebDriver协议）	快（DevTools协议）

我来展开说说几个关键点。

1.2.1 自动等待——省心省力

用过Selenium的朋友都知道，最烦的就是元素还没加载出来，代码就跑去点击了。然后你不得不写一堆WebDriverWait，代码又臭又长。

Playwright不一样。它内置了自动等待机制。你调用click()，它会等元素可见、可用、不遮挡，然后再点。我在项目中遇到过无数次——同样的测试用例，Selenium跑着跑着就挂了，Playwright一次过。

1.2.2 网络拦截——调试利器

Playwright可以轻松拦截网络请求。比如你想看看页面加载了哪些API，或者想模拟某个接口返回错误——几行代码搞定。

// 拦截所有图片请求，让它们不加载
await page.route('**/*.png', route => route.abort());

// 模拟接口返回
await page.route('**/api/user', route => {
  route.fulfill({
    status: 200,
    body: JSON.stringify({name: '测试用户'})
  });
});

这个功能在Selenium里实现起来相当麻烦，得用BrowserMob之类的代理工具。Playwright直接内置了，你说香不香？

1.2.3 移动端模拟——真机级

Playwright内置了iPhone、Pixel等设备的模拟参数。你只需要指定设备名称，它就会自动设置viewport、user-agent、触摸事件等。

const { chromium, devices } = require('playwright');
const iPhone = devices['iPhone 12 Pro'];

const browser = await chromium.launch();
const context = await browser.newContext({ ...iPhone });
const page = await context.newPage();

你想想看，以前测移动端适配，要么开真机，要么用Chrome DevTools模拟。现在一行代码就能搞定，效率提升不是一星半点。

1.3 如何安装Playwright？

安装过程简单到离谱。咱们以Node.js为例。

1.3.1 前提条件

确保你已经安装了Node.js（版本12以上）。我个人推荐用LTS版本，稳定。

1.3.2 安装步骤

第一步，创建项目并安装Playwright：

mkdir my-playwright-project
cd my-playwright-project
npm init -y
npm install playwright

第二步，安装浏览器：

npx playwright install

这条命令会自动下载Chromium、Firefox和WebKit的浏览器二进制文件。大概几百兆，取决于你的网速。

1.3.3 验证安装

写个简单的脚本试试：

const { chromium } = require('playwright');

(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage();
  await page.goto('https://example.com');
  console.log(await page.title());
  await browser.close();
})();

运行node test.js，如果打印出Example Domain，恭喜你，安装成功了。

1.3.4 其他语言安装

Python用户看这里：

pip install playwright
playwright install

Java用户：

// 在pom.xml中添加依赖
<dependency>
  <groupId>com.microsoft.playwright</groupId>
  <artifactId>playwright</artifactId>
  <version>1.40.0</version>
</dependency>

嗯，就这么简单。没有复杂的驱动配置，没有环境变量设置。一条命令，搞定所有。

1.4 我的个人建议

如果你正在选型浏览器自动化工具，我的建议是：

• 新项目：直接上Playwright。省心、高效、社区活跃。
• 老项目迁移：如果项目不大，值得迁移。我去年把一个Selenium项目迁到Playwright，测试稳定性从70%提到了95%。
• 只需要Chrome：Puppeteer也可以，但Playwright的API设计更友好。

我曾经踩过一个坑——用Selenium跑一个复杂的表单填写流程，每次跑到第5步就超时。调试了两天，最后发现是某个下拉菜单的加载时机不对。换成Playwright后，自动等待机制直接解决了这个问题。嗯，从那以后，我对Playwright就彻底服气了。

好了，这一章就到这里。下一章咱们会写第一个Playwright脚本，真正上手操作。到时候你会觉得——原来浏览器自动化可以这么简单。