如何在 visual studio 中调试打字稿茉莉花测试?
How to debug typescript jasmine tests in visual studio?
我在 Karma 中有 typescript 代码和 typescript jasmine 测试 运行ning。我可以 运行 来自命令行的测试(使用 Karma),也 运行 来自 ReSharper 测试 运行 的测试。大概我也可以 运行 使用 Karma Test Adapter VS extension or VS Adapter for Karma 进行测试。因此,运行测试有很多选择。
我的问题是:如何在 VS 调试器中调试测试?
我能够 Visual Studio 调试 typescript 茉莉花测试,运行ning in Karma,工作。哇塞,好难吃
我是这样做的:
- 在 IE 中,选项,高级:清除 "Disable script debugging (Internet Explorer)" 复选框。
- 安装 运行 karma 所需的节点模块(全局)- 如果您还没有:
npm install -g karma karma-chrome-launcher karma-ie-launcher jasmine-core karma-jasmine karma-jasmine-html-reporter
npm install -g phantomjs karma-phantomjs-launcher
- 在
karma.conf.js
中,添加对提供所需源映射和打字稿文件的支持。这是我的:
module.exports = function(config) {
config.set({
frameworks: ['jasmine'],
files: [
'bower_components/angular/angular.js',
'bower_components/angular-mocks/angular-mocks.js',
'dist/**/*.js',
'test/out/**/*.js',
// Key addition to support debugging typescript tests
// Enable serving (but don't include as scripts) sourcemap and typescript files
{pattern: '**/*.js.map', included: false},
{pattern: '**/*.ts', included: false}
],
reporters: ['html', 'progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['PhantomJS']
});
}
- 编译你的 typescript 后,运行 karma,启动 IE:
karma start --browsers=IE --reporters=html
- 在 Visual Studio 中,调试菜单 |附加到 Process... ,然后选择看起来正确的 iexplore.exe 个实例 - 例如标题可能与 Karma 网页标题匹配(当前 "Karma DEBUG RUNNER"),并且进程类型必须是 "Script"。如果打字稿调试不起作用,请尝试添加多个 iexplore.exe 实例,包括所有可能的脚本实例。
之后,您应该会在解决方案资源管理器中看到一个 "Script Documents" 文件夹,并且您应该能够在打字稿中放置断点,在浏览器中 运行 测试,并逐步执行打字稿代码。
事实证明,所有这些步骤也适用于调试 Chrome 中的 Typescript 测试和代码 - 只需将步骤 4 更改为:
karma start --browsers=Chrome --reporters=html
(跳过第 5 步)然后打开 Chrome 开发者工具来调试 chrome 中的打字稿。
我在 Karma 中有 typescript 代码和 typescript jasmine 测试 运行ning。我可以 运行 来自命令行的测试(使用 Karma),也 运行 来自 ReSharper 测试 运行 的测试。大概我也可以 运行 使用 Karma Test Adapter VS extension or VS Adapter for Karma 进行测试。因此,运行测试有很多选择。
我的问题是:如何在 VS 调试器中调试测试?
我能够 Visual Studio 调试 typescript 茉莉花测试,运行ning in Karma,工作。哇塞,好难吃
我是这样做的:
- 在 IE 中,选项,高级:清除 "Disable script debugging (Internet Explorer)" 复选框。
- 安装 运行 karma 所需的节点模块(全局)- 如果您还没有:
npm install -g karma karma-chrome-launcher karma-ie-launcher jasmine-core karma-jasmine karma-jasmine-html-reporter
npm install -g phantomjs karma-phantomjs-launcher
- 在
karma.conf.js
中,添加对提供所需源映射和打字稿文件的支持。这是我的:
module.exports = function(config) {
config.set({
frameworks: ['jasmine'],
files: [
'bower_components/angular/angular.js',
'bower_components/angular-mocks/angular-mocks.js',
'dist/**/*.js',
'test/out/**/*.js',
// Key addition to support debugging typescript tests
// Enable serving (but don't include as scripts) sourcemap and typescript files
{pattern: '**/*.js.map', included: false},
{pattern: '**/*.ts', included: false}
],
reporters: ['html', 'progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['PhantomJS']
});
}
- 编译你的 typescript 后,运行 karma,启动 IE:
karma start --browsers=IE --reporters=html
- 在 Visual Studio 中,调试菜单 |附加到 Process... ,然后选择看起来正确的 iexplore.exe 个实例 - 例如标题可能与 Karma 网页标题匹配(当前 "Karma DEBUG RUNNER"),并且进程类型必须是 "Script"。如果打字稿调试不起作用,请尝试添加多个 iexplore.exe 实例,包括所有可能的脚本实例。
之后,您应该会在解决方案资源管理器中看到一个 "Script Documents" 文件夹,并且您应该能够在打字稿中放置断点,在浏览器中 运行 测试,并逐步执行打字稿代码。
事实证明,所有这些步骤也适用于调试 Chrome 中的 Typescript 测试和代码 - 只需将步骤 4 更改为:
karma start --browsers=Chrome --reporters=html
(跳过第 5 步)然后打开 Chrome 开发者工具来调试 chrome 中的打字稿。