获取模拟服务工作者的请求体和反应测试库

Question

所以我正在为我的一个反应项目编写测试，我只是决定使用模拟服务工作者来模拟我的 api 调用，我正在尝试模拟登录 endpoint.So 我正在尝试模拟登录错误，当输入与特定电子邮件不匹配时，我 return 会显示一条错误消息。给定以下代码；

const server = setupServer(
  rest.post("https://testlogin.com/api/v1/login", (req, res, ctx) => {
    // the issue is getting the email from the request body something like the code just below
    if (req.body["email"] != "test@example.com") {
      ctx.status(401);
      return res(
        ctx.json({
          success: false
        })
      );
    }
  })
);

我该怎么做？有更好的方法吗？

Answer 1

鉴于您的请求设置了 Content-Type: application/json header，您应该能够获得 req.body.email 值。如果没有 Content-Type header，MSW 和您的实际服务器都无法知道您要发送的数据类型（如果有的话，它可以是二进制文件！）。通过提供正确的 Content-Type header，您形成了正确的请求，但也让 MSW 确保 req.body 应该被解析为 object.

// your-code.js fetch('https://testlogin.com/api/v1/login', { method: 'POST', headers: { // Adding this header is important so that "req.body" // is parsed into an object in your request handler. 'Content-Type': 'application/json' }, body: JSON.stringify({ login: 'admin@site.com' }) })

// your-handlers.js rest.post('https://testlogin.com/api/v1/login', (req, res, ctx) => { const { login } = req.body if (login !== 'test@example.com') { return res(ctx.status(401), ctx.json({ success: false })) } return res(ctx.json({ success: true })) })

Note how the ctx.status(401) call is inside the res() function call. Calling any ctx[abc] methods outside of res will result in no effect as they rely on being wrapped in res.

获取模拟服务工作者的请求体和反应测试库

Getting request body of mock service worker and react testing library

reactjs

msw