Question

我试图让vscode启动摩卡并停在断点上。当我手动运行测试时，我使用以下命令：

$ mocha -r node_modules/reflect-metadata/Reflect.js --recursive

我也可以使用以下命令：

mocha -r node_modules/reflect-metadata/Reflect.js --recursive --debug-brk

以下调试配置：

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Attach to Process",
            "type": "node",
            "request": "attach",
            "processId": "${command.PickProcess}",
            "port": 5858,
            "sourceMaps": true,
            "outFiles": [
                "src/**/**.js",
                "test/**/**.test.js"
            ]
        }
    ]
}

这允许我在.js文件中设置断点并查看原始的TypeScript源。但我无法直接在TypeScript代码中设置断点。

我的第二个问题是我想在VSCode UI中按下debug并自动在调试模式下触发mocha，然后再直接在.ts文件中点击断点。

这可能吗？

Answer 1

我已经有了与@JasonDent非常相似的设置，但是没有用。 node2设置已经过时（vscode会警告你）。相反，只需添加"protocol": "inspector"，现在点击了voilá断点：

    {
        "name": "Mocha",
        "type": "node",
        "protocol": "inspector",
        "request": "launch",
        "cwd": "${workspaceRoot}",
        "preLaunchTask": "tsc",
        "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
        "args": [ "--no-timeouts", "--colors", "${workspaceRoot}/out/test/**/*.js" ],
        "stopOnEntry": false,
        "runtimeExecutable": null,
        "env": {
           "NODE_ENV": "testing"
        },
        "sourceMaps": true
    },

Answer 2

这是基于VSCode中最新任务构建的配置。开箱即用它不适用于Typescript！？无论如何，结合@Jason Dent的答案我能够让它运作起来！它还使用较新的node2调试器。对于您的设置，请将构建/测试更改为放置文件的位置。

{
    "type": "node2",
    "request": "launch",
    // Automatically stop program after launch.
    "stopOnEntry": false,
    "name": "Mocha Tests",
    "cwd": "${workspaceRoot}",
    "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/mocha",
    "windows": {
        "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/mocha.cmd"
    },
    "runtimeArgs": [
        "-u",
        "tdd",
        "--timeout",
        "999999",
        "--colors",
        "--recursive",
        "${workspaceRoot}/build/test"
    ],
    "sourceMaps": true,
    "outFiles": ["${workspaceRoot}/build"],
    "internalConsoleOptions": "openOnSessionStart",

     // Prevents debugger from stepping into this code :)
    "skipFiles": [
        "node_modules/**/*.js",
        "<node_internals>/**/*.js"
    ]
},

Answer 3

我还建议使用单独的启动配置文件来调试Mocha测试。我有以下配置，使用Mocha打字稿测试。我的launch.json调试mocha配置文件如下所示：

{
        "type": "node",
        "request": "launch",
        "name": "Debug tests",
        "runtimeExecutable": "mocha",
        "windows": {
            "runtimeExecutable": "mocha.cmd"
        },
        "preLaunchTask": "build:tests",
        "runtimeArgs": [
            "--debug-brk",
            "-p",
            "tsconfig.test.json",
            "test-js/test/index.js"
        ],
        "program": "${workspaceRoot}\\test\\index.ts",
        "outFiles": [
            "${workspaceRoot}\\test-js\\**\\*.js"
        ],
        "port": 5858
    },

build：tests 是一个vs代码任务，运行＆＃39; tsc -p tsconfig.test.json＆＃39; 。我在过去使用gulp-typescript源码图生成了一些问题，这就是我目前使用TSC的原因。

我的tsconfig.test.json是：

{
"compilerOptions": {
    "outDir": "./test-js",
    "module": "commonjs",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es2016",
    "declaration": true,
    "sourceMap": true,
    "inlineSources": true
},
"files": [
    "./test/index.ts"
]
}

Answer 4

我希望你现在明白了。

基本答案，是的，您可以在.ts文件中设置断点并使用VSCode调试它们。他们在这里进行了一般调试：Debugging with VSCode

关键部分是您需要为mocha显式创建启动配置文件。这只是我如何让它工作的一个例子。您需要在.vscode/launch.json。

中添加以下内容

{
    // Name of configuration; appears in the launch configuration drop down menu.
    "name": "Run mocha",
    // Type of configuration. Possible values: "node", "mono".
    "type": "node",
    // Request type "launch" or "attach"
    "request": "launch",
    // Workspace relative or absolute path to the program.
    "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
    // Automatically stop program after launch.
    "stopOnEntry": false,
    // Command line arguments passed to the program (mocha in this case).
    "args": ["--recursive", "lib/*.test.js"],
    // Workspace relative or absolute path to the working directory of the program being debugged. Default is the current workspace.
    "cwd": "${workspaceRoot}",
    // Workspace relative or absolute path to the runtime executable to be used. Default is the runtime executable on the PATH.
    "runtimeExecutable": null,
    "outDir": "${workspaceRoot}/lib",
    "sourceMaps": true,
    // Environment variables passed to the program.
    "env": { "NODE_ENV": "test"}
}

这将启动mocha来测试lib目录中的*.test.js文件。

我使用了以下tsconfig.json文件，并在代码旁边进行了单元测试：

{
  "compilerOptions": {
    "target": "es5",
    "declaration": true,
    "module": "commonjs",
    "moduleResolution": "node",
    "outDir": "./lib",
    "sourceMap": true,
    "removeComments": true
  },
  "include": [
    "src/**/*"
  ],
  "exclude": [
    "node_modules",
    "data",
    "lib"
  ]
}

TypeScript中的断点与mocha和VSCODE

4 个答案: