Cypress，从 API 响应中读取数据

Question

我发现的所有示例都是调用 API 并定义方法和 URL。例如

  cy.server()

  cy.route({
    method: 'GET',
    url: 'https://www.something.com', 
  }).as('get_jobs')

  cy.get('[data-cy="job-search-input"] button').click()

  cy.wait('@get_jobs').then((xhr) => {
     cy.log(xhr.response.body.data)
  })

我想要的只是选择按钮，按单击并阅读它给我的响应。我不想再次定义 url 和方法，而是使用代码中已经使用的那个，并在按下按钮后检查它给我的响应。

我怎样才能做到这一点？

Answer 1

从上面的问题和评论来看，听起来您正在尝试做这样的事情：

1. 设置您的应用程序
2. 单击按钮（或执行其他操作）以启动对 API 的请求
3. 捕获来自 API 的响应
4. 使用响应来测试应用程序中的其他内容（也许确保页面上的某些文本发生更改？）

虽然可以通过这种方式编写测试，但存在一个问题：API 的响应可能会根据您无法控制的情况而改变。例如，如果您正在开发项目，而 API 恰好在那天宕机了，会发生什么情况？您的代码将会被破坏，但这并不是由于代码中的错误所致。事实上，您根本不会测试您的代码（至少不会测试您认为正在测试的代码），因为您不会从 API 获得您想要的响应。

这就是为什么 Cypress 提供了一种存根请求的方法 - 以确保当您的测试运行时，您能够从 API 获得您想要的响应。如果您想编写一个测试来查看 API 返回值 A 时会发生什么，您需要确保 API 不会返回值 B。存根请求可以让您确保应用程序在需要时获取值 A 。

所以你见过的例子可能是这样的：

1. 设置您的应用程序
2. 用于cy.route存根 API 请求以返回已知值
3. 单击按钮 - 您的应用程序现在发出请求并返回已知值
4. 测试您的应用程序，以确保它在获得已知值时按照您的预期运行。

如果您想要测试应用程序的行为有一系列不同的响应值，请编写一组测试，每个值一个。