首页 文章

如何在Visual Studio代码中使用Karma / Jasmine调试单元测试？

提问于
浏览 次
11

我希望能够在Visual Studio Code中调试单元测试，但到目前为止它已经是一个混合包 .

我的设置：

launch.json

{
   "version": "0.2.0",
   "configurations": [
           {
              "name": "Debug tests",
              "type": "chrome",
              "request": "attach",
              "port": 9222,
              "sourceMaps": true,
              "webRoot": "${workspaceRoot}"
           }
   ]
}

karma.config.js

customLaunchers: {
   Chrome_with_debugging: {
     base: 'Chrome',
     flags: ['--remote-debugging-port=9222']
   }
}

这似乎在某种程度上起作用，如果我启动VS Code调试器它似乎附加（底栏变为橙色） . 如果我做出改变，Karma也会启动调试器 - 但是它总是暂停在 zone.js （顺便说一下这是一个Angular项目），而不会以任何方式干扰：

Paused in zone.js

如果我点击“继续”它实际上击中了我的断点

enter image description here

我可以检查一些变量，但不是全部，

Some vars are displayed, some not

例如，我看不到 actual 的值传入Jasmine的 expect 方法 .

所以a）为什么调试器总是在 zone.js 内暂停 - 测试的代码来自Redux reducer并在任何Angular上下文之外调用，b）我无法检查局部变量（这是一个现在showstopper）？

debugging karma-runner visual-studio-code

1 回答

  • 12

    在karma.conf.js中，我在您的版本中更新了添加的调试选项 .

    customLaunchers: {
   Chrome_with_debugging: {
     base: 'Chrome',
     flags: ['--remote-debugging-port=9222'],
     debug: true
}}

    launch.json 将下面的代码段添加为启动配置，

    {
    "name": "Debug tests",
    "type": "chrome",
    "request": "attach",
    "port": 9222,
    "sourceMaps": true,
    "webRoot": "${workspaceRoot}"
}

    然后使用以下命令触发测试，

    ng test --browsers Chrome_with_debugging

    使用Visual Studio代码调试选项“调试测试”来附加到UT . 有了这个，我能够使用“Visual Studio Code Debugger for Chrome extension”中的断点调试单元测试 .

    问候

    Basanth

    回复于

相关问题