MonacaアプリのUIテストに。Appiumを試す(Android編)
前回のiOSシミュレータに続いて今回はAndroidエミュレータを使ってAppiumを試してみたいと思います。AppiumはWeb開発時のUIテストでよく知られているSeleniumをiOS/Androidアプリに対応させたソフトウェアです。
今回はこのAppiumをMonacaアプリ(Android)で動かす方法について紹介します。
CLI版Monacaの準備
Appiumはローカルで動かしますのでMonaca.ioではなくCLI版のMonacaを使います。そのためnode.js/npmはインストールされているものとします。
$ npm install monaca -g
インストールしたらログインを行います。
$ monaca login
ログインしたら新しいプロジェクトを作成してみましょう。今回はHelloWorldアプリにしました。
$ monaca create Hello
Which project template do you want to use?
1: Hello World App
2: Minimum Template
:
21: NIFTY Cloud mobile backend
22: Onsen UI Minimum Template for Universal App
Type number>1
Project created successfully.
Cordovaコマンドのインストール
次にCordovaコマンドをインストールして、適当なプロジェクトを作成します。
$ npm install cordova -g
$ cordova create HelloCordova
$ cd HelloCordova
今回はAndroidをプラットフォームとして追加します。
$ cordova platform add android
そうするとこのようなファイル構成になります。
まずCordovaプロジェクト上でビルドをします。
$ cordova build android
そうすると platforms/android/src
以下に com というディレクトリが作られているはずです(ない場合はMonacaプロジェクトのAndroidManifest.xmlをCordova上のものに差し替えた後、cordova build androidをMonacaプロジェクト上で実行してください)。その後、platforms/android
以下のファイルを Monacaプロジェクトの platforms/android
以下に移動します。Monacaアプリでも同名のディレクトリもありますので、元々入っているものは消さずに、その中身は移動するようにしてください(res以下のXMLファイルなど)。ファイルの配置が変わってしまうとMonaca IDEでビルドできなくなる可能性があります。Appiumで使うコードは元のコードから分離し(Gitでcloneするなど)、元々のMonacaプロジェクトには影響しないようにしてください。
これで準備が完了です。CordovaプロジェクトとMonacaプロジェクトの互換性が向上していることでこのような流用が可能になっています。
ただし、Monacaプロジェクト上にこれらのファイルがあるのは良くないので、MonacaプロジェクトをGitに登録し てこれをcloneし、そこにCordovaプロジェクトのファイルを入れつつ.gitignoreで元のMonacaプロジェクトには影響しないようにしておくのが良いかと思います。
Appiumのインストール
AppiumはiOS9への対応が進められているベータ版を使っています。
$ npm install appium@beta -g
Xcode7にするとインストール時に library not found for -lgcc_s.10.5 というエラーが発生する可能性があります。その時には下記コマンドを実行することで回避することができます(自己責任でお願いします)。
$ cd /usr/local/lib & & sudo ln -s ../../lib/libSystem.B.dylib libgcc_s.10.5.dylib
Rubyライブラリのインストール
今回はRubyでテストコードを書いてみます。まずRubygemsでライブラリをインストールします。
$ gem install --no-rdoc --no-ri appium_lib
これで準備は完了です。
アプリをビルドする
テストを行うにあたって一旦ビルドを行う必要があります。Monacaアプリのディレクトリに移動して実行します。
$ monaca build android
これでアプリがビルドされればOKです。
デモコードを書いてみる
まずはテストまでいかず、簡易的に動かしてみたいと思います。
require 'appium_lib'
capabilities = {
app: "/path_to/platforms/android/build/outputs/apk/android-debug.apk",
platformName: "Android",
deviceName: "Android",
defaultCommandTimeout:7200,
debugLogSpacing: true
}
@wd = Appium::Driver.new(caps: capabilities[:android])
Appium.promote_appium_methods Object
@wd.start_driver
sleep(5)
@wd.set_context("WEBVIEW_com.example.helloworld")
h1 = @wd.find_elements(:xpath, '//h1')[0]
puts h1.text
a = @wd.find_elements(:xpath, '//a')[0]
a.click
sleep(20)
driver_quit
appオプションは先ほどビルドしてできたアプリのパスを指定してください。driver_quitを実行するとすぐに終了してしまうので20秒のスリープを入れています。clickのようなイベントも使えますのでアプリの画面を遷移しつつ操作をDOMの状態をチェックすると言ったこともできます。
後はこのコードを実行すればOKです。以下はデモで動かしたところですが、実際にはもっと時間がかかります。
注意点
エラーについて
Androidではセッションがたびたび切れることがあります。そうした時には @wd.start_driver
を再度実行してください。
iOSとの違いについて
AndroidではXPathを使ったオブジェクトの取得になります。また、コンテキストをWEBVIEW_〜ではじまるものにセットする必要があります。そのため似たような処理をテストする場合においてもiOS/Android版で共通のテストにはしづらそうです。
実機でのテストについて
Androidはエミュレータなので実機を接続してもさほど変わらずテストが行えるはずです(未検証)。エミュレータはIntel版にしても速度が遅くなってしまうので実機テストの方が良いかもしれません。
ハイブリッドアプリのUIテストについては情報が多くなく、まだまだ手探りのところが多いのですが検証しつつ情報を出せればと思います。良いTipsがあればぜひ共有してください!