Playwright——快速入门（初章）

Playwright：引领自动化测试的未来

在数字化时代，Web应用的复杂性和用户期望的提高对软件测试提出了更高的要求。微软开发的Playwright，作为一个创新的自动化测试框架，正以其卓越的性能和全面的浏览器支持，重新定义Web自动化测试的标准。

什么是Playwright？

Playwright是一个跨浏览器、跨平台、跨语言的自动化测试工具，它支持Chromium、WebKit和Firefox等主流浏览器，能够在Windows、Linux和macOS上运行。Playwright以其简洁的API和强大的功能，允许开发者在不同的浏览器和平台上进行一致的自动化测试。

Playwright的核心优势

• 跨浏览器测试：Playwright支持所有现代渲染引擎，这意味着开发者可以在一个统一的框架下，对不同浏览器进行测试，无需为每个浏览器编写特定的测试代码。
• 高性能与异步执行：与传统的Selenium相比，Playwright基于异步实现，提供了更快的测试执行速度和更流畅的用户体验。
• 无需浏览器驱动：Playwright内置了对浏览器的支持，无需额外下载和配置浏览器驱动，简化了测试环境的搭建过程。
• 自动等待机制：Playwright智能地等待元素可操作后再执行操作，减少了因元素未加载完成而导致的测试失败。
• 丰富的API和调试工具：Playwright提供了全面的API支持，包括页面导航、元素交互、表单提交和网络请求等，同时配备了强大的调试工具，如代码生成器、Playwright
  Inspector和跟踪查看器，帮助开发者高效地编写和调试测试脚本。
• 完全隔离的测试环境：每个测试都在独立的浏览器上下文中运行，确保了测试之间的完全隔离，同时支持保存和重用身份验证状态，提高了测试的效率和准确性。

Playwright的应用场景

Playwright的应用场景非常广泛，包括但不限于：

• 跨浏览器测试：确保应用在不同浏览器上的一致性。
• 自动化测试：与测试框架如Jest、Mocha集成，实现持续集成和自动化测试。
• 端到端测试：验证关键用户流程，确保系统的整体质量。
• 性能测试：分析网页在不同浏览器下的性能，查找性能瓶颈。
• 移动端测试：在真实移动设备上运行测试，支持Android和iOS设备。

安装 playwright 客户端库

输入以下代码：

pip install playwright

显示以下安装过程：

Collecting playwrightDownloading playwright-1.39.0-py3-none-win_amd64.whl (29.2 MB)━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 29.2/29.2 MB 238.5 kB/s eta 0:00:00
Collecting greenlet==3.0.0 (from playwright)Downloading greenlet-3.0.0-cp311-cp311-win_amd64.whl (288 kB)━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 288.2/288.2 kB 378.1 kB/s eta 0:00:00
Collecting pyee==11.0.1 (from playwright)Downloading pyee-11.0.1-py3-none-any.whl (15 kB)
Collecting typing-extensions (from pyee==11.0.1->playwright)Downloading typing_extensions-4.8.0-py3-none-any.whl (31 kB)
Installing collected packages: typing-extensions, greenlet, pyee, playwrightSuccessfully installed greenlet-3.0.0 playwright-1.39.0 pyee-11.0.1 typing-extensions-4.8.0

安装playwright浏览器

playwright 项目默认使用自己编译好的几种浏览器，比如 chromium， firefox， webkit，这些浏览器是通过开源项目编译的。
安装代码如下：

playwright install

简单示例

