Coverage

このスキルは、Playwright を使用して Web アプリケーションのコード カバレッジ レポートを生成します。

概要

Coverage スキルを使用すると、自動化されたテストの実行中に JavaScript および CSS のコード カバレッジを測定できます。これは、テスト スイートがコードベースのどの部分をカバーしているかを理解するのに役立ちます。

主な機能

• JavaScript カバレッジ: JavaScript コードの実行カバレッジを測定
• CSS カバレッジ: CSS スタイルのカバレッジを追跡
• 詳細なレポート: ファイル単位での詳細なカバレッジ情報を生成
• レポート形式: JSON、HTML、LCOV などの複数の形式でレポートをエクスポート
• 統合: CI/CD パイプラインに統合可能

インストール

npm install @agent-skills/coverage

使用方法

基本的な例

const { Coverage } = require('@agent-skills/coverage');

const coverage = new Coverage({
  browser: 'chromium',
  url: 'https://example.com',
  outputDir: './coverage-reports'
});

await coverage.generate();

高度な設定

const coverage = new Coverage({
  browser: 'chromium',
  url: 'https://example.com',
  outputDir: './coverage-reports',
  formats: ['json', 'html', 'lcov'],
  includePatterns: ['src/**/*.js'],
  excludePatterns: ['node_modules/**', 'tests/**'],
  threshold: {
    lines: 80,
    functions: 80,
    branches: 75,
    statements: 80
  }
});

await coverage.generate();

オプション

オプション	型	説明
browser	string	使用するブラウザ (chromium, firefox, webkit)
url	string	テストする Web アプリケーションの URL
outputDir	string	カバレッジ レポートの出力ディレクトリ
formats	array	エクスポート形式 (json, html, lcov)
includePatterns	array	インクルードするファイル パターン
excludePatterns	array	除外するファイル パターン
threshold	object	カバレッジしきい値

出力形式

HTML レポート

対話的な HTML レポートが生成されます。ブラウザで開いて詳細なカバレッジ情報を閲覧できます。

JSON 形式

{
  "metadata": {
    "timestamp": "2024-01-15T10:30:00Z",
    "browser": "chromium"
  },
  "coverage": {
    "lines": 85.5,
    "functions": 88.2,
    "branches": 78.3,
    "statements": 86.1
  },
  "files": [
    {
      "path": "src/app.js",
      "lines": 92.3,
      "functions": 95.0
    }
  ]
}

ベストプラクティス

1. 定期的に測定: テスト実行のたびにカバレッジを測定する
2. しきい値を設定: 最小カバレッジ しきい値を定義する
3. トレンド追跡: 時系列でカバレッジのトレンドを監視する
4. CI/CD 統合: パイプラインでカバレッジチェックを自動化する
5. 詳細なレポート: HTML レポートで詳細を確認する

トラブルシューティング

カバレッジが 0% と表示される

• ブラウザがインストルメント化されていることを確認
• ページが完全に読み込まれるまで待機

高いカバレッジでも品質が低い

• カバレッジはコード品質の唯一の指標ではない
• テストの質を重視する

参考資料

• Playwright 公式ドキュメント
• コード カバレッジのベストプラクティス