メインコンテンツにスキップ

インストール

はじめに

Playwright Testは、エンドツーエンドテストのニーズに合わせて特別に作成されました。Playwrightは、Chromium、WebKit、Firefoxを含むすべての最新レンダリングエンジンをサポートしています。Windows、Linux、macOS上で、ローカルまたはCI上で、ヘッドレスまたはヘッド付きで、Google Chrome for AndroidおよびMobile Safariのネイティブモバイルエミュレーションを使用してテストを実行できます。

学習内容

Playwrightのインストール

npm、yarn、またはpnpmを使用してPlaywrightをインストールすることから始めましょう。または、VS Code拡張機能を使用してテストを開始および実行することもできます。

npm init playwright@latest

インストールコマンドを実行し、以下の項目を選択して始めましょう

  • TypeScriptまたはJavaScriptを選択(デフォルトはTypeScript)
  • テストフォルダーの名前(デフォルトはtests、プロジェクトにtestsフォルダーが既に存在する場合はe2e
  • CIで簡単にテストを実行するためのGitHub Actionsワークフローを追加
  • 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フォルダーには、テストを開始するのに役立つ基本的なサンプルテストが含まれています。より詳細な例については、TODOアプリをテストするために書かれたテストが含まれているtests-examplesフォルダーを確認してください。

サンプルテストの実行

デフォルトでは、テストはChromium、Firefox、WebKitの3つのブラウザすべてで、3つのワーカーを使用して実行されます。これはplaywright.configファイルで設定できます。テストはヘッドレスモードで実行されるため、テスト実行時にブラウザは開きません。テスト結果とテストログはターミナルに表示されます。

npx playwright test

コマンドラインで実行されているテスト ヘッド付きモードでのテスト実行、複数のテスト実行、特定のテスト実行など、テスト実行の詳細については、テストの実行に関するドキュメントを参照してください。

HTMLテストレポート

テストが完了すると、HTMLレポートが生成され、ブラウザ、合格したテスト、失敗したテスト、スキップされたテスト、不安定なテストでレポートをフィルタリングできる完全なテストレポートが表示されます。各テストをクリックして、テストのエラーや各ステップを確認できます。デフォルトでは、一部のテストが失敗した場合、HTMLレポートは自動的に開かれます。

npx playwright show-report

HTML Report

UIモードでのサンプルテストの実行

タイムトラベルデバッグ、ウォッチモードなど、より良い開発者エクスペリエンスのためにUIモードでテストを実行しましょう。

npx playwright test --ui

UI Mode

UIモードの機能の詳細については、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、20、または22の最新バージョン。
  • Windows 10以降、Windows Server 2016以降、またはWindows Subsystem for Linux (WSL)。
  • macOS 14 Ventura以降。
  • Debian 12、Ubuntu 22.04、Ubuntu 24.04 (x86-64およびarm64アーキテクチャ)。

次は何をしますか