【Appium】モバイルSafari上でテストを実行してみた


先日、iOSでAppiumを試してみたんですが、今回はiOSでやってみました。
[Appiumに手を出してみた ~ Android ~](http://qiita.com/toguri/items/40a639711c8fdbd2510a)

# お題
実機／シミュレータ上でモバイルSafariを起動しテストを実施する。

# Appiumって？
[Appium](http://appium.io/)とは、iOSおよびAndroidプラットフォーム上で動く
- ネイティブアプリ
- モバイルウェブサービス
- ハイブリッドアプリ
等を自動化するオープンソースのツールです。

よくまとめられている[コチラの記事](http://qiita.com/k5n/items/899cf40a0021a6a92efd)をご参照ください。

## Design（公式）
http://appium.io/slate/en/master/?ruby#appium-design

## Concepts（公式）
http://appium.io/slate/en/master/?ruby#appium-concepts


# なぜ必要に？
現在、広告配信タグ（モバイルウェブサービス用）のE2Eテストに[Nightmare](http://www.nightmarejs.org/)を使用しています。
しかし、 **モバイルSafariでしか発生しない事象** （Mac Safariでも再現しない）にぶち当たり、実機（シミュレータ）を使用したE2Eテストの必要性が出てきました。
また、せっかくなら広告配信SDK（ネイティブアプリ用）のテストにも使っていきたいと思い。
そこで、SeleniumぽくてWebDriberの流れを組むやつをチームメンバーに紹介されたので試してみました。

# Appium環境を構築するさいにiOSで注意すべきこと
- Mac環境のあるサーバーをたてないと**実機／シミュ−レーター**でのテストができない
- Xcode8に対応していない（時間の問題なんだろけど）

## 必要な条件
http://appium.io/slate/en/master/?javascript#requirements

# Appiumサーバを用意する

## CUIでやるなら
githubから[appium](https://github.com/appium/appium)をcloneしてくる。

その上で下記からOS毎のセットアップにうつる
http://appium.io/slate/en/master/?javascript#appium-platform-support


僕はなかなかうまくいかなくて・・・・

## GUIでやってみる
githubで生成するよりも、GUI版をダウソしてくると少しバージョンが古い。
[実践 Appium](http://amzn.to/2hFsKiW)で紹介されているバージョンに近いのはこっち。

### ダウソ
[latest version](https://bitbucket.org/appium/appium.app/downloads/appium.dmg)をダウンロードする

### Appium GUIを起動
v1.5.3のAppium GUIを起動してみた。

![スクリーンショット 2016-12-15 02.06.49.png](https://qiita-image-store.s3.amazonaws.com/0/4107/6f26d9f6-9060-71f1-cc78-6c616fff6456.png "スクリーンショット 2016-12-15 02.06.49.png")

### Appium GUIの設定

- Basic
	- **Device Settings** でiOS用シミューレータの名称とOSバージョンを入力する（Xcode上から確認可能）
![スクリーンショット 2016-12-15 02.08.23.png](https://qiita-image-store.s3.amazonaws.com/0/4107/86a75f0c-85cb-4371-a193-3b6d587b771c.png "スクリーンショット 2016-12-15 02.08.23.png")

- Adbanced
 - **XcodePath** Xcodeを複数入れている場合は使用するやつに変更する
![スクリーンショット 2016-12-15 02.08.32.png](https://qiita-image-store.s3.amazonaws.com/0/4107/d5cf983d-2799-e46a-ec5f-87e67dfaa7bc.png "スクリーンショット 2016-12-15 02.08.32.png")

### Appium GUIよりAppiumサーバを起動
`Launch` ボタンをタップする。ダーッと出てくるので待つ。

### テストを実行する
下記動かせるように適当にNode.js環境を整備した上で、`mocha` で動かしてみてください。
[元ネタ](https://github.com/appium/sample-code)は、関数を分割してしまっているのですが、見通しを良くするために僕のお試し版は、下記をご覧の通り1つの関数に全部つめこんじゃいました。

```
"use strict";

var wd = require("wd");

require('colors');
var chai = require("chai");
var chaiAsPromised = require("chai-as-promised");
chai.use(chaiAsPromised);
var should = chai.should();
chaiAsPromised.transferPromiseness = wd.transferPromiseness;

describe("ios safari", function () {
  this.timeout(300000);
  var driver;

  before(function () {
    var serverConfig = {
      host: 'localhost',
      port: 4723
    };

    driver = wd.promiseChainRemote(serverConfig);

    var desired = {
      browserName: 'safari',
      'appium-version': '1.6',
      platformName: 'iOS',
      platformVersion: '9.3',
      deviceName: 'iPhone 6s',
      app: undefined
    };
    return driver.init(desired);
  });

  after(function () {
    return driver
      .quit();
  });

  it("should get the url", function () {
    return driver
      .get('https://www.google.com')
      .sleep(1000)
      .waitForElementById('lst-ib')
      //.waitForElementByName('q', 5000)
        .type('cyberagent')
      .waitForElementByClassName('kpgrb')
      //.waitForElementByName('btnGNS')
        .click()
      .waitForElementByLinkText('サイバーエージェント')
        .click()
      .sleep(5000)
      .saveScreenshot('test.png');
  });

});
```
https://github.com/toguri/sample-code/blob/master/sample-code/examples/node/ios-safari-google.js

## その他

- [Mobile JSON Wire Protocolo Specification](https://github.com/SeleniumHQ/mobile-spec/blob/master/spec-draft.md)
- [wd](https://github.com/admc/wd) A node.js client for webdriver/selenium 2.



## 締め
まだ、うまくテストコードが書けてないけど、テストを実行するとシミュレータが起動してテストコードに書いて有る内容通りに、勝手に動きます。