@machina.ai/openapi-contract-tester 2.1.0

package/dist/reporters/report-sections.js

@@ -0,0 +1,481 @@
+/**
+ * Report Section Generators for HTML Report
+ *
+ * Renders the Coverage, AI Analysis, Source Comparison and Root Cause
+ * sections, plus the quick-stats tables (by category / by endpoint).
+ *
+ * @module reporters/report-sections
+ */
+import { getMethodColorClass, getPriorityBadgeClass, getPatternBorderClass, getRootCauseLabel, getRootCauseBorderColor, getRootCausePriorityBadge, getMethodBadgeClass, } from './report-utils.js';
+/**
+ * Renders the "Results by Category" quick-stats table.
+ */
+export function generateCategoryTable(byCategory) {
+    if (!Object.keys(byCategory).length)
+        return '';
+    return `
+    <div class="bg-white rounded-lg p-6 border border-gray-200">
+      <h3 class="text-lg font-semibold text-gray-900 mb-4">Results by Category</h3>
+      <div class="overflow-x-auto">
+        <table class="w-full border-collapse">
+          <thead>
+            <tr class="border-b-2 border-gray-200">
+              <th class="px-4 py-3 text-left text-sm font-semibold text-gray-700">Category</th>
+              <th class="px-4 py-3 text-left text-sm font-semibold text-gray-700">Total</th>
+              <th class="px-4 py-3 text-left text-sm font-semibold text-gray-700">Passed</th>
+              <th class="px-4 py-3 text-left text-sm font-semibold text-gray-700">Failed</th>
+              <th class="px-4 py-3 text-left text-sm font-semibold text-gray-700">Pass Rate</th>
+            </tr>
+          </thead>
+          <tbody>
+            ${Object.entries(byCategory).map(([category, stats]) => {
+        const rate = stats.total > 0 ? ((stats.passed / stats.total) * 100).toFixed(1) : '0.0';
+        return `
+                <tr class="border-b border-gray-100 hover:bg-gray-50 transition-colors">
+                  <td class="px-4 py-3 font-medium text-gray-900">${category}</td>
+                  <td class="px-4 py-3 text-gray-600">${stats.total}</td>
+                  <td class="px-4 py-3">
+                    <span class="px-2.5 py-1 bg-emerald-50 text-emerald-700 rounded-md text-sm font-medium border border-emerald-200">
+                      ${stats.passed}
+                    </span>
+                  </td>
+                  <td class="px-4 py-3">
+                    <span class="px-2.5 py-1 bg-red-50 text-red-700 rounded-md text-sm font-medium border border-red-200">
+                      ${stats.failed}
+                    </span>
+                  </td>
+                  <td class="px-4 py-3 text-gray-700 font-medium">${rate}%</td>
+                </tr>
+              `;
+    }).join('')}
+          </tbody>
+        </table>
+      </div>
+    </div>
+  `;
+}
+/**
+ * Renders the "Results by Endpoint" quick-stats table.
+ */
+export function generateEndpointTable(byEndpoint) {
+    if (!Object.keys(byEndpoint).length)
+        return '';
+    return `
+    <div class="bg-white rounded-lg p-6 border border-gray-200">
+      <h3 class="text-lg font-semibold text-gray-900 mb-4">Results by Endpoint</h3>
+      <div class="overflow-x-auto">
+        <table class="w-full border-collapse">
+          <thead>
+            <tr class="border-b-2 border-gray-200">
+              <th class="px-4 py-3 text-left text-sm font-semibold text-gray-700">Endpoint</th>
+              <th class="px-4 py-3 text-left text-sm font-semibold text-gray-700">Total</th>
+              <th class="px-4 py-3 text-left text-sm font-semibold text-gray-700">Passed</th>
+              <th class="px-4 py-3 text-left text-sm font-semibold text-gray-700">Failed</th>
+              <th class="px-4 py-3 text-left text-sm font-semibold text-gray-700">Pass Rate</th>
+            </tr>
+          </thead>
+          <tbody>
+            ${Object.entries(byEndpoint).map(([endpoint, stats]) => {
+        const rate = stats.total > 0 ? ((stats.passed / stats.total) * 100).toFixed(1) : '0.0';
+        return `
+                <tr class="border-b border-gray-100 hover:bg-gray-50 transition-colors">
+                  <td class="px-4 py-3">
+                    <code class="bg-gray-100 px-2 py-1 rounded text-sm font-mono text-gray-800 border border-gray-200">${endpoint}</code>
+                  </td>
+                  <td class="px-4 py-3 text-gray-600">${stats.total}</td>
+                  <td class="px-4 py-3">
+                    <span class="px-2.5 py-1 bg-emerald-50 text-emerald-700 rounded-md text-sm font-medium border border-emerald-200">
+                      ${stats.passed}
+                    </span>
+                  </td>
+                  <td class="px-4 py-3">
+                    <span class="px-2.5 py-1 bg-red-50 text-red-700 rounded-md text-sm font-medium border border-red-200">
+                      ${stats.failed}
+                    </span>
+                  </td>
+                  <td class="px-4 py-3 text-gray-700 font-medium">${rate}%</td>
+                </tr>
+              `;
+    }).join('')}
+          </tbody>
+        </table>
+      </div>
+    </div>
+  `;
+}
+/**
+ * Renders the Endpoint Coverage section.
+ */
+export function generateCoverageSection(coverage) {
+    return `
+  <section class="mb-8">
+    <div class="container">
+      <div class="bg-white rounded-xl shadow-lg p-8">
+        <div class="flex items-center gap-3 mb-6">
+          <span class="text-4xl">📊</span>
+          <h2 class="text-2xl font-bold text-gray-800">Cobertura de Endpoints</h2>
+        </div>
+
+        <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
+          <div class="bg-gradient-to-br from-blue-50 to-blue-100 rounded-lg p-6 border border-blue-200">
+            <div class="text-sm font-medium text-blue-600 mb-2">Total Endpoints</div>
+            <div class="text-3xl font-bold text-blue-900">${coverage.totalEndpoints}</div>
+          </div>
+          <div class="bg-gradient-to-br from-green-50 to-green-100 rounded-lg p-6 border border-green-200">
+            <div class="text-sm font-medium text-green-600 mb-2">Endpoints Probados</div>
+            <div class="text-3xl font-bold text-green-900">${coverage.testedEndpoints}</div>
+          </div>
+          <div class="bg-gradient-to-br from-purple-50 to-purple-100 rounded-lg p-6 border border-purple-200">
+            <div class="text-sm font-medium text-purple-600 mb-2">Porcentaje de Cobertura</div>
+            <div class="text-3xl font-bold text-purple-900">${coverage.coveragePercentage}</div>
+          </div>
+        </div>
+
+        ${coverage.uncoveredEndpoints && coverage.uncoveredEndpoints.length > 0 ? `
+        <div class="mb-6">
+          <h3 class="text-lg font-semibold text-gray-800 mb-4 flex items-center gap-2">
+            <span>⚠️</span>
+            Endpoints sin Cobertura (${coverage.uncoveredEndpoints.length})
+          </h3>
+          <div class="bg-yellow-50 border border-yellow-200 rounded-lg p-4">
+            <div class="space-y-2">
+              ${coverage.uncoveredEndpoints.slice(0, 10).map(endpoint => `
+                <div class="flex items-center gap-3 text-sm">
+                  <span class="px-2 py-1 rounded font-mono text-xs font-semibold ${getMethodColorClass(endpoint.method)}">${endpoint.method}</span>
+                  <span class="text-gray-700 font-mono">${endpoint.path}</span>
+                </div>
+              `).join('')}
+              ${coverage.uncoveredEndpoints.length > 10 ? `
+                <div class="text-sm text-gray-600 italic mt-2">... y ${coverage.uncoveredEndpoints.length - 10} más</div>
+              ` : ''}
+            </div>
+          </div>
+        </div>
+        ` : ''}
+
+        ${coverage.endpointDetails && coverage.endpointDetails.length > 0 ? `
+        <div>
+          <h3 class="text-lg font-semibold text-gray-800 mb-4">📋 Detalle por Endpoint</h3>
+          <div class="overflow-x-auto">
+            <table class="min-w-full divide-y divide-gray-200">
+              <thead class="bg-gray-50">
+                <tr>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Endpoint</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Tests</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Exitosos</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Fallidos</th>
+                  <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Estado</th>
+                </tr>
+              </thead>
+              <tbody class="bg-white divide-y divide-gray-200">
+                ${coverage.endpointDetails.map(detail => `
+                <tr class="hover:bg-gray-50">
+                  <td class="px-6 py-4 whitespace-nowrap">
+                    <span class="px-2 py-1 rounded font-mono text-xs font-semibold ${getMethodColorClass(detail.method)}">${detail.method}</span>
+                    <span class="ml-2 text-sm text-gray-700 font-mono">${detail.path}</span>
+                  </td>
+                  <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">${detail.totalTests}</td>
+                  <td class="px-6 py-4 whitespace-nowrap text-sm text-green-600 font-semibold">${detail.passedTests}</td>
+                  <td class="px-6 py-4 whitespace-nowrap text-sm text-red-600 font-semibold">${detail.failedTests}</td>
+                  <td class="px-6 py-4 whitespace-nowrap">
+                    ${detail.failedTests === 0 ?
+        '<span class="px-3 py-1 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">✅ OK</span>' :
+        '<span class="px-3 py-1 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text-red-800">❌ Fallos</span>'}
+                  </td>
+                </tr>
+                `).join('')}
+              </tbody>
+            </table>
+          </div>
+        </div>
+        ` : ''}
+      </div>
+    </div>
+  </section>
+  `;
+}
+/**
+ * Renders the AI-Powered Analysis section.
+ */
+export function generateAiAnalysisSection(aiAnalysis) {
+    return `
+  <section class="mb-8">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900 rounded-2xl shadow-2xl p-6 md:p-8 text-white">
+        <div class="flex flex-wrap items-center gap-4 mb-6">
+          <span class="text-5xl">🤖</span>
+          <h2 class="text-2xl md:text-3xl font-bold">AI-Powered Analysis</h2>
+          <span class="px-4 py-2 bg-gradient-to-r from-indigo-600 to-purple-600 rounded-full text-sm font-semibold">LLM Analysis</span>
+        </div>
+
+        <div class="bg-white bg-opacity-10 rounded-xl p-6 mb-6 backdrop-blur-sm">
+          <h3 class="text-xl font-bold mb-3 flex items-center gap-2">
+            <span>📋</span> Resumen Ejecutivo
+          </h3>
+          ${typeof aiAnalysis.summary === 'string' ? `
+            <p class="text-gray-100 leading-relaxed">${aiAnalysis.summary}</p>
+          ` : `
+            <div class="space-y-3">
+              ${Object.entries(aiAnalysis.summary).map(([key, value]) => `
+                <div class="bg-white bg-opacity-5 rounded-lg p-4">
+                  <div class="text-sm font-semibold text-indigo-300 mb-2">${key.replace(/_/g, ' ').replace(/\b\w/g, l => l.toUpperCase())}</div>
+                  ${typeof value === 'object' && value !== null ? `
+                    <div class="space-y-2 ml-3">
+                      ${Object.entries(value).map(([subKey, subValue]) => `
+                        <div class="text-sm">
+                          <span class="text-gray-300">${subKey.replace(/_/g, ' ')}:</span>
+                          <span class="text-white font-medium ml-2">${subValue}</span>
+                        </div>
+                      `).join('')}
+                    </div>
+                  ` : `
+                    <div class="text-white font-medium">${value}</div>
+                  `}
+                </div>
+              `).join('')}
+            </div>
+          `}
+        </div>
+
+        ${aiAnalysis.criticalIssues && aiAnalysis.criticalIssues.length > 0 ? `
+        <div class="mb-8">
+          <h3 class="text-xl font-bold text-red-600 mb-4 flex items-center gap-2">
+            <span>🚨</span> Issues Críticos
+          </h3>
+          <div class="space-y-4">
+            ${aiAnalysis.criticalIssues.map(issue => `
+            <div class="bg-red-50 border-l-4 border-red-500 p-4 rounded-r-lg">
+              <h4 class="font-bold text-red-900 mb-2">${issue.title}</h4>
+              <p class="text-red-800 mb-3">${issue.description}</p>
+              <div class="flex flex-wrap gap-2">
+                <span class="text-xs font-semibold text-red-600">Endpoints afectados:</span>
+                ${issue.affectedEndpoints.map(ep => `
+                  <span class="px-2 py-1 bg-red-100 text-red-700 rounded text-xs font-mono">${ep}</span>
+                `).join('')}
+              </div>
+            </div>
+            `).join('')}
+          </div>
+        </div>
+        ` : ''}
+
+        ${aiAnalysis.patterns && aiAnalysis.patterns.length > 0 ? `
+        <div class="mb-8">
+          <h3 class="text-xl font-bold text-gray-800 mb-4 flex items-center gap-2">
+            <span>🔍</span> Patrones Detectados
+          </h3>
+          <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+            ${aiAnalysis.patterns.map(pattern => `
+            <div class="border rounded-lg p-4 ${getPatternBorderClass(pattern.impact)}">
+              <div class="flex items-start justify-between mb-2">
+                <h4 class="font-semibold text-gray-900">${pattern.pattern}</h4>
+                <span class="px-2 py-1 rounded text-xs font-bold ${getPriorityBadgeClass(pattern.impact)}">${pattern.impact.toUpperCase()}</span>
+              </div>
+              <p class="text-sm text-gray-700 mb-2">${pattern.description}</p>
+              <div class="text-xs text-gray-500">Ocurrencias: <strong>${pattern.occurrences}</strong></div>
+            </div>
+            `).join('')}
+          </div>
+        </div>
+        ` : ''}
+
+        ${aiAnalysis.recommendations && aiAnalysis.recommendations.length > 0 ? `
+        <div class="mb-6">
+          <h3 class="text-xl font-bold mb-4 flex items-center gap-2">
+            <span>🔧</span> Correcciones Recomendadas
+          </h3>
+          <div class="space-y-4">
+            ${aiAnalysis.recommendations.map((rec, i) => `
+            <div class="flex gap-4 bg-white bg-opacity-10 rounded-xl p-5 border-l-4 border-indigo-500 backdrop-blur-sm hover:bg-opacity-15 transition-colors">
+              <div class="flex-shrink-0 w-8 h-8 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold text-sm">
+                ${i + 1}
+              </div>
+              <div class="flex-1 space-y-2">
+                <div class="text-yellow-300">
+                  <strong>Problema:</strong> ${rec.issue}
+                  ${rec.priority ? `<span class="ml-2 px-2 py-1 rounded text-xs font-bold ${getPriorityBadgeClass(rec.priority)}">${rec.priority.toUpperCase()}</span>` : ''}
+                </div>
+                <div class="text-green-300">
+                  <strong>Solución:</strong> ${rec.fix}
+                </div>
+                ${rec.autoRepairSuggestion ? `
+                <div class="text-blue-300 text-sm">
+                  <strong>Auto-reparación:</strong> ${rec.autoRepairSuggestion}
+                </div>
+                ` : ''}
+              </div>
+            </div>
+            `).join('')}
+          </div>
+        </div>
+        ` : ''}
+      </div>
+    </div>
+  </section>
+  `;
+}
+/**
+ * Renders the Source Comparison (OpenAPI vs Code vs PRD) section.
+ */
+export function generateSourceComparisonSection(sourceComparison) {
+    return `
+  <section class="source-comparison">
+    <div class="container">
+      <div class="comparison-card">
+        <div class="comparison-header">
+          <span class="comparison-icon">🔍</span>
+          <h2>Source Comparison Analysis</h2>
+          <span class="comparison-badge">OpenAPI vs Code vs PRD</span>
+        </div>
+
+        <div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
+          <div class="bg-white rounded-lg shadow p-4">
+            <div class="text-sm font-medium text-gray-600 mb-2">Total Endpoints</div>
+            <div class="text-3xl font-bold text-blue-600">${sourceComparison.summary.totalEndpointsInSpec + sourceComparison.summary.totalEndpointsInCode}</div>
+            <div class="text-xs text-gray-500 mt-2">
+              Spec: ${sourceComparison.summary.totalEndpointsInSpec} | Code: ${sourceComparison.summary.totalEndpointsInCode}
+            </div>
+          </div>
+
+          <div class="bg-white rounded-lg shadow p-4">
+            <div class="text-sm font-medium text-gray-600 mb-2">Aligned</div>
+            <div class="text-3xl font-bold text-green-600">${sourceComparison.summary.matchingEndpoints}</div>
+            <div class="text-xs text-gray-500 mt-2">
+              ${((sourceComparison.summary.matchingEndpoints / (sourceComparison.summary.totalEndpointsInSpec || 1)) * 100).toFixed(0)}% coverage
+            </div>
+          </div>
+
+          <div class="bg-white rounded-lg shadow p-4">
+            <div class="text-sm font-medium text-gray-600 mb-2">Discrepancies</div>
+            <div class="text-3xl font-bold text-red-600">${sourceComparison.summary.discrepanciesFound}</div>
+            <div class="text-xs text-gray-500 mt-2">
+              Errors: ${sourceComparison.summary.errors} | Warnings: ${sourceComparison.summary.warnings}
+            </div>
+          </div>
+
+          <div class="bg-white rounded-lg shadow p-4">
+            <div class="text-sm font-medium text-gray-600 mb-2">Priority Breakdown</div>
+            <div class="flex items-center gap-2 mt-2">
+              <span class="px-2 py-1 text-xs font-bold bg-red-600 text-white rounded">${sourceComparison.summary.critical}</span>
+              <span class="px-2 py-1 text-xs font-bold bg-orange-500 text-white rounded">${sourceComparison.summary.high}</span>
+              <span class="px-2 py-1 text-xs font-bold bg-yellow-500 text-white rounded">${sourceComparison.summary.medium}</span>
+              <span class="px-2 py-1 text-xs font-bold bg-blue-500 text-white rounded">${sourceComparison.summary.low}</span>
+            </div>
+            <div class="text-xs text-gray-500 mt-2">Critical | High | Medium | Low</div>
+          </div>
+        </div>
+
+        ${sourceComparison.discrepancies.length > 0 ? `
+        <div class="comparison-discrepancies">
+          <h3 class="text-xl font-bold text-gray-800 mb-4 flex items-center gap-2">
+            <span>⚠️</span> Discrepancies (${sourceComparison.discrepancies.length})
+          </h3>
+          <div class="space-y-3">
+            ${sourceComparison.discrepancies.slice(0, 10).map(disc => `
+            <div class="bg-white border-l-4 ${disc.priority === 'critical' ? 'border-red-600' : disc.priority === 'high' ? 'border-orange-500' : disc.priority === 'medium' ? 'border-yellow-500' : 'border-blue-500'} p-4 rounded-r-lg">
+              <div class="flex items-center gap-2 mb-2">
+                <span class="px-2 py-1 text-xs font-bold rounded ${disc.priority === 'critical' ? 'bg-red-600 text-white' : disc.priority === 'high' ? 'bg-orange-500 text-white' : disc.priority === 'medium' ? 'bg-yellow-500 text-white' : 'bg-blue-500 text-white'}">${disc.priority.toUpperCase()}</span>
+                <span class="text-sm font-semibold text-gray-600">${disc.type.replace(/_/g, ' ').toUpperCase()}</span>
+                ${disc.endpoint ? `<span class="text-sm font-mono text-gray-700">${disc.endpoint.method} ${disc.endpoint.path}</span>` : ''}
+              </div>
+              <p class="text-gray-800 mb-2">${disc.description}</p>
+              ${disc.suggestion ? `
+              <div class="bg-blue-50 border-l-4 border-blue-400 p-3 mt-2">
+                <p class="text-sm text-blue-800"><strong>💡 Suggestion:</strong> ${disc.suggestion}</p>
+              </div>
+              ` : ''}
+            </div>
+            `).join('')}
+          </div>
+          ${sourceComparison.discrepancies.length > 10 ? `
+          <p class="text-sm text-gray-600 mt-4">Showing 10 of ${sourceComparison.discrepancies.length} discrepancies. View full comparison report for details.</p>
+          ` : ''}
+        </div>
+        ` : ''}
+      </div>
+    </div>
+  </section>
+  `;
+}
+/**
+ * Renders the Root Cause Analysis section.
+ */
+export function generateRootCauseSection(failureDiscrepancyCorrelation) {
+    return `
+  <section class="root-cause-analysis">
+    <div class="container">
+      <div class="root-cause-card">
+        <div class="root-cause-header">
+          <span class="root-cause-icon">🎯</span>
+          <h2>Root Cause Analysis</h2>
+          <span class="root-cause-badge">${failureDiscrepancyCorrelation.correlationRate} Identified</span>
+        </div>
+
+        <div class="root-cause-summary">
+          <p class="mb-4">
+            <strong>${failureDiscrepancyCorrelation.correlatedFailures} of ${failureDiscrepancyCorrelation.totalFailures}</strong> test failures have been correlated with known discrepancies, providing actionable root cause insights.
+          </p>
+
+          <div class="grid grid-cols-2 md:grid-cols-4 gap-3 mb-6">
+            ${Object.entries(failureDiscrepancyCorrelation.summaryByRootCause)
+        .filter(([_, count]) => count > 0)
+        .map(([rootCause, count]) => `
+              <div class="bg-gray-50 rounded-lg p-3 text-center border-2 ${getRootCauseBorderColor(rootCause)}">
+                <div class="text-2xl font-bold text-gray-800">${count}</div>
+                <div class="text-xs text-gray-600 mt-1">${getRootCauseLabel(rootCause)}</div>
+              </div>
+            `).join('')}
+          </div>
+        </div>
+
+        <div class="correlations-list">
+          <h3 class="text-lg font-bold text-white mb-4">🔗 Failures with Identified Root Causes</h3>
+          <div class="space-y-3">
+            ${failureDiscrepancyCorrelation.correlations
+        .filter(c => c.rootCause !== 'unknown')
+        .slice(0, 15)
+        .map(corr => `
+              <div class="correlation-item bg-white bg-opacity-10 rounded-lg p-4 border-l-4 ${getRootCauseBorderColor(corr.rootCause)}">
+                <div class="flex items-start justify-between mb-2">
+                  <div class="flex-grow">
+                    <div class="flex items-center gap-2 mb-2">
+                      <span class="px-2 py-1 text-xs font-bold rounded ${getMethodBadgeClass(corr.failure.method)}">${corr.failure.method}</span>
+                      <span class="text-sm font-mono text-white">${corr.failure.path}</span>
+                      <span class="px-2 py-1 text-xs font-semibold rounded bg-red-600 text-white">${corr.failure.actualStatus}</span>
+                    </div>
+                    <div class="flex items-center gap-2 mb-2">
+                      <span class="px-2 py-1 text-xs font-bold rounded ${getRootCausePriorityBadge(corr.rootCause)}">${getRootCauseLabel(corr.rootCause)}</span>
+                      <span class="text-xs text-gray-300">Confidence: ${(corr.confidence * 100).toFixed(0)}%</span>
+                      ${corr.autoRepairable ? '<span class="px-2 py-1 text-xs font-semibold rounded bg-green-600 text-white">Auto-Repairable</span>' : ''}
+                    </div>
+                  </div>
+                </div>
+
+                <div class="text-sm text-gray-200 mb-2">
+                  <strong>🔍 Root Cause:</strong> ${corr.explanation}
+                </div>
+
+                ${corr.suggestedFix ? `
+                <div class="bg-blue-900 bg-opacity-50 border-l-4 border-blue-400 p-3 mt-2 rounded">
+                  <p class="text-sm text-blue-100"><strong>💡 Suggested Fix:</strong> ${corr.suggestedFix}</p>
+                </div>
+                ` : ''}
+
+                ${corr.relatedDiscrepancy ? `
+                <div class="mt-2 text-xs text-gray-400">
+                  <strong>Related Discrepancy:</strong> ${corr.relatedDiscrepancy.type.replace(/_/g, ' ')}
+                </div>
+                ` : ''}
+              </div>
+            `).join('')}
+          </div>
+          ${failureDiscrepancyCorrelation.correlations.filter(c => c.rootCause !== 'unknown').length > 15 ? `
+          <p class="text-sm text-gray-300 mt-4">Showing 15 of ${failureDiscrepancyCorrelation.correlations.filter(c => c.rootCause !== 'unknown').length} correlated failures.</p>
+          ` : ''}
+        </div>
+      </div>
+    </div>
+  </section>
+  `;
+}
+//# sourceMappingURL=report-sections.js.map

