tapitapi’s blog

1日1杯タピオカ!エンジニア

【Selenium】ページ全体のscreenshotを取得

SeleniumのWebDriverを使用して、save_screenshot関数でサイトのスクリーンショットを撮る際に、表示されている画面のスクリーンショットしか撮影できない、、、

 

ページ全体のスクリーンショットを撮りたいなと思い、下記を参考にしましたが、うまくいきませんでした。(自分の勉強不足で何かミスしてるせいだと思います、、)

 

qiita.com

 

今回、私はもっと簡単な方法で実装したので、紹介させていただきます。

 

方法1:複数のスクリーンショットを取得して対応

# 1. ページを最上部を表示した時に、画面の下端に表示される要素(name="element1"という要素を仮定)を取得

element = self.driver.find_element_by_name('element1')

 

# 2. 取得した要素が画面の下端に来るようにスクロール
self.driver.execute_script("arguments[0].scrollIntoView(false);", element)

 

# 3. スクリーンショットを取得
self.driver.save_screenshot( 'result_1.png')

 

# 4. 取得した要素が画面の上端に来るようにスクロール
self.driver.execute_script("arguments[0].scrollIntoView(true);", element)

 

# 5. スクリーンショットを取得
self.driver.save_screenshot( 'result_2.png')

 

# 6. 5.のスクリーンショットの下端に表示される要素を取得、scrollIntoView(false)でスクロール、スクリーンショットを取得....

 

ページの一番下がスクリーンショットできるまで上記をループ 

 

スクリーンショットを複数撮ることになってしまいますが、上記で実装できました。

 

方法2:画面を縮小して対応

# 1. 画面を縮小(今回は画面を50%に縮小)

self.driver.execute_script("document.body.style.zoom='50%'")

 

# 2. スクリーンショットを取得
self.driver.save_screenshot( 'result_1.png')

 

この方法では、スクリーンショット1枚で済みます。

ただ問題点は、下記2点

*縦長のページだと、文字などがとても小さくなってしまう。

*画面を縮小した後に、ページ遷移しない限り、WebDriver のclickやfindElementなどの関数が使用できない。

 

 

もっといい方法が見つかれば、更新しようと思います。

 

おやすみなさいいいい