Download as PDF, PPTX
アプリケーション開発目線から考える テストの書き方について
- 1.
- 2.
- 3. 3 今日話すこと ● テストのメンテナンスが負担にならないようにするには ? ●サンプルコードでいくつかのテストの書き方の紹介
- 4.
- 5.
- 6.
- 7. 7 テストのメンテナンスが負担にならないようにするには? そもそもなぜ負担になってしまうのか ? テストを書くのが楽しくないから ● Karmaが遅い ●DIの設定がめんどくさい この辺が解消されれば 楽しくなるはず!
- 8. 8 Jestを使おう ● ブラウザを立ち上げる必要がないので、 Karmaよりも圧倒的に速い ●後述するSnapshotテストが強力で、テスト工数がだいぶ低くなる ● Jasmineよりも分かりやすいMock機能がある ● IDEの親和性も高い
- 9. 9 Jestを使ったテストの書き方を紹介 ● Component Templateテスト ● Component @Output テスト ● テスト時のDIのモック設定 ● Http/Observableのテスト
- 10. 10 Component Template テスト ●プロパティがHTMLとして正しくレンダリングされているかを確認したい ● プロパティ一箇所ごとにテストを書くのは大変で、テストも腐りやすい ● Jest Snapshotでテストをしよう
- 11.
- 12.
- 13.
- 14.
- 15.
- 16. 16 Component @Output テスト ●ユーザーのクリックなどの処理で EventEmitterがemitされることを確認した い ● Observableとしてテストをするのは手数が多く面倒くさい ● JestのspyOnを使用してemitが呼ばれるところまでをテストをする
- 17.
- 18.
- 19.
- 20. 20 methodのコールで このemit が呼ばれること をテストしたい EventEmitterの emitを spyする emitを発火させるmethodをコールする
- 21. 21 methodのコールで このemit が呼ばれること をテストしたい EventEmitterの emitを spyする emitを発火させるmethodをコールする 意図通りにemitが呼ばれることを確認
- 22. 22 テスト時のDIのモック設定 ● DIするものが増えるとテストを書くモチベーションが下がってしまう ● 使い捨てで、すぐに準備できるようにDIを上手く解決したい ● DIするモックについては再利用を考えず、それぞれのファイル作成する ● Provider の useValue と jest.fn を使う
- 23.
- 24.
- 25.
- 26. 26 これらのdependencyを解 決したい providersにはuseValue を使用し、 必要なmethodなどを jest.fnで用意する Serviceの DI が解決されてnew できる
- 27. 27 Http/Observableのテスト ● Httpのリクエスト結果を利用した処理などをテストしたい ● HttpClientTestingModuleを使うと煩雑な設定が多くなり、 テストを書くのが億劫になってしまう ●HttpClientの get をモック化して、コールされた内容をテスト 戻り値には jest.fn を使用して、必要なObservableを設定する
- 28.
- 29.
- 30.
- 31.
- 32.
- 33.
- 34. 34 まとめ ● 表示専用のComponentのテストは、Jest Snapshotを使う ●DIは各テストファイルで、最小限のモックを jest.fn で作成する ● モックに対して指定の引数で正しくコールしているかどうかのテストを行う ● モックからの戻り値は jest.fn で随時設定して、各テストを進めていく
- 35.