当前位置： 首页 > news >正文

Playwright自动化测试：从零安装到实战脚本的完整指南

news 2026/6/30 18:24:40

1. 项目概述：为什么是Playwright？

如果你最近在搞Web自动化测试或者网页数据抓取，还在用Selenium或者Puppeteer，那今天这个内容可能会让你换个思路。我最近把团队里几个老项目的自动化框架从Selenium迁移到了Playwright，踩了不少坑，也收获了不少惊喜。简单来说，Playwright是一个由微软开源的现代化浏览器自动化库，它支持Chromium、Firefox和WebKit三大浏览器引擎，并且为它们提供了统一、强大且可靠的API。

你可能听过Selenium，它历史悠久，生态庞大，但稳定性问题、复杂的驱动管理和跨浏览器测试的“玄学”报错，常常让人头疼。Puppeteer则专注于Chrome，速度快，API现代，但跨浏览器支持是短板。Playwright的出现，像是吸取了两者的优点：它拥有Puppeteer般的现代API和性能，又提供了Selenium梦寐以求的真正可靠的跨浏览器支持。更重要的是，它在设计之初就考虑到了现代Web应用的特点——单页应用（SPA）、动态加载、Shadow DOM、网络拦截等，处理起来得心应手。

对于前端开发者、测试工程师、甚至是需要做大规模网页数据处理的同学，Playwright都是一个值得投入时间学习的工具。它能帮你做自动化测试、生成网页截图或PDF、爬取动态渲染的数据，甚至模拟复杂的用户交互流程。接下来，我会带你从零开始，搞定Playwright的安装，并深入聊聊那些官方文档里不会细说的“坑”和技巧。

2. 核心需求解析：我们到底需要安装什么？

在动手敲命令之前，我们先得搞清楚，安装Playwright这个动作，到底包含了哪些组件。很多人第一次安装时，看到命令行里开始下载几百兆的浏览器，会感到困惑甚至恐慌。别急，我们拆开来看。

2.1 Playwright的核心构成

Playwright的安装包主要包含两部分：

  1. Playwright库本身：这是核心的Node.js包（或者Python包、.NET包等，取决于你使用的语言绑定）。它提供了我们编写脚本时调用的所有API，比如page.goto(),page.click(),page.waitForSelector()等。这个部分很小，通常几兆就搞定了。

  2. 浏览器二进制文件：这是真正的大头。Playwright为了确保测试的稳定性和可重复性，不依赖你系统上安装的Chrome或Firefox。相反，它会下载自己管理的、经过特定版本匹配和优化的浏览器版本。这包括：

    • chromium： Chrome的开源核心版本。
    • firefox： Mozilla Firefox。
    • webkit： Safari浏览器背后的引擎。

当你执行playwright install或类似命令时，它就会去下载这些浏览器。每个浏览器大约在150MB到300MB之间，所以三个都下完，磁盘空间占用可能在700MB到1GB左右。这是Playwright实现“开箱即用”和“一致性”的代价，但在我看来，这个代价非常值得。

2.2 不同场景下的安装策略

根据你的使用场景，安装策略可以灵活调整：

  • 只想试试水：可以先只安装Playwright库，然后在代码中指定使用已安装的、系统自带的Chrome（通过channel参数）。但这种方式不推荐用于正式项目，因为环境不一致可能导致诡异的问题。
  • 主要做Chrome自动化：这是最常见的情况。你可以只安装Chromium，节省下载时间和磁盘空间。在90%的场景下，Chromium已经足够。
  • 必须做跨浏览器兼容性测试：那就需要安装全部三个浏览器。通常会在CI/CD（持续集成/持续部署）环境中这样配置，确保每次构建都能在完全一致的环境下运行所有浏览器的测试套件。

理解了这个构成，我们再去看那些安装命令，就不会觉得它是在“瞎搞”了。它是在为你搭建一个坚固、可靠的自动化地基。

3. 环境准备与工具选型

工欲善其事，必先利其器。在安装Playwright之前，我们需要确保基础环境是OK的。这里我以最流行的Node.js/Python两种环境为例，.NET（C#）的流程也类似。

3.1 Node.js 环境准备

