web-dev-qa-db-ja.com

angular 2のコードカバレッジ

angular 2コードのコードカバレッジを見つけるにはどうすればよいですか。vsコードエディターまたはwebstorm用のプラグインはありますか?コードの単体テストにJasmineとKarmaを使用しています。

13
Abhi

もちろん、Angular CLIの場合よりも全体的なテストカバレッジ統計を表示する場合は、入力するだけで、コマンドプロンプトウィンドウの下部が表示されます。

_ng test --cc // or --code-coverage
_

結果:

console view of tests coverage

コンポーネントの個々のテスト範囲を確認するには、次の手順を実行します。

  1. _npm install --save-dev karma-teamcity-reporter_

  2. require('karma-teamcity-reporter')をkarma.conf.jsのプラグインのリストに追加します

  3. _ng test --code-coverage --reporters=teamcity,coverage-istanbul_

新しいレポーター、teamcityを追加したため、レポーターのリストはコンマで区切られていることに注意してください。

このコマンドを実行すると、ディレクトリ内のフォルダーcoverageが表示され、テストカバレッジのグラフィカルビューの_index.html_が開きます。

enter image description here

このように、_karma.conf.js_で達成したいカバレッジしきい値を設定することもできます。

_coverageIstanbulReporter: {
      reports: ['html', 'lcovonly'],
      fixWebpackSourcePaths: true,
      thresholds: {
        statements: 90,
        lines: 90,
        branches: 90,
        functions: 90
      }
    },
_
22
ahmadalibaloch

最初に依存関係をインストールします。

npm install karma karma-jasmine karma-chrome-launcher karma-jasmine-html-reporter karma-coverage-istanbul-reporter

次に、ngテストを実行します。

ng test --code-coverage

次に、レポートを表示するサーバーを実行します。

http-server -c-1 -o -p 9875 ./coverage

次のようなものが表示されるはずです。

enter image description here

これについてのブログ記事を書きました here

4
Jason Swett

私はこれに苦労しました。私が見つけた解決策は

ng test --code-coverage

ただし、karma.conf.jsファイルでレポーターが指定されていることを確認してください(「coverage-istanbul」を使用しています)

例えばreporters: ['coverage-istanbul']

カバレッジレポートは、ルートディレクトリの「coverage」というディレクトリにあります。

1
maia
ng test --code-coverage 

または

ng test --code-coverage --reporters=teamcity,coverage-istanbul
0
Praneeth Reddy