from playwright.sync_api import sync_playwrightinput('1....')
# 启动 playwright driver 进程
p = sync_playwright().start()input('2....')
# 启动浏览器，返回 Browser 类型对象
browser = p.chromium.launch(headless=False)# 创建新页面，返回 Page 类型对象
page = browser.new_page()
page.goto("https://www.byhy.net/cdn2/files/selenium/stock1.html")
print(page.title()) # 打印网页标题栏# 输入通讯，点击查询。这是定位与操作，是自动化重点，后文详细讲解
page.locator('#kw').fill('通讯')  # 输入通讯
page.locator('#go').click()      # 点击查询# 打印所有搜索内容
lcs = page.locator(".result-item").all()
for lc in lcs:print(lc.inner_text())input('3....')
# 关闭浏览器
browser.close()
input('4....')
# 关闭 playwright driver 进程
p.stop()

可以选择其它浏览器：

# 启动firefox浏览器
browser = p.firefox.launch(headless=False)# 启动webkit浏览器
browser = p.webkit.launch(headless=False)

可以使用 with语句，不需要调用 start() 和 stop()，见以下代码：

from playwright.sync_api import sync_playwrightwith sync_playwright() as p:browser = p.chromium.launch(headless=False)page = browser.new_page()page.goto("https://www.byhy.net/cdn2/files/selenium/stock1.html")print(page.title())page.locator('#kw').fill('通讯\n')page.locator('#go').click()# 打印所有搜索内容lcs = page.locator(".result-item").all()for lc in lcs:print(lc.inner_text())browser.close()

界面等待

上面的代码，大家发现不能打印出股票搜索的结果。
原因是：点击查询后，立即就去检查搜索结果了，这时，界面上还没有呈现结果，所以返回的是空结果，需要等待一段时间，比如2秒。

但是目前，我们不能在Playwright中使用 time.sleep 进行等待，因为Playwright底层使用的是异步的python库进行各种事件处理，time.sleep 会破坏异步框架的处理逻辑，可以使用 Page 对象的 wait_for_timeout 方法达到等待效果，单位是毫秒 。

page.wait_for_timeout(1000)

自动化代码助手

Playwright 内置了 代码助手 的功能，可以帮我们产生“自动化代码”输入如下命令，即可启动代码助手：

playwright codegen

注意：这个只能作为助手，它主要是记录人对页面的输入，并不能取代人自己写代码，特别是那些获取页面上信息的代码。
比如，打印标题栏，就没法自动化生成。

print(page.title())

还有这些，获取所有搜索内容的代码，也无法自动化生成。

# 打印所有搜索内容
lcs = page.locator(".result-item").all()
for lc in lcs:print(lc.inner_text())

跟踪功能

Playwright 有个特色功能： 跟踪（tracing）

启用跟踪功能后， 可以在执行自动化后，通过记录的跟踪数据文件， 回看自动化过程中的每个细节，下面的的代码进行了自动化搜索股票，并打开跟踪功能，保存跟踪数据文件为 trace.zip。

from playwright.sync_api import sync_playwrightp = sync_playwright().start()
browser = p.chromium.launch(headless=False)# 创建 BrowserContext对象
context = browser.new_context()
# 启动跟踪功能
context.tracing.start(snapshots=True, sources=True, screenshots=True)page = context.new_page()
page.goto("https://www.byhy.net/cdn2/files/selenium/stock1.html")# 搜索名称中包含 通讯 的股票
page.locator('#kw').fill('通讯') 
page.locator('#go').click()page.wait_for_timeout(1000) # 等待1秒lcs = page.locator(".result-item").all()
for lc in lcs:print(lc.inner_text())# 搜索名称中包含 软件 的股票
page.locator('#kw').fill('软件')  
page.locator('#go').click()    page.wait_for_timeout(1000) # 等待1秒lcs = page.locator(".result-item").all()
for lc in lcs:print(lc.inner_text())# 结束跟踪
context.tracing.stop(path="trace.zip")browser.close()
p.stop()

执行完以后，我们发现，当前工作目录下面多了 trace.zip 这个跟踪数据文件。怎么查看这个跟踪文件呢？有2种方法：

• 直接访问 trace.playwright.dev 这个网站，上传跟踪文件。

• 执行命令 playwright show-trace trace.zip