Selenium/Appium: WD.jsで独自の関数を追加する

WD.jsはSelenium2とAppiumに対応しているnode.js向けのドライバーですが、これって独自の関数を追加できるので、この辺をちゃんと使うと便利だなと気付いたわけです。 WD.jsは使い方としてQ promises + chainingPure async等ありますが、ここではQ promises + chainingで書いてます。

こういう形で書ける方式ですね。

    return driver.get('http://www.google.co.jp')
      .waitForElementById('lst-ib')
        .type('linux')
      .waitForElementByName('btnK')
      .click()
      .saveScreenshot('001.png')
      .sleep(1500)
      .saveScreenshot('002.png')
      .nodeify(done);

この方式でつらつらと処理を書いていくのは良いのですが、途中で何かしたいときがあると思います。例えば、デバッグ時にメッセージを出したいとか。 そんな時に使えるのが独自関数の追加です。APIドキュメントを見るとcategory / JsonWireProtocol methodのところがwdのやつでaddXXXXXXMethodという感じの関数がいくつか有り、これらが関数を追加できる関数です。

例えばこんな感じで2つの関数を登録してみます。

1つ目はprintDebugLogという関数を登録しています。addPromiseChainMethod()の引数は1番目が関数名、2番目が関数本体です。やってることは引数で渡されたmsgをconsole.out()で出力するだけです。

    wd.addPromiseChainMethod(
      'printDebugLog',
      function (msg) {
        console.log(msg);
        return this;
      }
    );

2個目のは非同期のタイプで、elementのvalueを取ってきて表示するものです。getValue()はassertで使用するならelement.getValue().should.equal('hogehoge')のように書けますが、 値を取り出して何かしようと思ったらcallbackで受け取る必要があります。そのため、コールバックも受け取れるようにします。

    wd.addAsyncMethod(
      'asyncprintDebugLog',
      function (id/*, cb */) {
        var cb = wd.findCallback(arguments);

        var _this = this;
        this.waitForElementById(id)
              .getValue(function (err, value) {
                console.log('ID ' + id + '\'s ' + value);
                cb();
              });
        }
    );

これら2個の関数を途中に入れたのがこちらです。

    return driver.get('http://www.google.co.jp')
      .waitForElementById('lst-ib')
        .type('linux')
      .waitForElementByName('btnK')
      .click()
      .printDebugLog('hello, world')
      .saveScreenshot('001.png')
      .sleep(1500)
      .saveScreenshot('002.png')
      .asyncprintDebugLog('lst-ib', function () {
        console.log('ok');
      })
      .nodeify(done);

printDebugLog()は同期で動くので普通に書けますし、asyncprintDebugLog()も普通にコールバックを登録します。こんな感じで普通に独自関数を呼び出せるようになります。

このコードを動かすとこのようになります。うまく動いていますね( ´∀`)bグッ!

masami@saga:~/codes/selenium_test$ ./node_modules/.bin/mocha ./test.js


  Add function test
hello, world
ID lst-ib's linux
ok
    ✓ Add function test (3025ms)


  1 passing (5s)

今回使ったコードの完全版はこちらです。

Add extra functions to wd

入門 React ―コンポーネントベースのWebフロントエンド開発

入門 React ―コンポーネントベースのWebフロントエンド開発