如果你主要使用JavaScript/TypeScript，那么Node.js是必须的。

  1. 检查Node.js版本：打开终端（命令行），输入node -v。Playwright要求Node.js版本在14以上，但我强烈建议使用最新的LTS（长期支持）版本，比如18.x或20.x。新版本在性能和稳定性上通常更好。如果你的版本太旧，去Node.js官网下载安装包覆盖安装即可。

  2. 包管理器的选择：npm是Node.js自带的，但速度可能较慢。yarn或pnpm是更快的替代品。我个人目前更倾向于pnpm，因为它采用硬链接，节省磁盘空间，安装速度也快。你可以根据团队习惯选择。确保你的包管理器能正常访问网络（特别是能访问npm官方仓库或你配置的镜像源）。

  3. 项目初始化：建议为你的Playwright项目创建一个独立的目录。进入目录后，运行npm init -y或pnpm init来生成一个package.json文件，这有助于管理依赖。

3.2 Python 环境准备

Python生态下，Playwright同样强大，特别受测试工程师和数据分析师的喜爱。

  1. 检查Python版本：终端输入python --version或python3 --version。Playwright for Python 要求 Python 3.7+。同样，建议使用3.8或3.10等稳定版本。

  2. 使用虚拟环境（强烈推荐）：这是Python开发的最佳实践，可以避免不同项目间的依赖冲突。常用的工具有venv（Python内置）或conda。

    • 使用venv:
      # 在当前目录创建名为 `venv` 的虚拟环境 python3 -m venv venv # 激活虚拟环境 (Linux/macOS) source venv/bin/activate # 激活虚拟环境 (Windows) venv\Scripts\activate

    激活后，你的命令行提示符前通常会显示(venv)，表示你正在虚拟环境中操作。

  3. 包管理工具：使用pip进行安装。可以考虑使用pip install -U pip先升级pip到最新版。

3.3 代码编辑器推荐

虽然任何编辑器都能写Playwright脚本，但一个好的IDE能极大提升效率。

  • Visual Studio Code (VS Code)：这是目前对Playwright支持最好的编辑器，没有之一。微软官方提供了强大的Playwright Test扩展，可以实现代码智能补全、测试用例管理、调试、甚至录制脚本等功能。如果你还没用VS Code，强烈建议尝试。
  • PyCharm (Python)：JetBrains家的IDE，对Python支持一流。安装Playwright插件后，也能获得不错的支持。
  • WebStorm (JavaScript/TypeScript)：同样是JetBrains产品，专注于前端开发，对Playwright的支持也很好。

选一个你顺手的就行，但VS Code的Playwright生态是目前最完善的。

4. 安装流程全解析：从命令到原理

好了，基础打牢，我们进入正题。安装Playwright本身非常简单，但背后的细节值得深究。我会分语言详细说明，并解释每个命令在做什么。

4.1 Node.js / TypeScript 安装指南

在准备好的项目目录下（确保有package.json），我们开始安装。

第一步：安装Playwright核心库

打开终端，执行以下命令之一：

# 使用 npm npm init playwright@latest # 使用 yarn yarn create playwright # 使用 pnpm pnpm create playwright

这个create命令是一个“脚手架”命令。它会做几件事：

  1. 询问你是否要安装Playwright（当然选Yes）。
  2. 询问你使用哪种编程语言（TypeScript还是JavaScript）。我强烈推荐选择TypeScript，即使你不熟悉TS。Playwright的API和类型提示在TS下体验极佳，能避免很多低级错误，VS Code的补全也会更强大。
  3. 询问你是否要在项目根目录创建测试目录和示例文件（建议选Yes，方便学习）。
  4. 询问你是否要安装GitHub Actions工作流文件（如果你用GitHub做CI，可以选Yes）。
  5. 最关键的一步：它会询问你是否要下载浏览器。这里通常选Yes。如果你网络不好，可以先选No，稍后再手动安装。

执行完毕后，你的package.json里会新增@playwright/test依赖，并且项目目录下会生成一些配置文件（如playwright.config.ts）和示例测试文件。

第二步：安装浏览器二进制文件（如果上一步跳过了）

如果你在上一步跳过了浏览器下载，或者后续想添加其他浏览器，需要手动安装。

# 安装所有支持的浏览器（Chromium, Firefox, WebKit） npx playwright install # 只安装Chromium npx playwright install chromium # 安装特定版本的Chromium npx playwright install chromium@stable # 安装稳定版 npx playwright install chromium@canary # 安装金丝雀版

