フロントエンドカンファレンス北海道2024
レギュラートーク(20分)

小さく初めて効果を最大化するフロントエンドの自動テスト導入

shilaca_ Shilaca shilaca_
4

昨今フロントエンドにおける自動テスト手法が注目を浴びています。
その中でテストが存在しない既存のプロジェクトはテストとどう向き合うべきでしょうか。

本発表ではテストが書かれていない既存フロントエンドプロジェクトが抱えていた課題と、それに対して「どのように」「どんな」自動テストを導入したかを話したいと思います。

主な内容

  • プロジェクトが抱える課題
    • 人的リソース
    • ライブラリバージョンアップなどリスク
    • リリース作業のコスト
  • Next.js (Page Router) で書かれたコードに自動テストを導入する
    • 静的解析
    • Jest, React testing library を用いた Component のテスト
    • Playwright による Storybook を再利用した Visual Regression Test