近々500ページ位あるサイトのデザイン変更する案件をやることになるらしく、目視で500ページを確認してたのでは死んでしまうということで、SeleniumでSS撮りまくってビューアで確認するというとりあえず楽できそうなソリューションを試してどうなるかを試していきたいと思います。

今回はWindows7にSelenium入れてNodeでSS撮るScript作って動かすというところまでをやってみます。

ちなみに先にCentOS6.5上で同様のことをやろうとしたんだけども、firefoxの最新のドライバがおかしいのかSeleniumは動くがfirefoxがまったく動かないという現象に見まわれ丸一日無駄にしたけどWindowsに入れたらものの十分程度で動いたという話です。

JRE入れる

JREが入ってないとどうしようもないので、30億のデバイスで走るJavaを入れます。

java.com

今回はWin7 64bitなのでWindows オフライン (64ビット)を入れましょう。

Selenium Standalone Server入れる

現時点での最新版2.48.2を適当なフォルダにダウンロードします。

http://www.seleniumhq.org/download/

ついでにchromeのドライバ（chromeが嫌ならなんか好きなドライバ）もダウンロードして、パスが通ったフォルダにぶち込みます。

sites.google.com

Selenium Standalone Serverを動かす

先ほどダウンロードしたフォルダに入るかパス通すかなんかして起動します。

java -jar selenium-server-standalone-2.48.2.jar

なんかだらーっとメッセージが出てきて

RemoteWebDriver instances should connect to: http://127.0.0.1:4444/wd/hub

みたいなのが表示されるので http://127.0.0.1:4444/wd/hub にアクセスします。

アクセスすると Create Session ってボタンがあるので押すとダイアログが出るので chrome を選ぶともう一枚ブラウザが立ち上がるので、とりあえずそれが立ち上がればOKです。

WebdriverIO入れる

Nodeは入ってるとして、NodeでSeleniumを使うものとして今回はWebdriverIOを使います。

webdriver.io

npmでぶっこんでサンプルにあるコードを実行してうまく動くなら成功です。

var webdriverio = require('webdriverio');
var options = { desiredCapabilities: { browserName: 'chrome' } };
var client = webdriverio.remote(options);
 
client
    .init()
    .url('https://duckduckgo.com/')
    .setValue('#search_form_input_homepage', 'WebdriverIO')
    .click('#search_button_homepage')
    .getTitle().then(function(title) {
        console.log('Title is: ' + title);
        // outputs: "Title is: WebdriverIO (Software) at DuckDuckGo"
    })
    .end();