Web フロントエンドにおける API モック戦略

はじめに 新規開発のプロジェクトでテスト戦略を立ててしばらく開発をしています。そのテスト戦略の内の 1 つに Web API モックの運用ポリシーを決めていたのですが、大きな問題がなく運用ができているので「API モック戦略」と大袈裟に題してみました。 特に奇抜なことはしていないですが、振り返りとしてまとめたいと思います。 目的 Web フロントエンドの開発時にモック API を利用して動作確認・自動テストをしたい 開発サーバを起動するだけでブラウザで動作確認をしたい Testing Library などを用いた UI コンポーネントの振る舞いを自動テストしたい モックデータの管理を簡単にしたい ブラウザでの動作確認と自動テストで同じモックデータを利用したい 前提 API のモックサーバは Mock Service Worker （以下 MSW と呼ぶ）を利用する。MSW のメリットや利用

[kazuhe]

お仕事でやったことの振り返り記事です。

[carolina04]

ルーティングに徹する人 レスポンスを出し分ける人 レスポンスを定義する人 の様な役割でファイルを分割すると、エンドポイントやテストの為のレスポンスの出し分け条件が増えてきた時も見通しがよいと感じました。