Playwright
Playwright(英語) は、オープンソースのテスト自動化フレームワークです。 Chrome、Firefox、Safari などの Web ブラウザーを自動化するための高レベル API を提供します。
新しい Playwright プロジェクトを作成する
メインメニューで へ移動します。
または、 ようこそ 画面を表示している場合は、 新規プロジェクト をクリックします。
左側のリストから Playwright を選択します。
新しいプロジェクトに名前を付け、必要に応じてその場所を変更します。
Node.js ランタイム を指定します。
Playwright をインストールするコマンドを指定します。
作成 をクリックします。
メインメニューで へ移動します。
または、 ようこそ 画面を表示している場合は、 新規プロジェクト をクリックします。
左側のリストから JVM 用 Playwright を選択します。
新しいプロジェクトに名前を付け、必要に応じてその場所を変更します。
(オプション) Git リポジトリの作成 オプションを有効にして、新しいプロジェクトをバージョン管理下に置きます。 今すぐ実行したくない場合は、後でいつでも実行できます。
使用する 言語 を選択します。
(オプション) グループ および アーティファクト パラメーターを変更します。
JDK リストから、プロジェクトで使用する JDK を選択します。
JDK がコンピューターにインストールされているが、IDE で定義されていない場合は、 JDK を追加 を選択し、JDK ホームディレクトリへのパスを指定します。
必要な JDK がコンピューターにない場合は、 JDK のダウンロード を選択します。
(オプション) サンプルコードの追加 パラメーターを有効にします。
次へ をクリックします。
作成 をクリックします。
メインメニューで へ移動します。
または、 ようこそ 画面を表示している場合は、 新規プロジェクト をクリックします。
左側のリストから Python 用 Playwright を選択します。
新しいプロジェクトに名前を付け、必要に応じてその場所を変更します。
(オプション) Git リポジトリの作成 オプションを有効にして、新しいプロジェクトをバージョン管理下に置きます。 今すぐ実行したくない場合は、後でいつでも実行できます。
環境 を新規に作成するか既存のものを使用するかを選択し、対応する設定を構成します。
リストから基本インタープリターを選択するか、
をクリックしてファイルシステム内の Python 実行可能ファイルを見つけます。場所 フィールドに新しい仮想環境の場所を指定するか、
をクリックしてファイルシステム内の場所を参照します。 新しい仮想環境のディレクトリは空である必要があります。マシン上のグローバル Python にインストールされているすべてのパッケージを、これから作成する仮想環境に追加する場合は、 ベースインタープリターからパッケージを継承する},{ チェックボックスを選択します。 この チェックボックス は、 virtualenv ツールの
--system-site-packagesオプションに対応しています。IntelliJ IDEA で Python インタープリターを作成するときにこの環境を再利用する場合は、 すべてのプロジェクトで使用可能にする チェックボックスを選択します。
詳細については、 PyCharm のドキュメントを参照してください。
ロケーション フィールドに新しい conda 環境の場所を指定するか、
をクリックしてファイルシステム内の場所を参照します。 新しい conda 環境のディレクトリは空である必要があります。リストから Python のバージョンを選択します。
IntelliJ IDEA は conda のインストールを検出します。
IntelliJ IDEA がインストールを自動的に検出しなかった場合は、conda 実行可能ファイルの場所を指定するか、
をクリックして参照します。IntelliJ IDEA で Python インタープリターを作成するときにこの環境を再利用する場合は、 すべてのプロジェクトで使用可能にする チェックボックスを選択します。
詳細については、 PyCharm のドキュメントを参照してください。
リストから基本インタープリターを選択するか、
をクリックしてファイルシステム内の Python 実行可能ファイルを見つけます。ベースバイナリディレクトリを
PATH環境変数に追加した場合、追加のオプションを設定する必要はありません。pipenv 実行可能ファイルへのパスは自動検出されます。IntelliJ IDEA が pipenv 実行可能ファイルを検出しない場合は、 pip 経由で pipenv をインストールする をクリックして、IntelliJ IDEA が自動的にインストールできるようにします。
または、 pipenv のインストール手順に従って実行可能パスを検出し、それをダイアログで指定します。
詳細については、 PyCharm のドキュメントを参照してください。
リストからインタープリターを選択します。 利用可能なインタープリターがない場合は、 インタープリターの追加 をクリックし、必要に応じてインタープリターを構成します。
作成 をクリックします。
選択したオプションに従って新しいプロジェクトが作成されます。
Playwright プロジェクトを初期化する
プロジェクトが作成されたら、初期化する必要があります。 この手順では、目的の言語を選択し、Playwright ブラウザーをインストールし、その他の設定を指定します。
プロジェクトの初期化を開始するには:
実行ツールウィンドウ Alt+4 では、キーボードの上 / 下矢印ボタンを押して、プロジェクトで使用する言語を選択します。
エンドツーエンドテストを配置するフォルダーの名前を入力します。
GitHub アクションのワークフロー(英語)を追加するかどうかを指定します。
Playwright ブラウザーをインストールするかどうかを指定します。
すべてのパラメーターを指定すると、初期化が開始されます。 プロセスが完了すると、システムから通知が届きます。
ロールベースのロケーターのサポート
Playwright では、 ロール(英語)別に要素を見つけることができます。 これにより、ボタン、チェックボックス、見出し、リンク、その他の要素など、ページ上の特定の要素を正確に特定できます。
IntelliJ IDEA はそのようなロケーターを生成してコードに追加できるため、テストで使用できます。
コードに要素を追加する
要素を追加するファイルを開きます。
右側のサイドバーの
をクリックして、 Web インスペクター ツールバーウィンドウを開きます。アドレスバーにページの URL を指定します。
「
」をクリックし、Web インスペクターで追加する要素を選択します。
要素を選択したら、「
」をクリックして要素をコードに追加します。
特定のタイプのセレクター (ID、 名前、 クラスでタグ付けするなど) を追加するには、
をクリックして必要なオプションを選択します。CSS ロケーターと XPath ロケーターの間で具体的に切り替える場合は、
をクリックして、必要なロケーター型を選択します。
その結果、コードの一部が生成され、コードエディターに追加されます。
テストの実行
テストを実行するには、テストクラスまたはテストメソッドの横にある
ガターアイコンをクリックし、リストから 実行 オプションを選択します。
あるいは、キャレットをテストクラスに置いてそのクラス内のすべてのテストを実行するか、テストメソッドにキャレットを置き、 Ctrl+Shift+F10 を押します。
実行 / デバッグ構成を使用すると、よりカスタマイズ可能な方法でテストを実行できます。 詳細については、 テストの実行 を参照してください。
見出しモードでテストを実行する
見出しモードでテストを実行すると、Playwright が Web サイトとどのように対話するかを視覚的に表現できます。
ヘッドモードでテストを実行するには:
実行 / デバッグ構成スイッチャーで現在の構成をクリックし、
をクリックして、 編集(E) オプションを選択します。
Playwright オプション フィールドに、
--headedコマンドを指定します。
変更を適用し、テストを実行します。
ヘッドモードで実行するテストが含まれているファイルを開きます。
コードに次のオプションを追加します。
launch(new BrowserType.LaunchOptions().setHeadless(false))
テストを実行します。
実行 / デバッグ構成スイッチャーで現在の構成をクリックし、
をクリックして、 編集(E) オプションを選択します。
追加引数 フィールドに、
--headedコマンドを指定します。
変更を適用し、テストを実行します。
その結果、ブラウザーが開き、テストの手順が再現されます。
テスト結果を確認する
テストの実行が終了すると、結果が 実行 ツールウィンドウの テストランナー タブに表示されます。 このタブでは、テストの再実行、テスト結果のエクスポートとインポート、各テストの実行にかかった時間を確認したり、その他のアクションを実行したりできます。
詳細については、 テスト結果を調べる を参照してください。
デバッグテスト
一般に、デバッグ手順には次の手順が含まれます。
実行を一時停止する必要があるコード行にブレークポイントを設定します。
コードをデバッグモードで実行します。
デバッグ ツールウィンドウを使用してコードを分析し、潜在的な問題を特定します。
問題を修正します。
IDE でこれらの手順を再現するには、次の手順を実行します。
ガター内で、実行可能ファイルの行にカーソルを合わせ、実行を一時停止したい場所で
をクリックします。 
ガターの
をクリックして デバッグ を選択します。 これでデバッガー セッションが開始され、コードが実行されます。 
プログラムがブレークポイントで停止すると、実行が中断され、デバッガー セッションの結果を デバッグ ツールウィンドウで確認できます。
デバッグの詳細については、「コードのデバッグ 」を参照してください。
Playwright レポートの生成
Playwright 報告者(英語)は、失敗したテストに関する詳細情報を提供するため、テスト実行中に何が起こったのかをより徹底的に分析できます。
デフォルトでは、 html レポートが生成されますが、実行 / デバッグ構成を使用して別の形式に切り替えることができます。 これを行うには、次の手順を実行します。
実行 / デバッグ構成スイッチャーで現在の構成をクリックし、
をクリックして、 編集(E) オプションを選択します。Playwright オプション フィールドで、目的の 報告者(英語)を指定します。 例:
--reporter=line変更を適用し、テストを実行します。
その結果、詳細なレポートが生成されます。
実行 / デバッグ構成を変更する
テストの起動プロパティを変更する場合は、実行 / デバッグ構成を編集します。
実行 / デバッグ構成スイッチャーで現在の構成をクリックし、 構成の編集(R)… オプションを選択します。
実行 / デバッグ構成 ダイアログで、編集する構成を選択します。
必要なスタートアッププロパティを構成します。
変更を適用して OK をクリックします。
実行/デバッグ構成の詳細については、 実行 / デバッグ構成 を参照してください。
ロケーターテンプレートをカスタマイズする
選択した要素をコードに追加する方法をカスタマイズしたい場合は、テンプレートを変更できます。
ステータスバーのフレームワーク名をクリックします。 UI オートメーションフレームワーク メニューが開きます。
テンプレートのカスタマイズ オプションを選択してください。
ファイルおよびコードテンプレート ダイアログで、リストから必要なフレームワークを選択します。
Web 要素ロケーターのコード生成アルゴリズムを書き換えます。
変更を保存するには、 OK をクリックします。
その結果、更新されたコード生成アルゴリズムに従ってロケーターがコードに追加されます。