如何在Visual Studio中調試打字稿茉莉花測試？

Question

我有在Karma內部運行的打字稿代碼和打字稿茉莉花測試。我可以從命令行運行測試（使用Karma），也可以從ReSharper測試運行器運行測試。據推測，我也可以使用Karma Test Adapter VS extension或VS Adapter for Karma進行測試。所以，運行測試的選項很多。

我的問題是：如何在VS調試器中調試測試？

Answer 1

我能夠得到Visual Studio調試打字稿茉莉花測試，運行在Karma，正在工作。哇，那是一口。

我是這樣做的：

1. 在IE瀏覽器，選項，高級：清除 「禁止腳本調試器（Internet Explorer）」 複選框。 （全局）所需
2. 安裝節點模塊運行業力 - 如果你有尚未：

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'] 
    }); 

} 

編譯你的打字稿，運行因果報應，啓動IE後：

karma start --browsers=IE --reporters=html 

1. 在Visual Studio中，調試菜單|附加到進程...，然後選擇看起來正確的iexplore.exe實例 - 例如，標題可能與Karma網頁標題（當前爲「Karma DEBUG RUNNER」）匹配，並且進程類型必須爲「腳本」。如果typescript調試不起作用，請嘗試添加多個iexplore.exe實例，包括所有可能的Script實例。

之後，您應該在解決方案資源管理器中看到一個「腳本文檔」文件夾，您應該能夠在腳本中放置斷點，在瀏覽器中運行測試並逐步打印腳本代碼。

事實證明，所有這些步驟也可用於調試在Chrome打字稿測試和代碼的工作 - 只是改變第4步：

karma start --browsers=Chrome --reporters=html 

（跳過步驟5），然後打開Chrome開發者工具調試打字稿中鉻。