搞過自動化測試的小夥伴，相信都知道，在Web自動化測試中，有一款自動化測試神器工具: `selenium`。結合標準的WebDriver API來編寫Python自動化指令碼，可以實現解放雙手，讓指令碼代替人工在Web瀏覽器上完成指定的操作。 雖然`selenium`有完備的文件，但也需要一定的學習成本，對於一個純小白來講還是有些門檻的。 最近，**微軟開源**了一個非常強大的自動化專案叫**「playwright-python」**，專案地址： ```python https://github.com/microsoft/playwright-python ``` 它支援主流的瀏覽器，包含：`Chrome`、`Firefox`、`Safari`、`Microsoft Edge` 等，同時支援以**無頭模式**、**有頭模式執行**，並提供了`同步`、`非同步`的 API，可以結合 `Pytest` 測試框架使用，並且支援瀏覽器端的自動化指令碼錄製。 而對於Python愛好者來說，還有一個更大的福利，這個專案是針對Python語言的純自動化工具，**可以做到，連一行程式碼都不用寫，就能實現自動化功能**。聽起來，簡直太碉堡了！  可能你會覺得有點不可思議，真的不用寫一行程式碼嗎？但它真的就是這麼厲害。下面我們一起看下這個神器。 ## **1.** Playwright介紹 Playwright是一個強大的Python庫，僅用一個API即可自動執行`Chromium`、`Firefox`、`WebKit`等主流瀏覽器自動化操作，並同時支援以**無頭模式**、**有頭模式**執行。 Playwright提供的自動化技術是綠色的、功能強大、可靠且快速，支援`Linux`、`Mac`以及`Windows`作業系統。  **官網：** ``` https://playwright.dev/ ```  從官網上來看，官方給`Playwright`定位是一款真正意義上的Web端到端測試工具。 ## **2.** Playwright使用 #### 2.1 安裝 Playwright功能強大，但它的安裝步驟，非常簡單，只需要 2 步: **第 1 步，安裝 playwright-python 依賴庫** (需要注意的是，playwright庫需要依賴Python3.7+以上) ```python # 安裝依賴庫 ➜ ~ pip3 install playwright Looking in indexes: https://pypi.douban.com/simple Collecting playwright Downloading https://pypi.doubanio.com/packages/08/f0/9f937ccff3221685d4a8bd406649c85855b9b6a2fafe75920b02151b48e0/playwright-0.162.2-py3-none-macosx_10_13_x86_64.whl (58.2 MB) |████████████████████████████████| 58.2 MB 1.6 MB/s Collecting greenlet==1.0a1 Downloading https://pypi.doubanio.com/packages/aa/74/6e93515873829a8d894863bbae1d709405bdd50d66fdf239480cc9db0598/greenlet-1.0a1-cp38-cp38-macosx_10_9_x86_64.whl (86 kB) |████████████████████████████████| 86 kB 6.9 MB/s Collecting typing-extensions Downloading https://pypi.doubanio.com/packages/60/7a/e881b5abb54db0e6e671ab088d079c57ce54e8a01a3ca443f561ccadb37e/typing_extensions-3.7.4.3-py3-none-any.whl (22 kB) Collecting pyee>=8.0.1 Downloading https://pypi.doubanio.com/packages/0d/0a/933b3931107e1da186963fd9bb9bceb9a613cff034cb0fb3b0c61003f357/pyee-8.1.0-py2.py3-none-any.whl (12 kB) Installing collected packages: greenlet, typing-extensions, pyee, playwright Successfully installed greenlet-1.0a1 playwright-0.162.2 pyee-8.1.0 typing-extensions-3.7.4.3 ``` 可以在`https://pypi.org/project/playwright/`檢視它的依賴版本資訊。 **第 2 步，安裝主流的瀏覽器驅動** 這樣，會將 Chromeium、Firefox、Webkit 瀏覽器驅動下載到本地 ``` # 安裝瀏覽器驅動（安裝過程稍微有點慢，請耐心等待） ➜ ~ python3 -m playwright install Downloading chromium v827102 - 121.3 Mb [====================] 100% 0.0s chromium v827102 downloaded to /Users/xxx/Library/Caches/ms-playwright/chromium-827102 Downloading firefox v1205 - 74.1 Mb [ ] 1% 37767.9s ``` 3.**如果想檢視`Playwright`支援的功能**， 可以直接在命令列輸入： ```python ➜ ~ python3 -m playwright help Usage: index [options] [command] Options: -V, --version output the version number -b, --browser browser to use, one of cr, chromium, ff, firefox, wk, webkit (default: "chromium") --color-scheme emulate preferred color scheme, "light" or "dark" --device emulate device, for example "iPhone 11" --geolocation specify geolocation coordinates, for example "37.819722,-122.478611" --lang specify language / locale, for example "en-GB" --proxy-server specify proxy server, for example "http://myproxy:3128" or "socks5://myproxy:8080" --timezone time zone to emulate, for example "Europe/Rome" --timeout timeout for Playwright actions in milliseconds (default: "10000") --user-agent specify user agent string --viewport-size specify browser viewport size in pixels, for example "1280, 720" -h, --help display help for command Commands: open [url] open page in browser specified via -b, --browser cr [url] open page in Chromium ff [url] open page in Firefox wk [url] open page in WebKit codegen [options] [url] open page and generate code for user actions screenshot [options] capture a page screenshot pdf [options] save page as pdf install Ensure browsers necessary for this version of Playwright are installed help [command] display help for command ``` 從命令列幫助資訊中可以看出，`Playwright`支援的功能相當豐富！ ## 3. 實操演示 開篇就提到，使用Playwright無需寫一行程式碼，我們只需手動操作瀏覽器，它會錄製我們的操作，然後自動生成程式碼指令碼。 **3.1 錄製指令碼** 我們先檢視錄製指令碼的命令說明 ``` ➜ ~ python3 -m playwright codegen --help Usage: index codegen [options] [url] open page and generate code for user actions Options: -o, --output saves the generated script to a file --target language to use, one of javascript, python, python-async, csharp (default: "python") -h, --help display help for command Examples: $ codegen $ codegen --target=python $ -b webkit codegen https://example.com ``` **其中** - python -m playwright codegen 錄製指令碼 - --help 幫助文件 - -o 生成自動化指令碼的目錄 - --target 指令碼語言，包含 JS 和 Python，分別對應值為：python 和 javascript - -b 指定瀏覽器驅動 比如，我要在baidu.com搜尋，用chromium驅動，將結果儲存為mikezhou.py的python檔案。 ```python # 我們通過下面命令開啟 Chrome 瀏覽器開始錄製指令碼 # 指定生成語言為:Python（預設Python，可選） # 儲存的檔名：mikezhou.py（可選） # 瀏覽器驅動：webkit（預設webkit，可選） # 最後跟著要開啟的目標網站（預設僅僅是開啟瀏覽器，可選） python3 -m playwright codegen --target python -o 'mikezhou.py' -b chromium https://www.baidu.com ``` 命令列輸入後會自動開啟瀏覽器，然後可以看見在瀏覽器上的一舉一動都會被自動翻譯成程式碼，如下所示:   最後，自動化指令碼會自動生成，儲存到檔案中`mikezhou.py`, 且上述所有的人工操作，都會被自動轉化成程式碼： ```python from playwright import sync_playwright def run(playwright): browser = playwright.chromium.launch(headless=False) context = browser.newContext() # Open new page page = context.newPage() # Go to https://www.baidu.com/ page.goto("https://www.baidu.com/") # Click input[name="wd"] page.click("input[name=\"wd\"]") # Fill input[name="wd"] page.fill("input[name=\"wd\"]", "禾目大") # Press CapsLock page.press("input[name=\"wd\"]", "CapsLock") # Fill input[name="wd"] page.fill("input[name=\"wd\"]", "自動化測試實戰寶典 ") # Press Enter page.press("input[name=\"wd\"]", "Enter") # assert page.url() == "https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu&wd=%E8%87%AA%E5%8A%A8%E5%8C%96%E6%B5%8B%E8%AF%95%E5%AE%9E%E6%88%98%E5%AE%9D%E5%85%B8%20&fenlei=256&rsv_pq=af40e9aa00012d5a&rsv_t=c659gpz2%2Fjri1SAoIXdT9gP%2BmrqufXzRtMSSAL0n0fv7GSoLF5vaiNVPA3U&rqlang=cn&rsv_enter=1&rsv_dl=tb&rsv_sug3=38&rsv_sug1=22&rsv_sug7=100&rsv_sug2=0&rsv_btype=i&inputT=8034&rsv_sug4=9153" # Close page page.close() # --------------------- context.close() browser.close() with sync_playwright() as playwright: run(playwright) ``` **3.2 支援同步** 同步的關鍵字為：`sync_playwright` 比如，我們依次使用三個瀏覽器核心開啟瀏覽器，然後百度一下，接著對在搜尋介面截圖，最後關閉瀏覽器 ```python from time import sleep from playwright 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.newPage() page.goto('http://baidu.com') # 執行一次搜尋操作 page.fill("input[name=\"wd\"]", "自動化測試實戰寶典") with page.expect_navigation(): page.press("input[name=\"wd\"]", "Enter") # 等待頁面載入完全 page.waitForSelector("text=搜尋工具") # 截圖 page.screenshot(path=f'test-{browser_type.name}.png') # 休眠3s sleep(3) # 關閉瀏覽器 browser.close() ``` 需要指出的是，`playwright-python` 內建的 API 基本上囊括常見的自動化操作 **3.3 支援非同步** 非同步步的關鍵字為：`async_playwright`，非同步操作可結合asyncio同時進行三個瀏覽器操作。 ```python import asyncio from playwright 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(headless=False) page = await browser.newPage() await page.goto('http://baidu.com') # 執行一次搜尋操作 await page.fill("input[name=\"wd\"]", "自動化測試實戰寶典") await page.press("input[name=\"wd\"]", "Enter") # 等待頁面載入完全 await page.waitForSelector("text=搜尋工具") # 截圖 await page.screenshot(path=f'test-{browser_type.name}.png') await browser.close() asyncio.get_event_loop().run_until_complete(main()) ``` **3.4 支援移動端** 更厲害的是，playwright還可支援移動端的瀏覽器模擬。下面是官方文件提供的一段程式碼，模擬在給定地理位置上手機iphone 11 pro上的Safari瀏覽器，首先導航到maps.google.com，然後執行定位並截圖。 ```python from playwright import sync_playwright with sync_playwright() as p: iphone_11 = p.devices['iPhone 11 Pro'] browser = p.webkit.launch(headless=False) context = browser.newContext( **iphone_11, locale='en-US', geolocation={ 'longitude': 12.492507, 'latitude': 41.889938 }, permissions=['geolocation'] ) page = context.newPage() page.goto('https://maps.google.com') page.click('text="Your location"') page.screenshot(path='colosseum-iphone.png') browser.close() ``` **3. 5 支援Pytest框架** 另外，還可以配合pytest外掛一起使用，給出一段官網示例: ```python def test_playwright_is_visible_on_google(page): page.goto("https://www.google.com") page.type("input[name=q]", "Playwright GitHub") page.click("input[type=submit]") page.waitForSelector("text=microsoft/Playwright") ``` 當然，除了上面列舉出來的特性，還有更多有意思的用法，感興趣的讀者可以自行探索一下。 #### 4. 最後 playwright相比已有的自動化測試框架來說，具有有很多優勢，比如： - 跨瀏覽器，支援Chromium、Firefox、WebKit - 跨作業系統，支援Linux、Mac、Windows - 可提供錄製生成程式碼功能，解放雙手 - 可用於移動端 目前存在的缺點就是生態和文件還不是非常完備，比如沒有API中文文件、沒有較好的教程和示例供學習。不過相信，隨著知道的人越來越多，未來會越來越好。 最後，再說一個小祕密，Playwright 是一個跨語言的自動化框架，除了支援 Python，也支援Java、JS 等，更加詳細的功能可以通過官方專案去解鎖! 如果你覺得文章還不錯，請大家 **點贊、分享、留言** 下，因為這將是我持續輸出更多優質文章的最強動力！