取得したHTMLだけでは値が見つからず、画面の操作が必要な場合は、ブラウザーでどんな変化が起きるかを確認します。Playwrightなら、ページを開く、ボタンを押す、結果の要素を読む、という流れをPythonから試せます。
初回は自分で作ったHTMLを新しいブラウザーコンテキストで開きます。操作の後に期待する要素を確認してから、結果を読む形にすると、クリックが通っただけで成功としなくて済みます。
通信しない練習用のページ
次の内容をplaywright-example.htmlとしてUTF-8で保存します。クリックでリストへ一項目を追加する架空のページです。
<!doctype html>
<html lang="ja">
<head><meta charset="utf-8"><title>資料リストの練習</title></head>
<body>
<button type="button" id="add">資料を表示</button>
<ul id="documents"></ul>
<script>
document.querySelector('#add').addEventListener('click', () => {
document.querySelector('#documents').innerHTML = '<li>資料1</li>';
});
</script>
</body>
</html>PlaywrightのPythonパッケージと、それに対応するブラウザーが使える環境を前提にします。パッケージをimportできることと、ブラウザーの実行ファイルが用意されていることは別です。環境を新しく整える場合は、公式の導入手順で確認します。
結果を確認して画像に残す
次をHTMLと同じフォルダーから実行します。既存のplaywright-check.pngを上書きしない例です。
from pathlib import Path
from playwright.sync_api import sync_playwright, expect
output = Path("playwright-check.png")
if output.exists():
raise FileExistsError(output)
with sync_playwright() as p:
browser = p.chromium.launch(headless=True)
context = browser.new_context(viewport={"width": 800, "height": 500})
try:
page = context.new_page()
page.goto(Path("playwright-example.html").resolve().as_uri())
page.get_by_role("button", name="資料を表示").click()
result = page.get_by_role("listitem")
expect(result).to_have_text("資料1")
print(page.title(), result.inner_text())
page.screenshot(path=str(output), full_page=True)
finally:
context.close()
browser.close()期待する出力は「資料リストの練習 資料1」です。この例はPython 3.12.10、Playwright 1.58.0と既存のChromium 145でローカル実行し、保存画像にボタンと資料1が写ることも確認しました。スクリーンショットを保存した事実だけでなく、要素の文字を照合している点を確認します。
get_by_roleは、ボタンやリスト項目などの役割と名前を手がかりに要素を指定します。複数の要素が同じ条件に一致する場合は、どの領域の要素かを絞ります。先頭を無条件に選ぶ方法では、ページ変更時の取り違えを見落とすことがあります。
新しいコンテキストで確認する理由
browser.new_contextは、独立したブラウザーコンテキストを作ります。この例は普段のユーザープロファイルを指定せず、保存済みのログイン状態も読み込みません。練習用ページをどう操作したかを、いつもの閲覧状態に依存せず確認できます。
finallyではコンテキストとブラウザーを閉じます。途中で期待する文字が出なかった場合にも、終了処理へ進むための構成です。失敗した結果を読み取ったことにして処理を続ける例ではありません。
実際の取得先へ移る前に
クリックが必要に見えても、公式APIやデータ配布が用意されている場合があります。取得元が認める方法と対象範囲を確認してから、通信先を変えます。
実ページではページの読み込みと、必要なデータが表示された状態を分けます。結果の見出し、件数、更新後の文字など、そのページに合う条件を選びます。送信や購入を伴うボタンは、この練習用ボタンと同じ扱いで操作しないようにします。
関連する作業
Playwrightの別の入門例と、HTML取得だけで済む場合の方法を比較できます。
