Seleniumでの要素取得で、デベロッパーツールには存在して、htmlソースには存在しないデータをどうやって取得するのか

Question

とあるサービスをスクレイピングしようとしたところ、

• Chromeのデベロッパーツールでは表示される
• HTMLをダウンロードしても存在しない

という要素があり、その要素の取得方法がわからず困っています。

from selenium import webdriver
import pyperclip

path = "chromedriver.exe"
driver = webdriver.Chrome(executable_path=path, options=options)
url = url
driver.get(url)
source = driver.page_source
pyperclip.copy(source)

取得したい要素は、デベロッパーツールでは確認できるのですが、上記コードのsourceには入っていませんでした。

デベロッパーツールで、その直前のHTMLタグを見ると

#shadow-root(open) == $0

という記載が確認できました。

色々と調べると、該当するサービスはgatsbyを使ってビルドしているそうです。

どのようにすれば、デベロッパーツールでのみ確認できる要素を取得できるのでしょうか？

一部サイトではheadlessモードで取得できるとあったので、そのようにしましたが、それでは、、取得できませんでした。

漠然とした質問で申し訳ないです。

こういうことを勉強したら、答えにたどり着けるよ、とか、seleniumのこういうメソッドがあるよ、というレベルの回答でもよいので、教えていただけると嬉しいです。

Answer 1

ページのHTMLを取得後に、JavaScriptでノードを追加しています。
ブラウザの「ソースを表示」は、最初に取得したHTMLを表示して、開発者ツールは追加後の今画面で見ているものに対応するHTMLを表示します。
Seleniumは、その「追加後の今画面で見ているものに対応するHTML」を取得するので、driver.page_sourceは開発者ツールの内容と一致するはずですが、getの直後に取得しているので、その時点でまだJavaScriptの実行が終わっていないのでしょう。
get後に数秒待って取得してみましょう。もしくは、「このノードが見つかるまで待つ」のようにするか。