はじめに
こんにちは、ナレッジワークでフロントエンドエンジニアをやっています Jimagu(@nakajmg) です。
本記事では2024年9月20日に開催した Encraft #18の開催レポートをお届けします！
今回もオフラインで参加することが難しい方などに向けて、YouTubeでのLive配信も行いました。
動画アーカイブもありますので、ご視聴の際は感想をハッシュタグ #encraft でつぶやいていただけると嬉しいです。
今回のテーマは「Frontendのテスト全部知る」
今回は「Frontendのテスト全部知る 〜Unit TestからE2Eまで〜」というテーマで、フロントエンドにおけるテストについて、Unit Test、Visual Regression Test（VRT）、E2Eといったそれぞれのテストについて紹介いただきました。
セッション1: コンポーネントのテストの手法とその効果を考える
まずはじめにサイボウズ株式会社の@nus3_さんから、フロントエンドのコンポーネントテストに使えるライブラリや手法などについて紹介いただきました。
nus3 / サイボウズ株式会社
コンポーネントテストはテスト対象となるコンポーネントをレンダリングし、コンポーネントが意図しているとおりに挙動するかを確認するものです。コンポーネントテストに使えるライブラリは多くの選択肢がありますが、テストによってどういった品質を担保したいかで選択するとよいと紹介されていました。
シンプルなコンポーネントに対するテストの要不要について「テストの書きづらさなどからコンポーネントの設計を見直す機会として捉えることができる」という考え方を紹介していたのが印象的でした。
セッション2: 上手に付き合うコンポーネントテスト
2つ目のセッションではYosuke Kuramiさん（@Quramy）からVRTを行うためのツールと、運用について紹介いただきました。
Yosuke Kurami
セッションではPull Requestを作った際のCIの実行時間について「どれくらい我慢できるか？」と会場の参加者へ質問がありました。参加者の回答としては5分〜10分というのが多く、実行時間がこの辺りを超え出すとつらみが高まっていくようです。
VRTは画像を用いることからFlaky（成功・失敗が安定しないテスト）に陥りやすいですが、この状態を放置するのは割れ窓化を引き起こす原因になるので、閾値を変更したり、そのテストケース自体を実行しないようにしたりするといった対策や指針について紹介されていました。
セッション3: 急拡大する開発組織を支えるナレッジワークの E2E テスト基盤
3つ目のセッションは、弊社ナレッジワークの@jinjorからナレッジワークのE2Eテストの取り組みについて紹介がありました。
@jinjor / 株式会社ナレッジワーク
ナレッジワークは3年で10個の新プロダクトリリースを予定しており、開発者が増えるとともにプロダクトの大規模化や複雑化が進んでいます。
ナレッジワークではデグレードの検出や品質確認の自動化を役割としてE2Eの実装・拡充を行なっていますが、複数人が同時に実行するとE2Eテストがコンフリクトするなど、E2Eの実行環境が課題となっていました。
この課題を解決するために、E2Eが実行できる状態の環境を自動でセットアップする仕組みや、だれもE2Eテストを実行していない環境を自動で選択できるような仕組みを構築したことを紹介してもらいました。
Triple-WIN アンケート & 感想戦
Encraftでは、参加者のアンケート回答に連動してナレッジワーク社がOSSプロジェクトに寄付をする試みを行っております。参加者の1回答当たり8ドルをナレッジワークがOSSに寄付することで、参加者とOSSプロジェクトをナレッジワーク社が繋ぐ仕組みです。
今回は39名の方がアンケートに回答してくださり、312ドルをOpen Collective経由でVitestに寄付いたしました。
また、アンケートを入力していただいている間、登壇者3名と司会の@yoshiko_pgを交えてセッションの感想や突っ込んだ質問などが繰り広げられました。
感想戦の様子
パネルセッションとして成立するような濃い内容で大変盛り上がっていました。
イベントの様子
登壇者の皆さん
オープニング
セッション中
We're hiring
懇親会も盛り上がりました
おわりに
今回、幅広くフロントエンドのテストについて紹介いただき、プロダクトに活用できそうな手法や考え方を得ることができました。とてもおもしろい内容のセッションばかりなので、YouTubeのアーカイブを視聴いただき、感想などをいただけると幸いです！
次回予告
次回のEncraft #19のテーマは「エンジニアマネジメント」です。
エンジニアリングマネージャーをキャリアの次のステップとして考えている方などに参考になる内容をお届けします。ご興味のある方はぜひご参加ください！
Encraft は今後も定期的に学びと交流の場として開催を予定しています！
Connpass でグループメンバーになっていただけると開催通知メールが送られますので、開催を知りたい方は https://knowledgework.connpass.com/ より是非グループメンバー登録をよろしくお願いします。
セッションをオンラインでご覧いただいた方も、感想などハッシュタグ#encraftでツイートしていただけたら嬉しいです！
それでは、また次の Encraft でお会いしましょう！👋👋
Discussion