时间戳

首页 > 解决方案 > 如何调试自定义 mocha 测试报告器？

testing - 如何调试自定义 mocha 测试报告器？

问题描述

我正在编写一个 mocha 测试报告器，我想将它用于定制的 Cypress 测试文档。哪种是调试报告代码的正确方法（可能使用 intellij Idea）？

编辑我尝试使用 intellij Idea 工具进行调试，在调试模式下运行 cypress（打开和运行）。我还尝试了允许测试调试的 IntelliJ Cypress 插件专业版。

我不能在断点处停下来。

所以我至少尝试打印一些调试日志，但我看不到我的日志。

标签： testingmocha.jscypressreporters

解决方案

我无法让它与 Cypress 一起使用，但我可以在 VSCode 中使用 Mocha。

这里的工作示例

调试步骤：

  1. 为您的项目安装 ts-node 和 typescript：npm i ts-node typescript --save-dev

  2. 使用以下内容在您的文件夹中创建 custom-reporter.ts src：（取自https://mochajs.org/api/tutorial-custom-reporter.html并稍作修改）

import { reporters, Runner, Suite, Test } from 'mocha';

const { EVENT_RUN_BEGIN, EVENT_RUN_END, EVENT_TEST_FAIL, EVENT_TEST_PASS, EVENT_SUITE_BEGIN, EVENT_SUITE_END } = Runner.constants;

// This reporter outputs test results, indenting two spaces per suite
export class CustomReporter extends reporters.Base {
  private indents = 0;

  constructor(runner: Runner) {
    super(runner);
    const stats = runner.stats;

    runner
      .once(EVENT_RUN_BEGIN, () => {
        console.info('start');
      })
      .on(EVENT_SUITE_BEGIN, (suite: Suite) => {
        this.increaseIndent();
      })
      .on(EVENT_SUITE_END, (suite: Suite) => {
        this.decreaseIndent();
      })
      .on(EVENT_TEST_PASS, (test: Test) => {
        // Test#fullTitle() returns the suite name(s)
        // prepended to the test title
        console.log(`${this.indent()}pass: ${test.fullTitle()}`);
      })
      .on(EVENT_TEST_FAIL, (test: Test, err: any) => {
        console.log(`${this.indent()}fail: ${test.fullTitle()} - error: ${err.message}`);
      })
      .once(EVENT_RUN_END, () => {
        console.log(`end: ${stats.passes}/${stats.passes + stats.failures} ok`);
      });
  }

  private indent() {
    return Array(this.indents).join('  ');
  }

  private increaseIndent() {
    this.indents++;
  }

  private decreaseIndent() {
    this.indents--;
  }
}
  1. 我们将在运行时通过 ts-node 编译 custom-reporter.ts，但我们必须将 .js 作为报告器传递给 Mocha。因此，我们按如下方式创建index.js，并按如下方式导出记者：
    module.exports = require("./src/custom-reporter").CustomReporter;
  1. package.json如果您想在不调试的情况下运行，请将测试脚本添加到您的：
 "scripts": {
    "test": "mocha -r ts-node/register specs/*.spec.ts --reporter index"
  },
  1. 在您的项目根目录中创建.vscode/launch.json，并添加以下代码：
{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Debug Mocha tests",
            "cwd": "${workspaceRoot}",
            "program": "${workspaceFolder}/node_modules/mocha/bin/_mocha",
            "args": [
              "-r",
              "ts-node/register",
              "--reporter",
              "index",
              "${workspaceFolder}/specs/**/*.spec.ts"
            ],
            "protocol": "inspector",
            "sourceMaps": true,
            "console": "integratedTerminal"
          },
    ]
}

  1. 将 VSCode 中的一些断点放入 src/custom-reporter.ts

  2. 在 VSCode 中打开Run and Debug面板（Ctrl+Shift+D），选择Debug Mocha tests并按下播放按钮

这样，您应该能够开始运行测试并在 VSCode 中命中断点。

干杯!

推荐阅读