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 获得您想要的响应。

这就是赛普拉斯提供一种对请求进行存根的方法的原因 - 以确保在您的测试运行时，您从 API 获得您想要的响应。 如果您想编写一个测试来查看当 API 返回值 A 时会发生什么，您需要确保 API 不返回值 B。存根请求允许您确保应用程序在需要时获取值 A .

所以你看到的例子可能是这样的：

1. 设置您的应用程序
2. 使用cy.route存根 API 请求以返回已知值
3. 单击按钮 - 您的应用现在发出请求并取回已知值
4. 测试您的应用程序以确保它在获得该已知值时执行您期望的操作。

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

Answer 2

如果你只是想读取响应，你可以使用onReponse在cy.server ：

cy.server({
  onResponse(response) {
    // Log every response
    console.log("response", response);
    // Using the response URL from OP's question
    if (response.url.includes("https://www.something.com")) {
      // etc.
    }
  }
});