Download - Robotium を使った UI テストとレイアウト確認の効率化
![Page 1: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/1.jpg)
Robotium を使った UI テストとレイアウト確認の効率化
2015/02/28
最新事例から学ぶ!モバイル向けテスト手法勉強会Sansan株式会社 辰濱健一
form 徳島サテライト会場(リモート発表)
![Page 2: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/2.jpg)
Agenda 自己紹介
Robotium で UI 自動テスト
デモ
Robotium でレイアウト確認効率化
【おまけ】 これからやりたいこと(実験中の内容)
![Page 3: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/3.jpg)
自己紹介 Sansan 株式会社 Sansan 開発部所属
神山ラボ勤務 (徳島現地採用)
アプリチームリーダー (メンバーは東京)
Android 版 Sansan アプリ実装担当
趣味
音楽
トランペット… 徳島の吹奏楽団で週末に吹いています
エレクトーン… 3歳から始め今も現役
旅行
黒部立山アルペンルートがお気に入りスポット
小笠原諸島が最近気になっている
![Page 4: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/4.jpg)
テストの自動化との関わり 前々職で、正確さとパフォーマンスが求められる表計算ソフトの
UIテストの自動化&高速化を担当 高速化したは良いが、影響はないか?
本当に速度は速くなったか?
他者の修正でまた遅くなっていないか?
表示結果は期待通りか?
CPPUnit で見切れない UI の動作は OK か?
などを日々計測・監視するツールを作成
前職では、Android, iOS, Windows8(C#)のスマホ・タブレット向けアプリ開発に従事
前々職&前職のスキルを活かし、スマホアプリでUIテストの自動化!
![Page 5: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/5.jpg)
Sansan神山ラボ 築70年の木造古民家(3棟)
略歴
2010年設置
〜2013/11:合宿所
2013/11〜:常駐メンバーのいる開発拠点に
家具家電あり、畑付き、風呂トイレセパレート
家賃:数万円 / 月
インターネット接続:あり
最寄り(道の)駅:「温泉の里神山」徒歩15分
改装OK物件
![Page 6: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/6.jpg)
神山での開発(良いこと) 静かで広々していて、高いパフォーマンスの状態で仕事に集中できる
Githubや Skype などのツールの利活用で、実務におけるチーム内コミュニケーションは意外と何とかなっている
![Page 7: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/7.jpg)
神山での開発(難点) ネットワーク状態にコミュニケーションが左右される
開発チーム外の人に直接話しかけられない
視察・取材など開発以外の業務も伴う
自然環境との戦い(虫、カビ、寒さ、…)
![Page 8: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/8.jpg)
端末操作を自動化するライブラリ Android専用
Robotium
monkeyrunner
Espresso
など…
iOS専用 KIF
Kiwi
など…
ハイブリッド Appium
Calabash
MonkeyTALK
など…
![Page 9: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/9.jpg)
なぜ Robotium? メリット
数年前に調査して慣れていた
Android 実装と同じ Java 言語で記述
アプリケーション内部のオブジェクトが参照できる
細かいところまで手が届く
テストケースや期待値の動的生成ができる
デメリット
リリースビルドでは使えない→ 別途 Appium を調査中http://www.slideshare.net/kenichitatsuhama/rubyui
![Page 10: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/10.jpg)
UI自動テスト実装ポリシー 浅く広くから!
あきらめも大事
ライブラリ関数を直接叩かず、ラップして抽象化する
極力 SLEEP は使わない。wait* 関数で!
ローカライズ対応
![Page 11: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/11.jpg)
ポリシー:浅く広くから! 主要画面に遷移し、基本機能1パスだけの確認
いわゆる、リグレッションテスト
主要機能のデグレードを早期検出することが目的
1,000 文字制限の所に 1,001 文字入れたときにエラーが出るかでないかは、ここではどうでもいい(※これは、狭く深いフルテストでやろう)
運用例
テストレベルを設定して、このテストをスモークテストにする
【スモークテスト】:最初の簡易テスト
スモークテストはコミット毎に実行
フルテストは深夜に実行
![Page 12: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/12.jpg)
ポリシー:あきらめる メールに表示されている URL をクリックして…
メールアプリ起動して操作??
アプリを終了させて再起動したときに…
どうやってアプリを起動する??
通信が途中で切れたときの動作
etc…
頑張ればできるかもしれない。。。(Appiumなどのシステムテスト)
でも、調査に時間が掛かりそうであれば、手動で確認しよう!
![Page 13: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/13.jpg)
ポリシー:ライブラリ関数のラップ テストコードの可読性を上げ、手順書代わりにしたい!
将来テストライブラリを変更する(かもしれない)場合に備え、ライブラリとテストコードの結合度を下げておく
ライブラリにない拡張機能を仕込みやすい
実行時ログ
エラーログ
テスト失敗時にスクリーンショットを残しておくのはオススメ!
![Page 14: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/14.jpg)
ポリシー:極力SLEEPは使わない
つい使ってしまいがち…
でも、実行環境によって必要な SLEEP 時間は違う
→ wait* 関数を使おう (作ろう!)
ライブラリ関数の例
waitForActivity
waitForFragmentByTag
waitForLogMessage
自作例
waitHideProgress // ぐるぐるが消えるまで待つ
自作関数や、ライブラリのラッパー関数内でSLEEPを使うのはアリと考えます。
![Page 15: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/15.jpg)
自作 waitHideProgress アプリ内の Activity基底クラスに「ぐるぐる」表示中かどうかの関数を追加
一定時間毎に↑の状態をチェックする
![Page 16: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/16.jpg)
ポリシー:ローカライズ対応 端末の言語設定によらず同じ結果になるように!
×:clickOnText(“送信”);
○:clickOnText(R.string.send);
言語環境によって動作が違う場所はテストコードも切り分けよう
If (isJapan) {
// 日本語のときの動作確認}else {
//
}
実機でも、エミュレータでも問題なく通るように
エミュレータでカメラがなければ、カメラ系のテストはスキップする。
![Page 17: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/17.jpg)
Sansan アプリリグレッションテスト項目(抜粋) Sansan アプリ とは…?
「スマホで社内の名刺を一括管理」
ざっくり言うと、Eight 法人版のイメージ
同僚が持っている名刺も閲覧・検索できる機能がある
リグレッションテスト項目
ログインできること
同僚一覧で自分をタップすると、自分の名刺一覧が開くこと
名刺一覧の名刺をタップすると、名刺詳細画面が開くこと
など…
![Page 18: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/18.jpg)
サンプルコード(Android) ログイン処理
メールアドレス入力欄を取得
パスワード入力欄を取得
メールアドレスを入力
パスワードを入力
ログインボタンを押す
ラップしてるから読みやすい!
![Page 19: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/19.jpg)
リグレッションテストのデモ 2014/11 時点の動画です
http://youtu.be/scY_RPgfxeY
4分ぐらいありますが、発表時間の都合上ちょっとだけ…
![Page 20: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/20.jpg)
UI自動テストを導入してみた効果 デグレードの早期発見・防止につながった
実際に開発中のミスを検出し、デグレードを未然に防いだ
開発サーバの異常を検出した
大規模な修正も行いやすくなった
何度でもテストを簡単に実行できる
作業効率UP
離席中・昼食中・ミーティング中にでもテストができる
テストに割く時間を開発に充てることができる
新しい OS が出てもテスト工数を割かなくて良い
![Page 21: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/21.jpg)
とはいっても… リリース前の本番バイナリは手作業でテストしています。(機械を過信しない。目で確認すると安心)
色んな施策で、画面遷移の動線が変わるとテストコードのメンテが大変
前提条件(この画面にいること)の造り出しに工夫が必要
setUp() でログイン、tearDown() でサインアウト など
導入に当たっては、
費用対効果の高いところから
仕様変更がなさそうな基本機能
直近リファクタリングしたい箇所
など、から着手するのが良いと感じています。
(後述のスクリーンショット収集は自動化テスト入門として最適かも…)
![Page 22: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/22.jpg)
スクリーンショット テスト実行中に必要に応じて撮影している
→ レイアウト確認に利活用できる!
![Page 23: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/23.jpg)
Robotium でレイアウト確認効率化
![Page 24: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/24.jpg)
スクリーンショットの活用 Robotium でスクリーンショットを撮る
画面遷移してスクショを撮るだけのテストケースを作成&実行
このテストケースを言語設定を動的に切り替えて実行
スクショを端末名フォルダに集める
一覧View を作る(ツールを Ruby で作った)
結果確認は目視!
機械的には完全一致は容易だけど、正当な差分と意図しない差分をプログラムで認識するのは至難の業
![Page 25: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/25.jpg)
テストコード(抜粋)
![Page 26: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/26.jpg)
スクリーンショットの活用の全体像
デザイン指示画像スクリーンショット
html 生成ツール
スクリーンショット
![Page 27: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/27.jpg)
スクショ一覧のhtml
画面名→
画面名→
画面名→
Nexus4 Nexus5 デザイン指示画像(期待値)
各画像をクリックすると、原寸大で表示される
※元サイズが違うけど、今は同じサイズで表示されている
目で比較する!
デザイナにはこのhtml を含む zip を提供するだけ。
![Page 28: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/28.jpg)
スクショ一覧の効果 デザイナーに apk作って提供
↓
色んな動作確認端末にもインストール↓
手で操作して、その画面に遷移して動作確認↓
フィードバック&修正
↑を何度もする必要はなくなり、開発者&デザイナー双方に効率化をもたらした!(最終的には apk を渡して実機で見てもらいます)
Robotium は画面遷移とスクショ撮影しかしていないので、iOSや他プロダクトでのこのツールの使い回しが可能!
![Page 29: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/29.jpg)
これからやりたいこと
![Page 30: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/30.jpg)
Robotiumに限らず、アプリ開発テストで…
テスト実行ごとにもっと色んなデータを収集・集積・分析していく
処理時間の推移
ClientAPI の呼び出し回数
メモリ使用量のモニタリング
※計画段階で、まだまだ検証段階です
![Page 31: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/31.jpg)
処理時間(推移) パフォーマンス改善の結果確認、性能デグレの検出ができ
るかも?
通信状態やサーバ状態に大きく左右される気がする…
0
2
4
6
8
10
12
2015/2/27 2015/2/28 2015/3/1 2015/3/2 2015/3/3 2015/3/4 2015/3/5 2015/3/6
ログイン処理
初回同期
名刺画像送信
詳細データ取得
高画質画像データ取得
手動同期処理
![Page 32: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/32.jpg)
ClientAPI の呼び出し分析(1回) 呼び出し毎に API名と実行時間を csv ファイルに出力
Excel のピボットテーブルで集計
iOS / Android で同じ仕組みを入れれば、同じ操作で API 呼び出しの違いがわかる!
そんなに呼び出す必要あるの…?
サーバ負荷削減のためのボトルネック分析が容易になる
Excelマクロ
![Page 33: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/33.jpg)
ClientAPIの呼び出し分析(推移)
さっきのデータを実行毎に集計する呼び出し回数削減施策導入
![Page 34: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/34.jpg)
メモリ使用量(1回) ユーザトラッキングイベント発生時にメモリ使用量を記録
→ どの操作以降メモリ使用量が急上昇するかわかる
0
10000
20000
30000
40000
50000
60000
[prelogin]Startupapps
[prelogin]ViewSplashtourSigninpage
[app]StartupwhileLoggedin
[prelogin]TapSigninbuon
[prelogin]CompleteSignin
[app]StartSync
[app]CompleteSync
[app]ViewRemindFirstInviteDialog
[app]TapnextonRemindFirstInviteDialog
[app]OpenInviteDialog
[app]ViewImportContactDialog
[app]TapSendonInviteDialog
[app]ViewInvitesuccessDialog
[app]TapUseascanneronScanmenu
[app]TapMyteamonTabbar
[app]TapMycontactonMyteam
[app]TapContactonMycontact
[app]StartSync
[app]CompleteSync
[app]TapSignoutonAccountseng
系列1
![Page 35: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/35.jpg)
メモリ使用量(推移) GCがいつ起きるかまちまちで微妙かも…
![Page 36: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/36.jpg)
アプリ開発チームの今期の取り組みに、これらを盛り込んでいるので、
何ヶ月後かにはこれらが実現できてる見込みです。
![Page 37: Robotium を使った UI テストとレイアウト確認の効率化](https://reader033.vdocuments.pub/reader033/viewer/2022061616/55a699b51a28ab7b668b45bd/html5/thumbnails/37.jpg)
アプリエンジニア募集中! 対象:iOS or Android エンジニア
勤務地:東京本社 or 神山ラボ