ブラウザを自動操作してユーザテストを行う｜Playwrightとは？非エンジニアにも分かりやすく徹底解説

Contents

Playwrightって何？まずはざっくり理解しよう
Playwrightが選ばれる3つの理由
インストール方法：3ステップで準備完了
はじめての自動操作：Googleで検索してみよう
実践！フォームへの入力とボタンクリックを自動化する
pytest と組み合わせてE2Eテストをもっと便利に
知っておきたい便利な機能3選
まとめ：Playwright で何ができる？要点整理
- 他のツールとの比較
- Playwrightを使い始めるための3ステップ

Playwrightって何？まずはざっくり理解しよう

browser automation testing / Photo by Jakub Zerdzicki via Pexels

「ブラウザを自動で操作してテストする」と聞いて、どんなイメージが浮かびますか？難しそう…と感じた方も大丈夫です！今回紹介する Playwright（プレイライト） は、Microsoftが開発したブラウザ自動操作ライブラリで、Pythonからも簡単に使えます。

Playwrightを使うと、人間が手動でやっていた「ブラウザを開く→URLを入力→ボタンをクリック→結果を確認する」という一連の操作をコードで自動化できます。これを E2E（End-to-End）テスト と呼びます。

💡 E2Eテストとは？
アプリの「入口（ユーザー操作）」から「出口（結果の確認）」まで、実際のブラウザを使って一気通貫でテストする手法です。

Playwrightが選ばれる3つの理由

テスト自動化ツールには Selenium や Cypress など多くの選択肢がありますが、なぜ今 Playwright が注目されているのでしょうか？

① 複数ブラウザを1つのコードで操作できる

Chrome・Firefox・Safari（WebKit）の3大ブラウザに対応しています。1つのテストコードを書くだけで、すべてのブラウザで動作確認できるのは大きなメリットです。

② 非同期処理に強く、待ち時間を自動で調整してくれる

Webページは非同期で要素が読み込まれることが多いですが、Playwrightは要素が表示されるまで自動で待機してくれます。「要素が見つからない」というエラーに悩まされることがグッと減ります。

③ Pythonで書けてインストールも簡単

PythonのパッケージとしてPyPI（パイパイ）から1コマンドでインストールできます。JavaScriptの知識がなくても使えるので、Python入門者にも取り組みやすいツールです。

インストール方法：3ステップで準備完了

Playwrightのセットアップはとても簡単です。以下の手順で進めましょう。

ステップ1：pipでインストール

# Playwrightライブラリのインストール
pip install playwright

ステップ2：ブラウザのインストール

# Chromium・Firefox・WebKitをまとめてインストール
python -m playwright install

このコマンドを実行すると、テスト用のブラウザが自動でダウンロードされます。しばらく時間がかかりますが、待つだけでOKです。

ステップ3：インストール確認

# バージョン確認でインストールが成功したか確認
python -c "from playwright.sync_api import sync_playwright; print('OK')"
# → OK と表示されればインストール成功！

はじめての自動操作：Googleで検索してみよう

インストールが完了したら、さっそく動かしてみましょう！最初のサンプルとして、Googleで検索してスクリーンショットを撮るコードを書いてみます。

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    # Chromiumブラウザを起動（headless=Falseにすると画面が表示される）
    browser = p.chromium.launch(headless=False)
    page = browser.new_page()

    # Googleにアクセス
    page.goto("https://www.google.com")

    # 検索ボックスに「Playwright Python」と入力してEnter
    page.fill("textarea[name='q']", "Playwright Python")
    page.keyboard.press("Enter")

    # 検索結果が表示されるまで待機
    page.wait_for_load_state("networkidle")

    # スクリーンショットを保存
    page.screenshot(path="search_result.png")
    print("スクリーンショットを保存しました！")

    browser.close()

このコードを実行すると、ブラウザが自動で起動してGoogle検索を行い、search_result.png というファイルに結果画面が保存されます。まるで魔法みたいですよね！

💡 ポイント：headless モードとは？
headless=True（デフォルト）にすると、ブラウザの画面が表示されずバックグラウンドで動作します。サーバー上で自動実行する場合はこちらが便利です。

実践！フォームへの入力とボタンクリックを自動化する

次は、ログインフォームへの入力という、実務でよく使うシナリオに挑戦してみましょう。ここでは架空のサイトを例にした擬似コードですが、実際のサイトURLとセレクタを変えればそのまま使えます。

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.chromium.launch(headless=False)
    page = browser.new_page()

    # テスト対象のログインページにアクセス
    page.goto("https://example-shop.com/login")

    # メールアドレスを入力
    page.fill("input[name='email']", "test@example.com")

    # パスワードを入力
    page.fill("input[name='password']", "securepassword123")

    # ログインボタンをクリック
    page.click("button[type='submit']")

    # ページ遷移を待機
    page.wait_for_url("**/dashboard")

    # ログイン後のページタイトルを確認
    title = page.title()
    print(f"現在のページタイトル: {title}")

    # 期待するタイトルかどうかを確認（簡易アサーション）
    assert "ダッシュボード" in title, "ログインに失敗しました！"
    print("✅ ログインテスト：成功！")

    browser.close()

