angular - Angular(ng 测试)调试 - VS Code 不在断点处停止
问题描述
我目前遇到问题。我开始为我的 Angular 应用程序编写测试并想调试它们。现在我用谷歌搜索了很多,我尝试了来自微软的食谱(https://github.com/Microsoft/vscode-recipes/tree/master/Angular-CLI),我最接近让它工作的是这个 BlogPost
http://blog.mlewandowski.com/Debugging-Karma-tests-with-VSCode.html
现在至少我可以将调试器附加到 VS-Code。但是 VS Code 仍然不会在断点处停止,但测试会继续运行。VS Code 中的断点也将保持未经验证(见图)
这就是我到目前为止所拥有的(我只提供我更改过的部分,而不是发布太多代码)。
任何想法我做错了什么?除了调试工作得很好。我可以调试我的 node.js 应用程序并且调试 ng serve 也可以正常工作。
启动.json
{
"type": "chrome",
"request": "attach",
"name": "MyApp - Tests",
"address": "localhost",
"port": 9222,
"pathMapping": {
"/": "${workspaceRoot}",
"/base/": "${workspaceRoot}"
}
}
业力.conf.js
browsers: [
'ChromeDebugging'
],
customLaunchers: {
ChromeDebugging: {
base: 'Chrome',
flags: ['--remote-debugging-port=9222']
}
}
解决方案
您是否安装了“Debugger for Chrome”扩展程序。
看看这个指南。 https://github.com/Microsoft/vscode-recipes/tree/master/Angular-CLI
更新:这是我的 launch.json 也许你可以试试。
{
"version": "0.2.0",
"configurations": [
{
"name": "ng serve",
"type": "chrome",
"request": "launch",
"url": "http://localhost:4200/#",
"webRoot": "${workspaceFolder}"
},
{
"name": "ng test",
"type": "chrome",
"request": "launch",
"url": "http://localhost:9876/debug.html",
"webRoot": "${workspaceFolder}"
},
{
"name": "ng e2e",
"type": "node",
"request": "launch",
"program": "${workspaceFolder}/node_modules/protractor/bin/protractor",
"protocol": "inspector",
"args": ["${workspaceFolder}/e2e/protractor.conf.js"]
}
]
}
因果报应
// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html
module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['jasmine', '@angular-devkit/build-angular'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'),
require('@angular-devkit/build-angular/plugins/karma')
],
client: {
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
dir: require('path').join(__dirname, '../coverage'),
reports: ['html', 'lcovonly'],
fixWebpackSourcePaths: true
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false
});
};
推荐阅读
- sql-server - 如何部署 SSIS 包?
- qt - 如何获取关于ColumnLayout内部元素的笛卡尔坐标
- android - Android键盘重叠输入字段仅在类型输入后滚动
- sql - 无法在开放式办公数据库的表中添加记录
- sql - 使用用户 ID 和日期范围创建 SQL 函数视图
- angular - 对嵌套对象应用过滤器后如何返回父可观察对象的结果
- javascript - 如何在reactjs中提交时推入数组?
- javascript - 在谷歌地图标记上显示信息
- html - Box 100vh 不会占用整个页面
- amazon-web-services - 尝试将对象放入存储桶时出现间歇性 Terraform 失败