如何使用cy.log在Cypress测试控制台打印美观的对象详情？

在Cypress 10.3.0版本中，直接使用cy.log()打印对象时，默认只会显示对象的简略信息（比如Object{2}），可以通过以下几种方式优化打印效果：

方法1：将对象转为格式化的JSON字符串 #

利用JSON.stringify()并指定缩进参数，把对象转换成带换行和缩进的可读字符串：

const loginInput = {
  userContext: "global_",
  email: finalEmail,
  password,
  verificationCode,
};

cy.log(
  "通过GraphQL认证，使用以下详情:\n",
  JSON.stringify(loginInput, null, 2)
);

这样日志会完整展示对象的层级结构，可读性大幅提升。

方法2：自定义模板字符串展示属性 #

如果只需要展示特定属性，可以手动拼接字符串，按需输出内容：

cy.log(`通过GraphQL认证，使用以下详情:
- userContext: ${loginInput.userContext}
- email: ${loginInput.email}
- password: ${loginInput.password}
- verificationCode: ${loginInput.verificationCode}`);

这种方式能避免冗余信息，聚焦关键属性。

方法3：使用cy.task输出到终端日志 #

如果对象结构复杂（比如包含无法序列化的内容），可以在配置文件中注册打印任务，将对象输出到终端：

// cypress.config.js
module.exports = defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      on('task', {
        logObject(obj) {
          console.log(obj);
          return null;
        }
      });
    },
  },
});

然后在测试代码中调用任务：

cy.task('logObject', loginInput);

终端的Cypress日志会完整展示对象的所有细节，适合复杂数据的调试。

内容的提问来源于stack exchange，提问作者coler-j