【MSW】ルーティングと条件付きレスポンス

MSWを使っていて、以下のようにクエリパラメータによって結果が変わるテストをしたい

/api/list?q=xxxx&a=yyyy&b=zzzz

そこでMSWのルーティングマッチング機能があるので調べた

mswjs.io

まず、基本的にAPIリクエストのマッチはmethodとURLで行われる

方法は３つ

1. リクエストURLの完全一致
2. パスマッチ
   ワイルドカード/users/*や、パラメータをパスに含む場合/user/:userIdなどにマッチ
3. RegExp
   正規表現をつかってマッチ

クエリパラメータによってレスポンスを変える場合はマッチしたURLのhandlerの中で行う

条件つきレスポンスのドキュメント
https://mswjs.io/docs/basics/response-resolver#conditional-response

rest.get('/user', (req, res, ctx) => {
  const userId = req.url.searchParams.get('userId')
  if (userId === 'abc-123') {
    // Return a mocked response only if the `userId` query parameter
    // equals to a specific value.
    return res(
      ctx.json({
        firstName: 'John',
        lastName: 'Maverick',
      }),
    )
  }
  // No return statement, perform the request as-is.
})

このようにしてクエリパラメータによって結果を変えることができる

ちなみに、上記のコード例のようにreturnで何も返さない場合は、実際のエンドポイントのリクエストがされる

うまく活用すると幅広いテストが行えそう