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

テストの生成

はじめに​

Playwrightには、テストをすぐに生成できる機能が備わっており、テストを迅速に開始するのに最適な方法です。テストしたいウェブサイトを操作するブラウザウィンドウと、テストの記録、コピー、クリア、言語の変更ができるPlaywrightインスペクターウィンドウの2つのウィンドウが開きます。

学習内容

Codegenの実行​

codegenコマンドを使用してテストジェネレーターを実行し、その後にテストを生成したいウェブサイトのURLを指定します。URLは任意であり、URLなしでコマンドを実行し、後でブラウザウィンドウに直接URLを追加することも可能です。

playwright codegen demo.playwright.dev/todomvc

テストの記録​

codegenを実行し、ブラウザでアクションを実行します。Playwrightはユーザーの操作に対応するコードを生成します。Codegenはレンダリングされたページを解析し、ロール、テキスト、テストIDロケーターを優先して推奨されるロケーターを特定します。ジェネレーターがロケーターに一致する複数の要素を識別した場合、ロケーターを改善して、堅牢性を高め、ターゲット要素を一意に識別できるようにします。これにより、ロケーターによるテストの失敗や不安定さを排除・軽減します。

テストジェネレーターでは、以下を記録できます。

  • ページを操作するだけで、クリックや入力などのアクション
  • ツールバーのアイコンの1つをクリックし、次にアサート対象のページ上の要素をクリックすることで、アサーションを記録します。以下を選択できます。
    • 'assert visibility' で要素が表示されていることをアサート
    • 'assert text' で要素が特定のテキストを含むことをアサート
    • 'assert value' で要素が特定の値を持つことをアサート

recording a test

​

ページの操作が終了したら、「record」ボタンを押して記録を停止し、「copy」ボタンを使用して生成されたコードをエディターにコピーします。

「clear」ボタンを使用してコードをクリアし、再度記録を開始します。完了したら、Playwrightインスペクターウィンドウを閉じるか、ターミナルコマンドを停止します。

テストの生成についてさらに詳しく学ぶには、Codegenの詳細ガイドを参照してください。

ロケーターの生成​

テストジェネレーターでロケーターを生成できます。

  • 「Record」ボタンを押して記録を停止すると、「Pick Locator」ボタンが表示されます。
  • 「Pick Locator」ボタンをクリックし、ブラウザウィンドウ内の要素にカーソルを合わせると、各要素の下にロケーターがハイライト表示されます。
  • ロケーターを選択するには、目的の要素をクリックすると、そのロケーターのコードが「Pick Locator」ボタンの隣にあるロケータープレイグラウンドに表示されます。
  • その後、ロケータープレイグラウンドでロケーターを編集して微調整し、一致する要素がブラウザウィンドウでハイライト表示されるのを確認できます。
  • コピーボタンを使用してロケーターをコピーし、コードに貼り付けます。
​

picking a locator

エミュレーション​

特定のビューポート、デバイス、カラースキーム用のテストを生成したり、地理位置情報、言語、タイムゾーンをエミュレートしたりするために、エミュレーションを使用してテストを生成することもできます。テストジェネレーターは、認証状態を維持しながらテストを生成することも可能です。テストジェネレーターガイドで詳細を確認してください。

次へ​