javascript を Xcode でテストするお話

1. javascriptを
Xcodeでテスト
第17回 yidev
2014/12/20
!
Retty 株式会社
櫻井 洋一郎

2. 自己紹介
• 櫻井 洋一郎(@saku2saku)
• iOSアプリ開発 兼 とんかつ担当
• Objective-C, PHP, Java, 等々
• 料理, 漫画, 等々

3. Rettyとは？

4. javascriptを
Xcodeでテスト

5. • みなさん⃝⃝やってますか？
• Rettyの現状
• JavascriptCore framework
• XCTestでJavascriptCoreを使う
もくじ
https://github.com/saku/20141217YidevSample

6. みなさんWebView使ってますか？
• どこまでできる？
• WebView <-> ネイティブ の双方向呼
び出し
• レスポンスの悪さについて
• fastclickを使うと軽減できる
（実用化には一工夫必要）

7. みなさんTDDやってますか？
• モデルクラスとか
• 自作ライブラリがあればそれも対象

8. Rettyの現状
• ３つの画面種類を定義
• サーバ側Web
• いわゆるWebページを表示する
• ネイティブ側Web
• ネイティブに持たせたHTML・JSから
画面を描画
• ネイティブ

9. サーバ側Web ネイティブ側Web ネイティブ
アプリ技能
操作性
開発期間
不要 要
低
短
高
長

10. 使ってる仕組み
• CSS
• Sass (サーバとモジュールを共用)
• HTML・JS
• Handlebars (JSのHTMLテンプレート)
• gulp (ビルドツール)
[FYI] Xcodeでgulpを使うお話
http://www.slideshare.net/ganbit1021/xcode-gulp

11. 今回のお話のキッカケ
(́-`).oO( Javascriptもテスト
( できないかなー？
( Xcodeと合わせて

12. !
＼ __ ／
＿ （ｍ） ＿ﾋﾟｺｰﾝ
¦ミ¦
／ ｀́ ＼
('A`) JavaScriptCore!
│ ノヽノヽ
くく

13. JavaScriptCore 基本編
•基本的なjavascript評価を行う
!
1. JSContext を作成する
2. javascript のテキストをevalする
3. 結果を受け取る

14. デモ

15. JavaScriptCore 活用編
•他のライブラリを使ったjavascriptをテ
ストしてみる
!
1. JSContext を作成する
2. 自作関数の入ったjsファイルのNSString
をevalする
3. 結果を確認する

16. デモ

17. JavaScriptCore 応用編
•自作のメソッドをテストしてみる
!
1. JSContext を作成する
2. ライブラリのjsファイルをevalする
3. 自作関数の入ったjsファイルをevalする
4. 結果を確認する

18. デモ

19. JavaScriptCore 編
• ですが jQuery を使ったコードの評価はう
まくいかなかった
• 熊谷さんのスライドにあった function で
ラップする方法を試してみたがそれもダメ
[FYI] JavaScriptCore.framework の普通な使い方
http://www.slideshare.net/tomohirokumagai54/java-scriptcoreframework

20. • テストコード楽しい
• WebViewを使うのもけっこう楽しい
• javascriptのテストがXcodeで書ける
• jsライブラリに依存しててもOK！
• ただしjQuery テメーはダ(ry
まとめ
https://github.com/saku/20141217YidevSample