Skip to main content

安裝

簡介​

Playwright Test 是專為滿足端到端測試需求而建立的。Playwright 支援所有現代渲染引擎，包括 Chromium、WebKit 和 Firefox。在 Windows、Linux 和 macOS 上進行測試，可以是本地或 CI 上，無頭或有頭，並具有 Google Chrome for Android 和 Mobile Safari 的原生行動模擬。

你將學到

安裝 Playwright​

開始安裝 Playwright，可以使用 npm、yarn 或 pnpm。或者，你也可以開始並使用 VS Code 擴充套件 執行你的測試。

npm init playwright@latest

執行安裝命令並選擇以下項目以開始:

  • 選擇 TypeScript 或 JavaScript (預設為 TypeScript)
  • 測試資料夾的名稱 (預設為 tests 或 e2e，如果你的專案中已經有一個 tests 資料夾)
  • 添加 GitHub Actions 工作流程以便在 CI 上輕鬆執行測試
  • 安裝 Playwright 瀏覽器 (預設為 true)

安裝了什麼​

Playwright 會下載所需的瀏覽器並建立以下檔案。

playwright.config.ts
package.json
package-lock.json
tests/
  example.spec.ts
tests-examples/
  demo-todo-app.spec.ts

playwright.config 是您可以為 Playwright 添加配置的地方，包括修改您希望在其上執行 Playwright 的瀏覽器。如果您在已存在的專案內執行測試，那麼相依套件將直接添加到您的 package.json 中。

tests 資料夾包含一個基本的範例測試，以幫助你開始進行測試。欲了解更詳細的範例，請查看 tests-examples 資料夾，其中包含用於測試待辦事項應用程式的測試。

執行這個範例測試​

預設情況下，測試將在所有 3 個瀏覽器（chromium、firefox 和 webkit）上使用 3 個工作者執行。這可以在 playwright.config file 中配置。測試在無頭模式下執行，這意味著在執行測試時不會打開瀏覽器。測試結果和測試日誌將顯示在終端機中。

npx playwright test

tests running in command line 查看我們的文件以了解更多關於在有頭模式下執行測試、執行多個測試、執行特定測試等資訊。

HTML 測試報告​

完成測試後，將生成一個 HTML 報告器，它會顯示測試的完整報告，允許你按瀏覽器、通過的測試、失敗的測試、跳過的測試和不穩定的測試來篩選報告。你可以點擊每個測試，探索測試的錯誤以及測試的每一步。預設情況下，如果某些測試失敗，HTML 報告會自動打開。

npx playwright show-report

HTML Report

執行範例測試在 UI 模式下​

執行你的測試與 UI Mode，以獲得更好的開發者體驗，包括時間旅行除錯、監看模式等。

npx playwright test --ui

UI Mode

請查看我們的UI 模式詳細指南以了解更多其功能。

更新 Playwright​

要更新 Playwright 到最新版本，執行以下命令:

npm install -D @playwright/test@latest
# Also download new browser binaries and their dependencies:
npx playwright install --with-deps

您可以隨時透過執行以下命令來檢查您擁有的 Playwright 版本:

npx playwright --version

系統需求​

  • Node.js 18+
  • Windows 10+, Windows Server 2016+ 或 Windows Subsystem for Linux (WSL)。
  • macOS 13 Ventura, 或 macOS 14 Sonoma。
  • Debian 11, Debian 12, Ubuntu 20.04 或 Ubuntu 22.04, Ubuntu 24.04, 支援 x86-64 和 arm64 架構。

接下來是什麼​