MSWで開発をスムーズに進められた記事を読んだ

Mock Service WorkerでAPIをモックして開発をスムーズに進められた話 - Classi開発者ブログ

MSWについては前に書いて、導入してみたいと思っていたのでMSWの記事があると読んじゃう。

この記事ではAngularのプロダクトへの導入ということでまったく同じようにはならないと思うけど、後半にあった「便利だったオプション」が参考になりそうだった。

request.bodyでの分岐

req.bodyの値によってレスポンスを出し分けることができるというもの。シンプルだけど便利だ。

ただ条件分岐が増えるとそれはそれで難しくなりそう。でも条件分岐が増えすぎた場合はAPI設計に問題があるという感じになるのかな……？

ctx.delay()で応答時間を遅らせる

これもシンプルだけど重要そう。

応答時間によって起こる事象も多くあるので、応答時間を自由にモック側で制御できるのは色々なケースを試せる。

ネットワークエラーを返す

これは実際の使いどころが難しそうだけど、あったら便利なのかな。

ネットワークエラー時にどういう表示になっているかを確認したりする、とか？

その他

公式ドキュメントに色々書いてあるのでちょっとだけ読んでみた。

onee()

once() - Api - Mock Service Worker Docs

JestのmockImplementationOnce()みたいな感じかな？と思って見てみたんだけど、サンプルコードを見ると2回目以降のレスポンスがNetwork Errorになるっぽい。APIのモックだからそうなるのか。

fetch()

fetch() - Api - Mock Service Worker Docs

リクエスト処理時にリクエストが送れる。

例だとGitHubのURLをreqで受け取ってそのままfetch()に投げてる。

モックで他サービスのAPIにリクエストするのは気をつける必要がありそうだけど、どうやって使うんだろうか。