それマグで!

知識はカップより、マグでゆっくり頂きます。 takuya_1stのブログ

習慣に早くから配慮した者は、 おそらく人生の実りも大きい。

chrome(webdriver)を headless はリサイズできないので、初期値で決めて解決させる

headless で動かしてる chrome でエラーが出る。

最初、なんのエラーかわからず悶絶してた。理由がわかったので書いておきます。

リサイズすると次のようなエラーに

driver.manage.window.resize_to(1200,1200)

エラー

Selenium::WebDriver::Error::UnknownError: unknown error: cannot get automation extension
from unknown error: page could not be found: chrome-extension://aapnijgdinlhnhlmodcfapnahmbfebeb/_generated_background_page.html
  (Session info: headless chrome=61.0.3114.0)
  (Driver info: chromedriver=2.29.461585 (0be2cd95f834e9ee7c46bcc7cf405b483f5ae83b),platform=Mac OS X 10.11.6 x86_64)
from /Users/takuya/.rbenv/versions/2.3.3/lib/ruby/gems/2.3.0/gems/selenium-webdriver-3.4.0/lib/selenium/webdriver/remote/response.rb:69:in `assert_ok'

なぜリサイズが必要だったのか?

とあるサイトが、レスポンシブ・デザイン(笑)になっていて、Widthにより、コンテンツの表示内容が変化する。そのためボタンがクリックできずに、 stale エラーやnot clickable で落ちてた。

headless chrome のデフォルトウインドウサイズ 800x600

Chromeのheadless は 次のようになっている。

>> driver.execute_script('return window.innerHeight;')
=> 600
>> driver.execute_script('return window.innerWidth;')
=> 800
>>

これでは、モバイルサイトや、タブレット配置にされちゃいますよね。スマホサイトは無駄にクリックと遷移がおおく、スクレイピングに向かないので不便。

初期値を投入してリサイズの代用にする。

chrome の起動オプションに「ウインドウサイズの指定」があるのでコレを活用することで問題はほとんど解決しますね。

  caps = Selenium::WebDriver::Remote::Capabilities.chrome(
    "chromeOptions" => {
      "args" => [
        "--headless", #headlessにすると動かない・・・
        "--window-size=1280,800", # width 入れると解決する。

起動オプション設定後のウインドウの高さと幅

縦横のサイズは次のようになったので、無事解決しました。

>> driver.execute_script('return window.innerHeight;')
=> 1200
>> driver.execute_script('return window.innerWidth;')
=> 800
>>

Chrome の headlessで落ちてた原因は殆どが、モバイルサイト落ち

PCサイトでデザインした、ClickやSubmitが動かない原因の大半が、モバイルサイト落ちになって発生していた。

ボタンが見つからない、Staleされる、not clickable などになる。頭のなかで、PCサイトを想定していると迷う。デバッガでみるとちゃんと要素はあるのに、クリックが出来ない。

クリック出来ない理由がわからず、悶絶して苦悩することになった。

レスポンシブデザインは気づかずに導入されてるので注意が必要だった。

どうでもいいけど。

レスポンシブデザインって、モバイル・PCでガッツリとデザインを変えるんじゃなくて、もともと目指してたのは要素を横長から縦長に再配置して、同じように見せてアクセシビリティを確保するんじゃなかったのか。

いつの間にか、ガッツリデザインをかえてメニュー項目を展開メニューに折りたたんだりしてるんだよね。そもそも使いにくいのでやめてほしい。そこまでやるなら、もう別サイト・別HTMLでデザインした方がいいよね。。。。