Upgrade to Pro — share decks privately, control downloads, hide ads and more …

フロントエンドのテストについて

 フロントエンドのテストについて

社内向けにフロントエンドのテストについて思っていることを発表したのと、Vue.jsのテスト方法について

スライド内のリンク
https://qiita.com/kurosame/items/8d82ef8d36c106c6e8bc

8dced43eb81ca084f5fc6f0101b93b3b?s=128

kurosame

June 22, 2018
Tweet

Transcript

  1. フロントエンドの テストについて 2018 年 6 月 22 日

  2. 前置き Vue.js でのテストの話です

  3. テスト書いてますか?

  4. 書いてる人も書いてない人もいる と思いますが

  5. 今日は書いてない方に目を向け て考えてみたいと思います

  6. なぜテストを書かない(書きたくない)のか いくつか理由を考えてみました ・スケジュール的な問題 ・そもそもどこをどうテストするか分からない ・テストコードを書くのがダルい、テスト環境作るのはもっとダルい 他にも理由はあると思いますが、この3つが思いつきました

  7. スケジュール的な問題について スケジュール的に厳しいから、テストはリリース後とか時間が出来た ときにまとめて書くという選択は良くあると思います もしくはテストを書かない方針にするという判断もしていると思いま す

  8. でも仮にリーダー的な人 が、、

  9. リーダー的な人> スケジュールにテストの分の工数を組 み込みます! なのでテスト書いてください!

  10. ってなったら、 テストを書き慣れている人はいいかも しれないですが

  11. テストをあまり書く習慣がない人は、 「え、面倒なことになったな、、」 って思うでしょう

  12. 結局下 2 つの問題が解決しないと、テストを書く(書きたい)という状 態にならないでしょう ・スケジュール的な問題 ・そもそもどこをどうテストするか分からない ・テストコード書くのがダルい、テスト環境作るのはもっとダルい

  13. そもそも、どこをどうテストするか分からない

  14. 解決になりませんが、これに関しては テスト慣れが必要かなと思ってます。。

  15. 私も最初は分からないながらも、テスト を書いてきて、だんだん慣れて、ちょっ とずつ良いテストが書けるようになって きました(たぶん)

  16. テストを書く習慣がつくと ・コーディングしながら、この処理はテストできる か ・テストが難しいから別の簡単な実装方法を考え よう ・そもそもテストがいらないやり方を考えよう ってなります

  17. この考えが身につくと、良いプログラ ムが書けそうな気がしませんか?

  18. そして実際テストを書くってなると、 3 つ目に書いたやつが障壁で しょう ・スケジュール的な問題 ・そもそもどこをどうテストするか分からない ・テストコードを書くのがダルい、テスト環境作るのはもっとダルい

  19. テスト環境作るのがダルい

  20. 開発環境に加えて、テスト環境も作る のは大変

  21. テスト環境は作れる人に任せよう!

  22. 作れる人がいなければ「XXX-cli」などの スキャフォールディングツールにまかせ ても良いと思います

  23. なので、、

  24. ・スケジュール的な問題 ・そもそもどこをどうテストするか分からない ・テストコード書くのがダルい、テスト環境作るのはもっとダルい ここだけ頑張ろう!

  25. Vue.jsの話になりますが、最近はテスト 周りのエコシステムが充実し、非常に簡 単にテストコードが書けるようになりまし た

  26. 今回はテストコードを簡単に効率良く書く ために色々考えて実装したので、紹介し たいと思います

  27. テスト書くぞ!

  28. Vue.jsのテストをモダンにする https://qiita.com/kurosame/items/8d82ef8d36c106c6e8bc

  29. さいごに 私が思うテストを書くメリット(これが全てではないですが) ・全体的にテストを自動化しておけば、テスト対象のモジュールが他のモジュールに依存している時にエラーに 気づける ・関数の使い方が分からない時などドキュメント代わりになる(誰かが作ったプラグインなどを使う時にドキュメント が無ければ、テストを見ることがよくあります) ・ E2E テストをちゃんと書いておけば、その画面全てのイベントが分かる。最強のドキュメント ・ユニットテストは言語が変わればフレームワークも変わるが、

    E2E テストはフレームワークは基本同じだと思うの で、 1 回どこかで書いておくと、今後もノウハウが生きます ・今後何年とメンテナンスしていくシステムを作っている思うので、未来で楽するために最初に時間と労力を投資 しましょう!