这个npx playwright install命令就是去Playwright的专用服务器下载对应平台的浏览器二进制文件，默认会存放在~/.cache/ms-playwright（Linux/macOS）或%USERPROFILE%\AppData\Local\ms-playwright（Windows）目录下。

注意：这里就是很多人遇到的“安装慢”或“失败”的环节。因为服务器可能在国外，下载几百兆文件对某些网络环境是个挑战。别急，后面有专门的“换源”和“离线安装”技巧。

第三步：验证安装

创建一个简单的测试文件，比如test-demo.js：

const { chromium } = require('playwright'); (async () => { const browser = await chromium.launch({ headless: false }); // 非无头模式，让我们看到浏览器 const page = await browser.newPage(); await page.goto('https://example.com'); console.log(await page.title()); // 应该输出 "Example Domain" await page.screenshot({ path: 'example.png' }); await browser.close(); })();

然后运行node test-demo.js。如果一切正常，你会看到一个浏览器窗口打开，访问 example.com，然后在控制台打印标题，并在当前目录生成一张截图example.png。

4.2 Python 安装指南

在激活的Python虚拟环境中，安装更加直接。

第一步：安装Playwright Python包

pip install playwright

这条命令会从PyPI下载并安装playwright这个Python包。

第二步：安装浏览器二进制文件

playwright install

和Node.js版本一样，这个命令会下载浏览器。你也可以指定浏览器：

playwright install chromium

第三步：验证安装

创建一个Python脚本demo.py：

from playwright.sync_api import sync_playwright with sync_playwright() as p: browser = p.chromium.launch(headless=False) page = browser.new_page() page.goto("https://example.com") print(page.title()) # 输出: Example Domain page.screenshot(path="example.png") browser.close()

运行python demo.py，效果应该和Node.js版本一致。

4.3 .NET (C#) 安装指南（简要）

对于C#开发者，可以通过NuGet包管理器安装。

  1. 在Visual Studio中，右键点击项目 -> “管理NuGet程序包”。
  2. 搜索Microsoft.Playwright并安装。
  3. 安装后，需要在项目目录下打开“程序包管理器控制台”（Package Manager Console），执行命令：
    pwsh bin\Debug\net8.0\playwright.ps1 install
    或者直接在项目根目录的终端执行：
    dotnet tool install --global Microsoft.Playwright.CLI playwright install
    同样，这会下载浏览器二进制文件。

5. 疑难杂症与深度优化

安装过程很少一帆风顺，尤其是在网络环境复杂的情况下。下面是我在实践中总结的常见问题及其解决方案。

5.1 浏览器下载慢或失败？试试换源

这是国内开发者遇到最多的问题。Playwright默认从Google的存储服务器下载浏览器，速度可能很不理想。幸运的是，Playwright支持通过环境变量来配置下载镜像源。

方法一：通过环境变量临时设置（推荐）

在运行playwright install命令前，先设置环境变量。

  • Linux/macOS:
    # 使用淘宝镜像源 export PLAYWRIGHT_DOWNLOAD_HOST=https://npmmirror.com/mirrors/playwright/ # 然后运行安装命令 playwright install
  • Windows (PowerShell):
    $env:PLAYWRIGHT_DOWNLOAD_HOST="https://npmmirror.com/mirrors/playwright/" playwright install
  • Windows (CMD):
    set PLAYWRIGHT_DOWNLOAD_HOST=https://npmmirror.com/mirrors/playwright/ playwright install

方法二：修改Playwright的NPM包配置（Node.js项目）

对于Node.js项目，你可以在playwright.config.ts配置文件中，或者在安装命令中直接指定。

# 在安装时通过npm_config变量指定 npm_config_playwright_download_host=https://npmmirror.com/mirrors/playwright/ npx playwright install

方法三：使用离线包（终极解决方案）

如果网络条件极差，或者需要在无外网的生产服务器上部署，离线安装是唯一选择。

  1. 在有网的机器上准备离线包：
    # 1. 正常安装Playwright和浏览器 npm init playwright@latest # 或 pip install playwright && playwright install # 2. 找到浏览器缓存目录 # Linux/macOS: ~/.cache/ms-playwright # Windows: %USERPROFILE%\AppData\Local\ms-playwright # 3. 将这个目录完整打包（例如打包成 ms-playwright.tar.gz）
  2. 在无网机器上部署：
    • 安装Playwright库（可以通过离线pip包或npm包）。
    • 将打包好的ms-playwright目录解压到目标机器对应的缓存目录路径。
    • 确保目录结构和权限正确。
    • 运行playwright install命令，Playwright会检查本地缓存，如果发现已有浏览器文件，就会跳过下载。

实操心得：淘宝镜像源（npmmirror.com）的速度非常快，基本能跑满带宽，是解决下载问题的首选。如果镜像源也失效，可以尝试搜索“Playwright CDN”寻找其他可用镜像。

5.2 安装后运行报错：“Executable doesn‘t exist at...”

这个错误通常意味着Playwright没有找到浏览器可执行文件。可能的原因和解决步骤：

  1. 检查安装是否真正完成：运行playwright install --dry-run可以查看哪些浏览器已安装。如果没安装，就重新运行playwright install。
  2. 检查缓存目录权限：确保当前用户对~/.cache/ms-playwright目录有读写权限。
  3. 环境变量冲突：检查是否有PLAYWRIGHT_BROWSERS_PATH环境变量被设置，它指向了错误的路径。可以echo $PLAYWRIGHT_BROWSERS_PATH查看，如果不需要可以取消设置。
  4. 手动指定浏览器路径：在代码中启动浏览器时，可以显式指定可执行文件路径。
    // Node.js const browser = await chromium.launch({ executablePath: '/path/to/your/chromium' });
    # Python browser = p.chromium.launch(executable_path="/path/to/your/chromium")

5.3 与现有浏览器驱动（如ChromeDriver）冲突

Playwright管理自己的浏览器，与系统已安装的Chrome或Selenium使用的ChromeDriver完全独立，通常不会冲突。但如果你在同一个Python环境或Node.js项目中混用了Selenium和Playwright，需要注意依赖包版本可能存在的兼容性问题。最佳实践是：使用虚拟环境或不同的项目来隔离不同的自动化工具。

5.4 在Docker中安装Playwright

在Docker容器中运行Playwright是CI/CD的常见场景。你需要一个包含必要系统依赖的镜像。

使用官方镜像（最简单）： Playwright提供了预装所有依赖的Docker镜像，非常方便。

FROM mcr.microsoft.com/playwright:v1.40.0-focal # 拷贝你的代码和安装依赖 COPY . . RUN npm ci # 或 pip install -r requirements.txt CMD ["npm", "test"]

在自定义镜像中安装： 如果你需要基于其他镜像（如node:18），则需要手动安装系统依赖和浏览器。

FROM node:18-bullseye-slim # 1. 安装Playwright所需的系统库（这些是运行Chromium等所必需的） RUN apt-get update && apt-get install -y \ wget \ gnupg \ ca-certificates \ fonts-liberation \ libasound2 \ libatk-bridge2.0-0 \ libatk1.0-0 \ libc6 \ libcairo2 \ libcups2 \ libdbus-1-3 \ libexpat1 \ libfontconfig1 \ libgbm1 \ libgcc1 \ libglib2.0-0 \ libgtk-3-0 \ libnspr4 \ libnss3 \ libpango-1.0-0 \ libpangocairo-1.0-0 \ libstdc++6 \ libx11-6 \ libx11-xcb1 \ libxcb1 \ libxcomposite1 \ libxcursor1 \ libxdamage1 \ libxext6 \ libxfixes3 \ libxi6 \ libxrandr2 \ libxrender1 \ libxss1 \ libxtst6 \ lsb-release \ xdg-utils \ --no-install-recommends \ && rm -rf /var/lib/apt/lists/* # 2. 安装Playwright npm包 WORKDIR /app COPY package*.json ./ RUN npm ci # 3. 安装Playwright浏览器（使用镜像源加速） ENV PLAYWRIGHT_DOWNLOAD_HOST=https://npmmirror.com/mirrors/playwright/ RUN npx playwright install --with-deps chromium # 4. 拷贝应用代码 COPY . . CMD ["npm", "test"]

关键点是--with-deps参数，它会确保安装所有必要的系统依赖（虽然我们在前面已经手动安装了一部分，但加上更保险）。

6. 进阶配置与最佳实践

安装只是第一步，要让Playwright在项目中发挥最大威力，还需要一些配置和技巧。

6.1 配置文件（playwright.config.ts）详解

使用npm init playwright@latest创建的项目会生成一个配置文件。这个文件是Playwright Test运行器的核心，它允许你集中管理所有配置。

import { defineConfig, devices } from '@playwright/test'; export default defineConfig({ // 测试文件的位置 testDir: './tests', // 并行运行测试的最大工作进程数 workers: process.env.CI ? 1 : undefined, // 每个测试的最大超时时间 timeout: 30 * 1000, // 全局的expect断言超时 expect: { timeout: 5000 }, // 报告器配置 reporter: 'html', // 项目配置：可以定义多个浏览器/设备项目 projects: [ { name: 'chromium', use: { ...devices['Desktop Chrome'] }, }, { name: 'firefox', use: { ...devices['Desktop Firefox'] }, }, { name: 'webkit', use: { ...devices['Desktop Safari'] }, }, // 模拟移动端 { name: 'Mobile Chrome', use: { ...devices['Pixel 5'] }, }, ], // 全局启动/结束的钩子 // webServer: { // command: 'npm run start', // url: 'http://127.0.0.1:3000', // reuseExistingServer: !process.env.CI, // }, });

通过这个配置文件，你可以轻松实现：多浏览器并行测试、移动端模拟、测试服务器自动启动、自定义超时、生成HTML报告等高级功能。

6.2 使用Playwright Test vs 独立脚本

Playwright提供了两种使用模式：

  1. Playwright Test：一个基于测试运行器的全功能框架（类似Jest、Mocha）。它提供了测试夹具（Fixtures）、钩子函数、并行执行、自动重试、内置报告等特性。对于编写自动化测试套件，这是官方推荐且最强大的方式。上面提到的配置文件就是给Playwright Test用的。

  2. 独立脚本（Library Mode）：直接导入playwright库，像使用一个普通Node.js/Python库一样编写脚本。这种方式更灵活，适合一次性任务、爬虫、截图工具等非测试场景。我们前面验证安装的示例就是这种模式。

如何选择？

  • 如果你要做的是严格的、可重复的、需要报告和CI集成的自动化测试，毫不犹豫选择Playwright Test。
  • 如果你只是写个简单的数据抓取脚本、页面监控工具或者一次性任务，用独立脚本模式更轻量快捷。

6.3 与AI和MCP结合的新趋势

从你提供的热词里能看到playwright ai和playwright mcp。这代表了两个有趣的方向：

  • Playwright + AI：你可以利用Playwright自动操作浏览器，将网页内容（文本、截图）喂给大语言模型（如通过OpenAI API），让AI帮你分析页面、总结内容、甚至基于页面状态做出决策。这打开了RPA（机器人流程自动化）和智能助理的新可能。
  • Playwright + MCP (Model Context Protocol)：MCP是Anthropic提出的一种让AI模型更安全、可控地使用工具的协议。虽然还在早期，但可以想象未来你可以通过自然语言指令（如“帮我检查一下购物车页面有没有错误”），AI代理就能自动编写或调用Playwright脚本来完成任务。

要开始尝试Playwright + AI，一个简单的起点是：用Playwright导航到目标页面，用page.content()获取HTML，或者用page.screenshot()截图，然后将这些信息发送给ChatGPT等模型的API，请求其进行分析或问答。

7. 从安装到第一个实战脚本

理论说了这么多，我们动手写一个有点用的脚本，巩固一下安装成果。假设我们要自动检查某个网站首页的标题和关键链接是否正常。

目标：用Playwright打开百度首页，搜索“Playwright”，检查搜索结果页是否包含Playwright官网链接。

Node.js版本脚本 (check-baidu.js):

const { chromium } = require('playwright'); (async () => { // 1. 启动浏览器（无头模式，不显示界面，适合后台运行） const browser = await chromium.launch({ headless: true }); const context = await browser.newContext(); const page = await context.newPage(); try { // 2. 导航到百度 await page.goto('https://www.baidu.com'); console.log(`已访问页面: ${await page.title()}`); // 3. 定位搜索框并输入关键词 const searchInput = await page.$('#kw'); // 百度搜索框的ID if (!searchInput) { throw new Error('未找到搜索框元素'); } await searchInput.fill('Playwright'); console.log('已输入搜索词'); // 4. 点击“百度一下”按钮 const searchButton = await page.$('#su'); await searchButton.click(); console.log('已点击搜索按钮'); // 5. 等待结果页面加载完成（等待某个结果元素出现） await page.waitForSelector('#content_left', { timeout: 10000 }); console.log('搜索结果页已加载'); // 6. 获取所有搜索结果链接的文本和URL const results = await page.$$eval('#content_left h3 a', (links) => links.map(link => ({ text: link.innerText, href: link.href })) ); console.log(`共找到 ${results.length} 条结果`); // 7. 检查是否包含Playwright官网 const playwrightOfficialSite = 'https://playwright.dev'; const hasOfficialSite = results.some(result => result.href.includes(playwrightOfficialSite)); if (hasOfficialSite) { console.log('✅ 成功找到Playwright官网链接！'); } else { console.log('❌ 未找到Playwright官网链接。'); // 可以在这里输出前几条结果以供调试 console.log('前5条结果:', results.slice(0, 5)); } // 8. （可选）截图保存证据 await page.screenshot({ path: 'baidu-search-result.png', fullPage: false }); console.log('截图已保存'); } catch (error) { console.error('脚本执行出错:', error); // 出错时截图，便于排查 await page.screenshot({ path: 'error.png' }); } finally { // 9. 无论如何，最后都要关闭浏览器 await browser.close(); console.log('浏览器已关闭'); } })();

运行这个脚本:

node check-baidu.js

这个脚本涵盖了Playwright最常用的几个操作：启动浏览器、页面导航、元素定位与交互（填充、点击）、等待、提取数据以及错误处理。你可以在此基础上修改，去检查你关心的网站。

注意事项：网页元素的选择器（如#kw,#su）可能会随着网站改版而变化。编写稳定的自动化脚本，选择器的选取是一门学问。优先使用id、>

http://www.jsqmd.com/news/1097536/

相关文章：

  • Appium替代方案深度解析：七大工具选型与实战指南
  • 3分钟快速上手：Windows风扇控制软件FanControl中文设置完全指南
  • 效率直接起飞！2026年实测靠谱的专业AI论文工具
  • 从零搭建内网渗透测试靶场：实战环境设计与攻防演练
  • 点胶镶钻设备的高速与精度矛盾：一套算法协同方案的技术拆解
  • Java自动化测试工具大全：从单元测试到UI测试的完整实践指南
  • 实战绕过403访问控制：从状态码到内网渗透的系统化方法
  • Docker部署Apache Doris集群：解决FE/BE节点注册与网络通信难题
  • Pytest面试核心考点与实战指南：从Fixture原理到测试框架设计
  • pvc外墙挂板
  • 企业级米家商城设计与实现abo管理系统源码｜SpringBoot+Vue+MyBatis架构+MySQL数据库【完整版】
  • Python测试套件深度解析：从unittest到pytest的高效测试组织与执行
  • APT攻击流量分析实战：从海莲花MST木马检测到防御体系构建
  • 终极MP4视频修复指南：用untrunc轻松拯救损坏文件的完整教程
  • input type=number填了字母，值变NaN！
  • Playwright测试报告工具横向评测：Allure、Monocart等6款工具深度对比
  • 从零搭建Hermes Agent：AI智能体框架原理、安装与实战指南
  • MySQL数据库从入门到实战：核心概念、SQL语法与优化指南
  • JMeter分布式测试网络带宽优化：突破性能压测吞吐量瓶颈
  • Playwright与MCP协议结合：构建下一代智能UI自动化测试框架
  • AI驱动软件测试变革：从自动化到智能化的实战路径
  • OpenDog实战解密：四足机器人运动控制的核心挑战与解决方案
  • 小程序逆向分析实战：从抓包、反编译到动态调试与自动化审计
  • wrk2性能测试：解决协调遗漏，精准测量延迟分布
  • 考虑电动汽车灵活性的微网多时间尺度协调调度研究（Matlab代码实现）
  • Playwright与Selenium深度对比：现代Web自动化测试工具选型指南
  • 2026-06-29 GitHub 热点项目精选
  • SM2国密算法实战指南：从原理到Java实现与问题排查
  • 使用Transformers库搭建一个能和你闲聊的AI伙伴
  • Robotframework下Playwright与Selenium深度对比：从架构到实战选型指南