assert 文を使うと、「期待した結果になっているか」を自動でチェックできます。条件が満たされない場合はエラーが発生するので、テストの合否判定として使えます。

pytest と組み合わせてE2Eテストをもっと便利に

Playwrightは Pythonのテストフレームワーク pytest と組み合わせるとさらに強力になります。pytest-playwright プラグインを使うと、テストコードがスッキリ書けます。

# pytest-playwrightのインストール
pip install pytest-playwright

インストールしたら、以下のようにテストファイルを作成します。

# test_login.py というファイル名で保存
import pytest
from playwright.sync_api import Page, expect

def test_page_title(page: Page):
    """ページタイトルが正しいかテスト"""
    page.goto("https://playwright.dev/")
    # タイトルに "Playwright" が含まれることを確認
    expect(page).to_have_title("Fast and reliable end-to-end testing for modern web apps | Playwright")

def test_get_started_link(page: Page):
    """'Get Started'リンクが存在するかテスト"""
    page.goto("https://playwright.dev/")
    # 「Get started」テキストを持つリンクをクリック
    page.get_by_role("link", name="Get started").click()
    # クリック後のURLを確認
    expect(page).to_have_url("https://playwright.dev/docs/intro")

# テスト実行コマンド（ターミナルで実行）
# pytest test_login.py --headed
# ※ --headed オプションでブラウザを表示しながらテスト実行

pytest と組み合わせると、複数のテストをまとめて実行・管理しやすくなります。CI/CDパイプライン（自動デプロイの仕組み）への組み込みも簡単です。

知っておきたい便利な機能3選

① コード自動生成（codegen）機能

「セレクタの書き方がわからない…」という方に朗報です！Playwrightには操作を録画してコードを自動生成する codegen 機能があります。

# codegenを起動（URLを指定すると自動でブラウザが開く）
python -m playwright codegen https://www.google.com

# → ブラウザが起動し、手動操作を記録
# → 操作内容がリアルタイムでPythonコードとして表示される！

実際にマウスで操作するだけで、そのままコピペして使えるテストコードが生成されます。プログラミング初心者でもテストが書きやすい、非常に便利な機能です。

② スクリーンショットと動画記録

テスト失敗時に「どこで失敗したのか」を視覚的に確認できるよう、スクリーンショットや動画記録も簡単に設定できます。

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    browser = p.chromium.launch()
    # 動画記録を有効化
    context = browser.new_context(
        record_video_dir="videos/",       # 動画の保存先フォルダ
        record_video_size={"width": 1280, "height": 720}
    )
    page = context.new_page()
    page.goto("https://example.com")

    # 操作中に任意のタイミングでスクリーンショット
    page.screenshot(path="screenshots/step1.png", full_page=True)

    # コンテキストを閉じると動画が保存される
    context.close()
    browser.close()
    print("動画とスクリーンショットを保存しました！")

③ モバイル端末のエミュレーション

スマートフォンでの表示確認も簡単です。デバイス設定を指定するだけでモバイル端末をエミュレートできます。

from playwright.sync_api import sync_playwright

with sync_playwright() as p:
    # iPhone 13のエミュレーション設定を取得
    iphone_13 = p.devices["iPhone 13"]

    browser = p.chromium.launch()
    context = browser.new_context(**iphone_13)
    page = context.new_page()

    page.goto("https://example.com")
    page.screenshot(path="mobile_view.png")
    print("モバイル表示のスクリーンショットを保存しました！")

    browser.close()

レスポンシブデザインのテストもこれ一本で完結できます。

まとめ：Playwright で何ができる？要点整理

ここまでの内容をまとめると、Playwright は「ブラウザ操作の自動化＋テストの自動化」を Python で手軽に実現できる強力なツールです。最後に要点を整理しましょう。

機能	内容	難易度
ブラウザ自動操作	クリック・入力・スクロールなどを自動化	⭐️
E2Eテスト	ユーザー操作から結果確認まで一括テスト	⭐️⭐️
スクリーンショット	任意のタイミングで画面を画像保存	⭐️
動画記録	テスト実行の様子を動画で記録	⭐️⭐️
codegen（コード自動生成）	手動操作からテストコードを自動生成	⭐️
モバイルエミュレーション	スマホ表示を再現してテスト	⭐️⭐️
pytest連携	テストフレームワークと組み合わせて管理	⭐️⭐️⭐️

他のツールとの比較

ツール	開発元	Python対応	複数ブラウザ対応	学習コスト
Playwright	Microsoft	✅	✅（Chrome/Firefox/Safari）	低〜中
Selenium	オープンソース	✅	✅	中
Cypress	Cypress.io	❌（JS専用）	✅	中
Puppeteer	Google	❌（JS専用）	△（主にChrome）	低