Playwright 的使用

Playwright 的特点

支持当前所有主流浏览器，包括 Chrome 和 Edge （基于 Chromiuns）, Firefox , Safari

支持移动端页面测试，使用设备模拟技术，可以让我们在移动Web 浏览器中测试响应式的 Web 应用程序

支持所有浏览器的无头模式和非无头模式的测试

安装和配置过程简单，安装过程中会自动安装对应的浏览器和驱动，不需要额外配置 WebDriber

提供和自动等待相关的API ， 在页面加载时会自动等待对应的节点加载，大大减小了API 编写的复杂的

安装

1. 首先确保 python 版本大于 3.7

pip install playwright

这时，playwright 会安装 Chromium , Firefox 和 WebKit 浏览器并配置一些驱动

基本使用

Playwright 支持两种模式，同步 和 异步 根据需要选择不同的模式

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    for browser_type in [p.chromium, p.firefox, p.webkit]:
        browser = browser_type.launch(headless=False)
        page = browser.new_page()
        page.goto('https://www.baidu.com')
        page.screenshot(path=f'screenshot-{browser_type.name}.png')
        print(page.title())
        browser.close()

代码执行后会依次使用三种浏览器打开百度首页

这里我们首先导入并直接调用了 sync_playwright 方法， 该方法的返回值是一个 PlaywrightContextManger 对象，可以理解为一个浏览器上下文管理器，我们将其配置为 p 变量。然后依次调用 p 的 chromium, firefox 和 webkit 属性创建了 Chromium, Firefox 以及 webkit 浏览器实例。接着用一个 for 循环依次执行了这 3 个浏览器实例的 launch 方法， 同时设置了 headless 参数为 False

如果不把 headless 设置为 False ，就会默认以无头模式打开浏览器，我们将看不到任何窗口

在 for 循环中， launch 方法返回一个 Browser 对象， 我们将其赋值为 browser 变量。 然后调用 browseer 的 new_page 方法新建了一个选项卡， 返回值是一个 Page  对象， 将其赋值为 page ， ，之后调用 page 的一系列API 完成了各种自动化操作，调用 goto 方法加载某个页面，这里我们访问的是百度首页， 调用 screenshot 方法获取页面截图， 往其里面传入的文件名称是截图自动保存后的图片名称， 这里的名称中我们加入了 browser_type 的 name 属性， 代表浏览器的类型，于是 3 次循环中 screenshot 方法的结果分别是 chromium , firefox , 和 webkit 另外，还调用了 title 方法，该方法会返回页面的标题， 即 HTML 源代码中 title 节点的文字， 也就是选项卡上的文字，并将返回的页面标题打印到控制台， 最后，调用 browser 的 close 方法关闭整个浏览器，代码结束

上面演示的是同步模式，Playwright 还支持异步模式

import asyncio
from playwright.async_api import async_playwright

async def main():
    async with async_playwright() as p:
        for browser_type in [p.chromium, p.firefox, p.webkit]:
            browser = await browser_type.launch()
            page = await browser.new_page()
            await page.goto('https://www.baidu.com')
            await page.screenshot(path=f'screenshot-{browser_type.name}.png')
            print(await page.title())
            await browser.close()

asyncio.run(main())

可以看到，写法和同步模式基本一样，只不过这里导入的是 async_playwright 方法， 不再是 sync_playwright 方法， 以及写法上添加了 async / await 关键字， 最后运行效果和同步模式一样

另外可以注意到， 这两个例子中使用了 with as 语句，with 用于管理上下文对象，可以返回一个上下文管理器，寄一个 PlaywrightContextManger 对象，无论代码运行期间是否抛出异常，该对象都能帮助我们自动分配并且释放 Playwright 的资源

这里并没有传入 headless 为 True 所以没有显示浏览器页面，也就是用的是无头模式

代码生成

Playwright 还有一个强大的功能，是可以录制我们在浏览器中的操作并自动生成代码，有了这个功能，我们甚至一行代码都不用写。这个功能可以通过 playwright 命令行调用 codegen 实现，先来看看 codegen 有什么参数

在终端输入命令如下;

playwright codegen --help

结果类似如果下：

Usage: playwright codegen [options] [url]

open page and generate code for user actions

Options:
  -o, --output <file name>             saves the generated script to a file
  --target <language>                  language to generate, one of javascript, playwright-test, python, python-async,
                                       python-pytest, csharp, csharp-mstest, csharp-nunit, java, java-junit (default:
                                       "python")
  --save-trace <filename>              record a trace for the session and save it to a file
  --test-id-attribute <attributeName>  use the specified attribute to generate data test ID selectors
  -b, --browser <browserType>          browser to use, one