package/dist/reporters/report-sections.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"report-sections.js","sourceRoot":"","sources":["../../src/reporters/report-sections.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EACL,mBAAmB,EACnB,qBAAqB,EACrB,qBAAqB,EACrB,iBAAiB,EACjB,uBAAuB,EACvB,yBAAyB,EACzB,mBAAmB,GACpB,MAAM,mBAAmB,CAAC;AAG3B;;GAEG;AACH,MAAM,UAAU,qBAAqB,CAAC,UAA+B;IACnE,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,MAAM;QAAE,OAAO,EAAE,CAAC;IAE/C,OAAO;;;;;;;;;;;;;;;cAeK,MAAM,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,EAAE;QACrD,MAAM,IAAI,GAAG,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;QACvF,OAAO;;oEAE+C,QAAQ;wDACpB,KAAK,CAAC,KAAK;;;wBAG3C,KAAK,CAAC,MAAM;;;;;wBAKZ,KAAK,CAAC,MAAM;;;oEAGgC,IAAI;;eAEzD,CAAC;IACJ,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;;;;GAKpB,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,qBAAqB,CAAC,UAA+B;IACnE,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,MAAM;QAAE,OAAO,EAAE,CAAC;IAE/C,OAAO;;;;;;;;;;;;;;;cAeK,MAAM,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,EAAE;QACrD,MAAM,IAAI,GAAG,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;QACvF,OAAO;;;yHAGoG,QAAQ;;wDAEzE,KAAK,CAAC,KAAK;;;wBAG3C,KAAK,CAAC,MAAM;;;;;wBAKZ,KAAK,CAAC,MAAM;;;oEAGgC,IAAI;;eAEzD,CAAC;IACJ,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;;;;GAKpB,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,uBAAuB,CAAC,QAA6C;IACnF,OAAO;;;;;;;;;;;;4DAYmD,QAAQ,CAAC,cAAc;;;;6DAItB,QAAQ,CAAC,eAAe;;;;8DAIvB,QAAQ,CAAC,kBAAkB;;;;UAI/E,QAAQ,CAAC,kBAAkB,IAAI,QAAQ,CAAC,kBAAkB,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;;;;uCAI3C,QAAQ,CAAC,kBAAkB,CAAC,MAAM;;;;gBAIzD,QAAQ,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC;;mFAEU,mBAAmB,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,QAAQ,CAAC,MAAM;0DACjF,QAAQ,CAAC,IAAI;;eAExD,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;gBACT,QAAQ,CAAC,kBAAkB,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC,CAAC;uEACa,QAAQ,CAAC,kBAAkB,CAAC,MAAM,GAAG,EAAE;eAC/F,CAAC,CAAC,CAAC,EAAE;;;;SAIX,CAAC,CAAC,CAAC,EAAE;;UAEJ,QAAQ,CAAC,eAAe,IAAI,QAAQ,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;kBAe1D,QAAQ,CAAC,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;;;qFAG4B,mBAAmB,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,MAAM,CAAC,MAAM;yEAChE,MAAM,CAAC,IAAI;;kFAEF,MAAM,CAAC,UAAU;iGACF,MAAM,CAAC,WAAW;+FACpB,MAAM,CAAC,WAAW;;sBAE3F,MAAM,CAAC,WAAW,KAAK,CAAC,CAAC,CAAC;QAC1B,0HAA0H,CAAC,CAAC;QAC5H,0HACF;;;iBAGH,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;;;;SAKlB,CAAC,CAAC,CAAC,EAAE;;;;GAIX,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,yBAAyB,CAAC,UAAiD;IACzF,OAAO;;;;;;;;;;;;;;YAcG,OAAO,UAAU,CAAC,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC;uDACE,UAAU,CAAC,OAAO;WAC9D,CAAC,CAAC,CAAC;;gBAEE,MAAM,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC;;4EAEG,GAAG,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;oBACrH,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,KAAK,IAAI,CAAC,CAAC,CAAC;;wBAE1C,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM,EAAE,QAAQ,CAAC,EAAE,EAAE,CAAC;;wDAElB,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC;sEACX,QAAQ;;uBAEvD,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;mBAEd,CAAC,CAAC,CAAC;0DACoC,KAAK;mBAC5C;;eAEJ,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;WAEd;;;UAGD,UAAU,CAAC,cAAc,IAAI,UAAU,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;;;;;;cAMhE,UAAU,CAAC,cAAc,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC;;wDAEG,KAAK,CAAC,KAAK;6CACtB,KAAK,CAAC,WAAW;;;kBAG5C,KAAK,CAAC,iBAAiB,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC;8FAC0C,EAAE;iBAC/E,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;;aAGd,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;;SAGd,CAAC,CAAC,CAAC,EAAE;;UAEJ,UAAU,CAAC,QAAQ,IAAI,UAAU,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;;;;;;cAMpD,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;gDACD,qBAAqB,CAAC,OAAO,CAAC,MAAM,CAAC;;0DAE3B,OAAO,CAAC,OAAO;mEACN,qBAAqB,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,OAAO,CAAC,MAAM,CAAC,WAAW,EAAE;;sDAEnF,OAAO,CAAC,WAAW;wEACD,OAAO,CAAC,WAAW;;aAE9E,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;;SAGd,CAAC,CAAC,CAAC,EAAE;;UAEJ,UAAU,CAAC,eAAe,IAAI,UAAU,CAAC,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;;;;;;cAMlE,UAAU,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC;;;kBAGvC,CAAC,GAAG,CAAC;;;;+CAIwB,GAAG,CAAC,KAAK;oBACpC,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,yDAAyD,qBAAqB,CAAC,GAAG,CAAC,QAAQ,CAAC,KAAK,GAAG,CAAC,QAAQ,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE;;;+CAG7H,GAAG,CAAC,GAAG;;kBAEpC,GAAG,CAAC,oBAAoB,CAAC,CAAC,CAAC;;sDAES,GAAG,CAAC,oBAAoB;;iBAE7D,CAAC,CAAC,CAAC,EAAE;;;aAGT,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;;SAGd,CAAC,CAAC,CAAC,EAAE;;;;GAIX,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,+BAA+B,CAAC,gBAA6D;IAC3G,OAAO;;;;;;;;;;;;;4DAamD,gBAAgB,CAAC,OAAO,CAAC,oBAAoB,GAAG,gBAAgB,CAAC,OAAO,CAAC,oBAAoB;;sBAEnI,gBAAgB,CAAC,OAAO,CAAC,oBAAoB,YAAY,gBAAgB,CAAC,OAAO,CAAC,oBAAoB;;;;;;6DAM/D,gBAAgB,CAAC,OAAO,CAAC,iBAAiB;;gBAEvF,CAAC,CAAC,gBAAgB,CAAC,OAAO,CAAC,iBAAiB,GAAG,CAAC,gBAAgB,CAAC,OAAO,CAAC,oBAAoB,IAAI,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;;;;;;2DAM3E,gBAAgB,CAAC,OAAO,CAAC,kBAAkB;;wBAE9E,gBAAgB,CAAC,OAAO,CAAC,MAAM,gBAAgB,gBAAgB,CAAC,OAAO,CAAC,QAAQ;;;;;;;wFAOhB,gBAAgB,CAAC,OAAO,CAAC,QAAQ;2FAC9B,gBAAgB,CAAC,OAAO,CAAC,IAAI;2FAC7B,gBAAgB,CAAC,OAAO,CAAC,MAAM;yFACjC,gBAAgB,CAAC,OAAO,CAAC,GAAG;;;;;;UAM3G,gBAAgB,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;;;6CAGT,gBAAgB,CAAC,aAAa,CAAC,MAAM;;;cAGpE,gBAAgB,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;8CACxB,IAAI,CAAC,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,KAAK,MAAM,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,iBAAiB;;mEAElJ,IAAI,CAAC,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,KAAK,MAAM,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,wBAAwB,KAAK,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE;oEAClO,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,WAAW,EAAE;kBAC5F,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,iDAAiD,IAAI,CAAC,QAAQ,CAAC,MAAM,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,SAAS,CAAC,CAAC,CAAC,EAAE;;8CAE7F,IAAI,CAAC,WAAW;gBAC9C,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;;mFAEiD,IAAI,CAAC,UAAU;;eAEnF,CAAC,CAAC,CAAC,EAAE;;aAEP,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;YAEX,gBAAgB,CAAC,aAAa,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC,CAAC;gEACO,gBAAgB,CAAC,aAAa,CAAC,MAAM;WAC1F,CAAC,CAAC,CAAC,EAAE;;SAEP,CAAC,CAAC,CAAC,EAAE;;;;GAIX,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,wBAAwB,CACtC,6BAAuF;IAEvF,OAAO;;;;;;;2CAOkC,6BAA6B,CAAC,eAAe;;;;;sBAKlE,6BAA6B,CAAC,kBAAkB,OAAO,6BAA6B,CAAC,aAAa;;;;cAI1G,MAAM,CAAC,OAAO,CAAC,6BAA6B,CAAC,kBAAkB,CAAC;SAC/D,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,KAAK,GAAG,CAAC,CAAC;SACjC,GAAG,CAAC,CAAC,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC;2EACgC,uBAAuB,CAAC,SAAS,CAAC;gEAC7C,KAAK;0DACX,iBAAiB,CAAC,SAAS,CAAC;;aAEzE,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;;;;;;cAOT,6BAA6B,CAAC,YAAY;SACzC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,KAAK,SAAS,CAAC;SACtC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC;SACZ,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;8FACmE,uBAAuB,CAAC,IAAI,CAAC,SAAS,CAAC;;;;yEAI5D,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC,OAAO,CAAC,MAAM;mEACtE,IAAI,CAAC,OAAO,CAAC,IAAI;oGACgB,IAAI,CAAC,OAAO,CAAC,YAAY;;;yEAGpD,yBAAyB,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC;wEAChF,CAAC,IAAI,CAAC,UAAU,GAAG,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;wBAClF,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,sGAAsG,CAAC,CAAC,CAAC,EAAE;;;;;;oDAMrG,IAAI,CAAC,WAAW;;;kBAGlD,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;;wFAEkD,IAAI,CAAC,YAAY;;iBAExF,CAAC,CAAC,CAAC,EAAE;;kBAEJ,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC;;0DAEc,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC;;iBAExF,CAAC,CAAC,CAAC,EAAE;;aAET,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;;YAEX,6BAA6B,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,KAAK,SAAS,CAAC,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC,CAAC;gEAC5C,6BAA6B,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,KAAK,SAAS,CAAC,CAAC,MAAM;WAC7I,CAAC,CAAC,CAAC,EAAE;;;;;GAKb,CAAC;AACJ,CAAC"}

package/dist/reporters/report-styles.d.ts

@@ -0,0 +1,12 @@
+/**
+ * HTML Report Styles
+ *
+ * CSS styles embedded in the HTML report.
+ *
+ * @module reporters/report-styles
+ */
+/**
+ * Returns the CSS styles for the HTML report
+ */
+export declare function getReportStyles(): string;
+//# sourceMappingURL=report-styles.d.ts.map

package/dist/reporters/report-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"report-styles.d.ts","sourceRoot":"","sources":["../../src/reporters/report-styles.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH;;GAEG;AACH,wBAAgB,eAAe,IAAI,MAAM,CAgZxC"}