@kitasuke

UI テストの決定版@yidev

名前：北裕介所属： trippiece職種： iOS エンジニア趣味：海外旅行、スポーツ

自己紹介

Ref. http://cdn.arstechnica.net/wp-content/uploads/2014/09/iWatch-options-e1410300251456.jpg

Ref. http://www.imore.com/sites/imore.com/files/styles/xlarge_wm_blw/public/field/image/2014/09/apple_watch_sport_green_band_quick_reply_display.jpg?itok=7BMK23t5

さっそく UI テストの決定版ですが…

そんなもん無い !

Ref. http://blog-imgs-14-origin.fc2.com/m/a/d/madgamer/20070508094152.gif

そこまで工数かけられないどのライブラリが良いか分からないUI は常に変わるものなので利点が少なそう効果が分かりにくい画面数が多すぎて手をつけられない

UI テストの話を聞かない理由

UI テストの目的は？自分で担当した作業が原因で、思わぬところで起こる UI 関連の不具合を防ぐ

あまり UI が変わらないような段階（ローンチ後など）デバッグの際にあまり見ない画面（チュートリアルやサインアップや設定など）

想定される UI テスト対象

通常のデバッグ中に UI 関連の不具合を発見出来ると思うので、必要良いかなと思います

それ以外の画面は？

それでは実際にどのようにUI テストを行うかを説明します

UIAutomation -> JavaScript

KIF -> Objective-C

ライブラリ

← これ使います

Square 製のライブラリデモ動画公式ドキュメントhttps://github.com/kif-framework/KIF非公式日本語ドキュメントhttps://gist.github.com/kitasuke/ed6f90e83df3c0653cbf

KIF とは？

View のタップ 座標のタップ 長押し 文字入力・削除

Scroll Swipeテーブルビューのセル選択

コレクションビューのアイテム選択カメラロールから写真選択

ピッカーの選択 トグルのオン・オフポップオーバーを閉じる

KIF で出来ること

1. 対象の View に AccessibilityLabel とAccessibilityIdentifier とセットする（ Storyboard 上 / コード上）

2. アクション実行メソッドをたたく

使い方

e.g. Accessibility e.g. User Defined Runtime Attributes

e.g. Method of KIF

1. beforeAll 　 → テストクラス実行時に 1 回実行2. beforeEach → 各テストケース実行前に実行3. testHoge 　 → テストケース4. afterEach 　→ 各テストケース終了後に実行5. afterAll 　　→ テストクラス実行後に 1 回実行

フロー

サインアップ等では UI テスト用のダミートークンを返すようにするKIF + OHHTTPStubs

全画面遷移分のスクリーンショットを保存可能フォルダ名：テストケース名ファイル名：タイムスタンプ

KIF + Screenshot

全テストケース　→　⌘ +U

各テストケース　→　⌃ +⌥+⌘+U

* 実行前に iPhone シミュレーターが起動していないことを確認する

実行方法

デモ

テストケースが多くなると数分では終わらないそもそも全画像を目で見て確認するのは無理

↓

前回のテスト結果との差異だけを検知したい

テストの自動化

PR の度に Travis で全テストケースをはしらせるGithub + Travis

e.g. .travis.yml

motage コマンドmontage –tile 2x2 –geometry 640x1136 1.png 2.png tile.png

複数の画像 → 1 枚の画像

e.g. 1.png e.g. 2.png e.g. tile.png

Composite コマンドcomposite –compose difference 1.png 2.png diff.png

画像の diff をとる

e.g. 1.png e.g. 2.png

e.g. diff.png

1. テスト実行2. 画像の 1 枚にまとめる3. 前回と今回のテスト画像の diff をとる

Travis の script

良い点運用コストが大幅に減る悪い点UI 実装者とテストケース実装者が異なると効率が下がる

まとめ

We’re hiring iOS & Android Engineers!!