Javascript 用Cypress覆盖现有命令

我正在努力。我正在查看路由响应的

状态

&路由的

url

，以扩展内置的功能。不幸的是，我收到这条消息

未定义的路由有一个未定义的状态代码。

在

控制台中。注意，我正在使用浏览器的
控制台
。最后，我将使用
log（）
内置方法。这就是我迄今为止所尝试的：

cypress/support/commands.js
Cypress.Commands.overwrite('route', (originalFn, response) => {
  console.log(`The route ${response.url} had a ${response.status} status code.`);

  return originalFn(response);
});

更新：

我现在正在获取路线，但仍然没有得到
响应
或
状态
。这是我当前的代码：

Cypress.Commands.overwrite('route', (originalFn, url, response) => {
  console.log(`The route ${url} had ${response} status code`);
  return originalFn(url, response);
});

当使用模式
cy.route（方法、url、响应）
时，response参数用于存根呼叫并将提供的响应返回给应用程序，请参阅（）

响应（字符串、对象、数组）

向匹配路由中的存根提供响应主体

请注意，创建对
cy.route（）
的覆盖将挂接到路由配置中，而不是捕获路由

模式
cy.route（options）
有一个选项可用于
console.log（）
响应，但是
cy.log（）
在那里不起作用，可能是因为我们在命令中调用了命令

可以改用
Cypress.log（）

cy.route({
网址：'http://example.com',
方法：“GET”，
onResponse：（response=>{
const message=`路由${response.url}'具有${response.status}状态代码。`；
const log=Cypress.log({
displayName:“路由调试”，
讯息:讯息,，
控制台操作：（）=>{
//返回一个将
//单击即可打印到开发工具控制台
返回{
讯息:讯息,，
}
}
})
log.finish（）；//删除日志微调器
})
})
/*
命令日志输出：
路由调试
路线http://example.com'有一个200状态代码。
*/
根据您想要实现的目标，有两种选择。Richard的上述描述了一种方法——我将尝试介绍其他一些方法

（注意：上的Cypress文档可能会让您更好地理解这个答案。我将尝试内联链接相关文章）

（如果您不关心代码为什么不工作，可以跳到“检查Api响应”部分）

代码中发生了什么
让我们看一下中的示例代码

在没有覆盖的情况下，
cy.route
此处只注册路由，以便稍后等待（请记住，
cy.route
本身不进行任何api调用）。覆盖后，
cy.route
将完全替换为回调：

Cypress.Commands.overwrite('route', (originalFn, url, response) => {
  console.log(`The route ${url} had ${response} status code`);
  return originalFn(url, response);
});

因此，当调用
cy.route（'**/users'）
时，它将进行计算

(originalFn, url, response) => {
  console.log(`The route ${url} had ${response} status code`); // Logs "The route **/users had undefined status code"
  return originalFn(url, response); // Registers the route with an mock value of undefined
})(originalCypressRouteFn, '**/users')

您可以看到为什么
response
未定义-它根本没有传递到路由调用，因为请求甚至还没有发出

请注意，如果我们试图模拟调用（请参阅）

您将改为登录

"The route https://localhost:7777/surveys/customer?email=john@doe.com had [object Object] status code"

检查Api响应
如果您只想检查来自api的响应，可以使用内置调试工具（在调用
cypress open
之后）使用。浏览器的“网络”选项卡可用（该选项卡将记录给定测试运行期间发出的所有请求），您还可以单击左侧面板中记录的响应，该面板将请求和响应记录到浏览器控制台

如果您试图对api调用的响应进行断言，则可以使用
cy.wait
（请参阅）在底层xhr请求完成后访问该请求：

cy.wait('@apiCheck').then((xhr) => {
  assert.isNotNull(xhr.response.body.data, '1st API call has data')
})

如果要记录CLI运行期间（使用
cypress run
）进行的API调用，可以：

打印调试信息，这将为您提供大量信息，包括所有请求和响应（请参阅）：
debug=cypress:*cypress run
（您可以更改
cypress:
，将调试范围限制为仅api调用，尽管我不知道您想要的名称空间是什么）
使用记录所有请求的插件（例如）
你用什么称呼cy.route（）？覆盖的参数是（originalFn，…原始fn的参数），所以如果调用cy.route（'myUrl'，{myResp:'}），回调将被调用（originalFn，'myUrl'，{myResp:'}）@Daniel谢谢你的回答，我不确定我是否理解你的问题。
"The route https://localhost:7777/surveys/customer?email=john@doe.com had [object Object] status code"

cy.wait('@apiCheck').then((xhr) => {
  assert.isNotNull(xhr.response.body.data, '1st API call has data')
})