使用 axios-mock-adapter 的原因

The reason of usage axios-mock-adapter

我是测试 axios 调用的初学者并开始使用 axios-mock-adapter 但我不明白为什么我们使用 axios-mock-adapter。

mock.onPost('/api').reply(200, userData, headers);

在这个代码片段中,请求真的到达了服务器还是只是一个模拟?

因为如果我提供了错误的凭据,它会以 200 状态响应,因为我在“回复”到 return 200 时识别它。

那么如果我识别响应状态,使用它的原因是什么? 如果真的不上服务器,好像这个也没用。

也许我错过了一些我不知道的东西,因为我是新手,但有人应该把这个问题放在我的脑海里。

您问题的答案

In this code snippet, does the request really go to the server or is this just a simulation?

这只是一个模拟。没有请求,只是 "reply" 被 returned。这称为 mocking 并且非常流行并且对编写测试很有用。

如果您不熟悉一般的不同类型的测试,this answer 非常值得一读。

If it doesn't really go to server, it seems like this is useless.

如果您想测试整个系统:即您的网站 + 后端逻辑(如身份验证、数据检索等),那么是的,这是没用的。但是您不会为此使用 mock

集成测试通常针对 运行 系统执行,它们很有价值,但很难维护并且通常执行起来较慢。您不仅要处理测试,还要处理数据。

你什么时候使用模拟

模拟对于单元测试您的代码是必不可少的。模拟有助于将您的前端代码逻辑与动态行为隔离开来。这使您可以更轻松地模拟 许多场景,而无需维护数据的开销。

示例场景

用例 在您的应用程序中,您必须根据 REST 端点对用户进行身份验证。预计:

  1. 用户登录成功后,header中会显示注销按钮。
  2. 当用户密码过期时,会显示 "change your password" 屏幕。
  3. 当用户输入错误的凭据时,会显示警告
  4. 当后端没有响应时,用户会看到一个屏幕,稍后再试

如果没有模拟,您需要确保在身份验证系统中配置了准确的数据。根据经验我可以告诉你这很难,尤其是#2 & #4。

但是使用模拟,您只需将 mock 配置为 return 您对每个场景的期望响应,in/before 每个 it() 块。

这也更容易维护,因为期望值(assert/expect 语句)设置在测试数据(mock.reply())附近。