自動化測試工具-Playwright（快速上手）
1、前言
一提到 UI 自動化測試工具，首要推薦的必屬是 Selenium，其優(yōu)勢在于跨平臺、跨語言、完全開源、對商業(yè)用戶也沒有任何限制、支持分布式、擁有成熟的社區(qū)與學習文檔等，目前已經(jīng)迭代更新到 4 版本。那么缺點也有，比如環(huán)境配置、加載效率低、運行速度慢等。
除了 Selenium 就沒有別的工具推薦了嗎？當然不是，還有很多優(yōu)秀的工具，比如 Cypress、Robot Framework 等。
本篇將介紹另一款強大而易用的 UI 自動化測試工具-Playwright。
2、簡介
微軟開源自動化測試工具 Playwright，支持主流瀏覽器，包括：Chrome、Firefox、Safari 等，同時支持以無頭模式、有頭模式運行，并提供了同步、異步的 API，可以結合 Pytest 測試框架使用，并且支持瀏覽器端的自動化腳本錄制等功能。
特點：
1、跨瀏覽器。Playwright 支持所有現(xiàn)代渲染引擎，包括Chromium、WebKit 和 Firefox。
2、跨平臺。在 Windows、Linux 和 macOS 上進行本地或 CI、無頭或有頭測試。
3、跨語言。在 TypeScript、JavaScript、Python、.NET、Java 中使用Playwright API。
4、測試移動網(wǎng)絡。適用于 Android 和 Mobile Safari 的 Google Chrome 原生移動仿真。相同的渲染引擎適用于您的桌面和云端。
官網(wǎng)地址：
https://playwright.dev。
GitHub地址：
https://github.com/microsoft/playwright。
3、安裝
Playwright 支持跨語言，本篇將以 Python 進行講解。
首先要安裝 Python（有 Python 環(huán)境）。
之后打開命令行，輸入安裝命令即可。
pip install --upgrade pip
pip install playwright
playwright install
4、交互模式
Playwright 支持交互模式，即運行單行代碼或者代碼塊，能立即給出運行結果。
由于 Playwright 支持同步和異步的 API，那么應先了解一下什么是同步和異步？
同步，可以理解為在執(zhí)行完一個函數(shù)或方法之后，一直等待系統(tǒng)返回值或消息，這時程序是出于阻塞的，只有接收到返回的值或消息后才往下執(zhí)行其他的命令。
異步，執(zhí)行完函數(shù)或方法后，不必阻塞性地等待返回值或消息，只需要向系統(tǒng)委托一個異步過程，那么當系統(tǒng)接收到返回值或消息時，系統(tǒng)會自動觸發(fā)委托的異步過程，從而完成一個完整的流程。
下面以操作打開瀏覽器，訪問百度首頁，關閉瀏覽器為例。
（1）同步命令
打開命令行，輸入 python。
進入到 Python 交互模式中，輸入如下命令：
from playwright.sync_api import sync_playwright
playwright = sync_playwright().start()
browser = playwright.chromium.launch(headless=False)
page = browser.new_page()
page.goto("https://www.baidu.com/")
browser.close()
playwright.stop()
輸入訪問百度首頁命令，瀏覽器頁面會同時跳轉到百度首頁，同時命令行輸出響應與請求的信息。
（2）異步命令
打開命令行，輸入 python -m asyncio。
進入到 Python 交互模式中，輸入如下命令：
from playwright.async_api import async_playwright
playwright = await async_playwright().start()
browser = await playwright.chromium.launch(headless=False)
page = await browser.new_page()
await page.goto("https://www.baidu.com/")
await browser.close()
await playwright.stop()
輸入訪問百度首頁命令，瀏覽器頁面也會同時跳轉到百度首頁，命令行也會輸出響應與請求的信息。
5、錄制模式
Playwright 帶有命令行工具（錄制功能），可用于記錄用戶交互并生成代碼（Java、Python等）。其實就是類似于 Selenium IDE。
（1）常規(guī)錄制
打開命令行，輸入：
playwright codegen baidu.com
自動打開瀏覽器，并跳轉到百度首頁。
同時也彈出錄制窗口，可以看到是錄制中，腳本語言為 Python。
通過操作（點擊、輸入等）瀏覽器頁面，腳本也會自動增加操作的步驟。
此外，錄制工具還可以獲取元素的定位。點擊停止錄制，之后再點擊 Explore 后，在頁面點擊想要定位的元素，即可獲取到該元素定位的值。
最后將錄制的腳本復制出來，可做適當?shù)恼{整。
調整后的腳本代碼：
#!/usr/bin/env python
# -*- coding: utf-8 -*-
# 公眾號：AllTests軟件測試
from playwright.sync_api import Playwright, sync_playwright, expect
def run(playwright: Playwright) -> None:
browser = playwright.chromium.launch(headless=False)
context = browser.new_context()
# Open new page
page = context.new_page()
# Go to https://www.baidu.com/
page.goto("https://www.baidu.com/")
# Click input[name="wd"]
page.locator("input[name=\"wd\"]").click()
# Fill input[name="wd"]
page.locator("input[name=\"wd\"]").fill("自動化測試")
# Click text=百度一下
page.locator("text=百度一下").click()
# ---------------------
context.close()
browser.close()
with sync_playwright() as playwright:
run(playwright)
（2）模擬移動設備錄制
open 可以模擬移動設備和平板設備。
例如模擬 iPhone 13 訪問作者的 CSDN。
playwright open --device="iPhone 13" blog.csdn.net/wangmcn
如圖：模擬 iPhone 13 打開瀏覽器的效果。
6、編寫模式
使用 IDE（如 PyCharm、Visual Studio Code 等） 進行編寫代碼并運行程序。
（1）啟動瀏覽器（無頭模式）
Playwright 可以啟動三種瀏覽器中的 chromium、firefox、webkit 任何一種。
示例操作如下，打開瀏覽器、跳轉百度、屏幕截圖、輸出頁面標題、關閉瀏覽器。
腳本代碼：
#!/usr/bin/env python
# -*- coding: utf-8 -*-
# 公眾號：AllTests軟件測試
from playwright.sync_api import sync_playwright
with sync_playwright() as p:
browser = p.chromium.launch()
page = browser.new_page()
page.goto("https://www.baidu.com/")
page.screenshot(path="example.png")
print(page.title())
browser.close()
運行結果：控制臺輸出頁面標題。
（2）啟動瀏覽器（有頭模式）
默認情況下，Playwright 以無頭模式運行瀏覽器。要查看瀏覽器 UI（有頭模式），請在啟動瀏覽器時傳遞 headless=False 標志，還可以使用 slow_mo 來減慢執(zhí)行速度。
腳本代碼：
#!/usr/bin/env python
# -*- coding: utf-8 -*-
# 公眾號：AllTests軟件測試
from playwright.sync_api import sync_playwright
with sync_playwright() as p:
browser = p.chromium.launch(headless=False, slow_mo=50)
page = browser.new_page()
page.goto("https://www.baidu.com/")
page.screenshot(path="example.png")
print(page.title())
browser.close()
（3）異步
Playwright 支持 API 的兩種變體：同步和異步。
支持異步，如果你的項目使用 asyncio，則應該使用 async API。
腳本代碼：
#!/usr/bin/env python
# -*- coding: utf-8 -*-
# 公眾號：AllTests軟件測試
import asyncio
from playwright.async_api import async_playwright
async def main():
async with async_playwright() as p:
browser = await p.chromium.launch()
page = await browser.new_page()
await page.goto("https://www.baidu.com/")
print(await page.title())
await browser.close()
asyncio.run(main())
