PythonのSelenium WebDriverで特定要素のスクリーンショットを撮影する方法

Selenium WebDriverを使用すると、ページ全体ではなく、特定の要素だけを切り取った「部分的なスクリーンショット」を簡単に撮影できます。

特定の要素のスクリーンショットを取得するには、まずid、name、class名などのロケーター（XPathやCSSセレクターなど）を使って、対象となるWeb要素を特定する必要があります。

次に、そのWeb要素に対してscreenshot()メソッドを呼び出し、引数として拡張子付きの画像ファイル名を渡します。これにより、プロジェクトフォルダ内にその要素のスクリーンショットを含む新しい画像ファイルが作成されます。

構文

l=driver.find_element_by_xpath("//img[@title='Tutorialspoint']")
l.screenshot("logo.png")

ここでは、Webページに表示されているロゴ画像のスクリーンショットを取得する例を見てみましょう。

コード実装例

from selenium import webdriver
driver = webdriver.Chrome (executable_path="C:\\chromedriver.exe")
driver.maximize_window()
driver.get("https://www.tutorialspoint.com/index.htm")
# スクリーンショットを撮影する対象の要素を特定
l=driver.find_element_by_xpath("//img[@title='Tutorialspoint']")
# screenshotメソッドでスクリーンショットを撮影
l.screenshot("logo.png")

実行結果

コードを実行すると、プロジェクトフォルダに「logo.png」というファイルが作成され、指定した要素（この例ではロゴ画像）のスクリーンショットが保存されます。

補足：Selenium 4以降の書き方

なお、Selenium 4以降ではfind_element_by_xpath()は非推奨（deprecated）となっています。最新バージョンでは、find_element()メソッドとByクラスを組み合わせた以下の書き方が推奨されています。

from selenium import webdriver
from selenium.webdriver.common.by import By

driver = webdriver.Chrome()
driver.maximize_window()
driver.get("https://www.tutorialspoint.com/index.htm")

# By.XPATHを使って要素を特定
l = driver.find_element(By.XPATH, "//img[@title='Tutorialspoint']")
l.screenshot("logo.png")

この方法でも同様に、指定した要素だけのスクリーンショットをPNG形式で保存できます。ボタンやフォーム、テーブルなど、任意の要素に応用可能なので、UIテストの証跡取得やデバッグ作業に非常に便利です。