@arghajit/dummy 0.3.28 → 0.3.31

package/dist/pulse.js

@@ -1,5 +1,8 @@
-import { test } from "@playwright/test";
-export const pulse = {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.pulse = void 0;
+const test_1 = require("@playwright/test");
+exports.pulse = {
     /**
      * Sets the severity level for the current test.
      * * @param level - The severity level ('Minor' | 'Low' | 'Medium' | 'High' | 'Critical')
@@ -13,7 +16,7 @@ export const pulse = {
         // Default to "Medium" if an invalid string is passed
         const selectedLevel = validLevels.includes(level) ? level : "Medium";
         // Add the annotation to Playwright's test info
-        test.info().annotations.push({
+        test_1.test.info().annotations.push({
             type: "pulse_severity",
             description: selectedLevel,
         });

package/dist/reporter/playwright-pulse-reporter.js

@@ -362,7 +362,10 @@ class PlaywrightPulseReporter {
             attempts.sort((a, b) => a.retries - b.retries);
             const firstAttempt = attempts[0];
             const retryAttempts = attempts.slice(1);
-            if (retryAttempts.length > 0) {
+            // Only populate retryHistory if there were actual failures that triggered retries
+            // If all attempts passed, we don't need to show retry history
+            const hasActualRetries = retryAttempts.length > 0 && retryAttempts.some(attempt => attempt.status === 'failed' || attempt.status === 'flaky' || firstAttempt.status === 'failed' || firstAttempt.status === 'flaky');
+            if (hasActualRetries) {
                 firstAttempt.retryHistory = retryAttempts;
                 // Calculate final status and outcome from the last attempt if retries exist
                 const lastAttempt = attempts[attempts.length - 1];
@@ -374,8 +377,9 @@ class PlaywrightPulseReporter {
                 }
             }
             else {
-                // If no retries, ensure final_status is undefined (as requested)
+                // If no actual retries (all attempts passed), ensure final_status and retryHistory are removed
                 delete firstAttempt.final_status;
+                delete firstAttempt.retryHistory;
             }
             finalResults.push(firstAttempt);
         }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@arghajit/dummy",
   "author": "Arghajit Singha",
-  "version": "0.3.28",
+  "version": "0.3.31",
   "description": "A Playwright reporter and dashboard for visualizing test results.",
   "homepage": "https://arghajit47.github.io/playwright-pulse/",
   "repository": {

package/scripts/generate-email-report.mjs

@@ -160,6 +160,8 @@ function getStatusClass(status) {
       return "status-failed";
     case "skipped":
       return "status-skipped";
+    case "flaky":
+      return "status-flaky";
     default:
       return "status-unknown";
   }
@@ -172,6 +174,8 @@ function getStatusIcon(status) {
       return "❌";
     case "skipped":
       return "⏭️";
+    case "flaky":
+      return "⚠";
     default:
       return "❓";
   }
@@ -243,13 +247,16 @@ function generateMinifiedHTML(reportData) {
         )}; font-size: 0.8em; font-weight: 600; padding: 3px 8px; border-radius: 4px; color: #fff; margin-left: 10px; white-space: nowrap;">${severity}</span>`;
 
         // --- NEW: Retry Count Badge ---
-        const retryCountBadge = (test.retryHistory && test.retryHistory.length > 0)
+        const unsuccessfulRetries = (test.retryHistory || []).filter(attempt => 
+          attempt.status === 'failed' || attempt.status === 'timedout' || attempt.status === 'flaky'
+        );
+        const retryCountBadge = (unsuccessfulRetries.length > 0)
           ? `<span style="background-color: #f59e0b; border: 1px solid #d97706; font-size: 0.8em; font-weight: 700; padding: 4px 10px; border-radius: 50px; color: #fff; margin-left: 10px; white-space: nowrap; display: inline-flex; align-items: center; gap: 4px;">
               <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="vertical-align: middle;">
                 <path d="M1 4v6h6"/>
                 <path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"/>
               </svg>
-              Retry Count: ${test.retryHistory.length}
+              Retry Count: ${unsuccessfulRetries.length}
             </span>`
           : '';
 
@@ -310,6 +317,7 @@ function generateMinifiedHTML(reportData) {
             --light-gray-color: #ecf0f1; /* Light Grey */
             --medium-gray-color: #bdc3c7; /* Medium Grey */
             --dark-gray-color: #7f8c8d; /* Dark Grey */
+            --flaky-color: #00ccd3; /* Cyan/Teal for Flaky */
             --text-color: #34495e; /* Dark Grey/Blue for text */
             --background-color: #f8f9fa;
             --card-background-color: #ffffff;
@@ -400,6 +408,8 @@ function generateMinifiedHTML(reportData) {
         .stat-card.failed .value { color: var(--danger-color); }
         .stat-card.skipped { border-left-color: var(--warning-color); }
         .stat-card.skipped .value { color: var(--warning-color); }
+        .stat-card.flaky { border-left-color: var(--flaky-color); }
+        .stat-card.flaky .value { color: var(--flaky-color); }
 
         .section-title {
             font-size: 1.5em;
@@ -494,6 +504,7 @@ function generateMinifiedHTML(reportData) {
         .test-item.status-passed .test-status-label { background-color: var(--success-color); }
         .test-item.status-failed .test-status-label { background-color: var(--danger-color); }
         .test-item.status-skipped .test-status-label { background-color: var(--warning-color); }
+        .test-item.status-flaky .test-status-label { background-color: var(--flaky-color); }
         .test-item.status-unknown .test-status-label { background-color: var(--dark-gray-color); }
         
         .no-tests {
@@ -570,6 +581,10 @@ function generateMinifiedHTML(reportData) {
                     <h3>Skipped</h3>
                     <div class="value">${runSummary.skipped || 0}</div>
                 </div>
+                <div class="stat-card flaky">
+                    <h3>Flaky</h3>
+                    <div class="value">${runSummary.flaky || 0}</div>
+                </div>
             </div>
         </section>
 
@@ -599,7 +614,7 @@ function generateMinifiedHTML(reportData) {
                     <option value="passed">✅ Passed</option>
                     <option value="failed">❌ Failed</option>
                     <option value="skipped">⏭️ Skipped</option>
-                    <option value="unknown">❓ Unknown</option>
+                    <option value="flaky">⚠ Flaky</option>
                 </select>
                 <select id="filter-min-browser">
                     <option value="">All Browsers</option>

package/scripts/generate-report.mjs

@@ -298,7 +298,7 @@ function generateTestTrendsChart(trendData) {
     {
       name: "Flaky",
       data: runs.map((r) => r.flaky || 0),
-      color: "var(--neutral-500)",
+      color: "#00ccd3",
       marker: { symbol: "circle" },
     },
   ];
@@ -600,7 +600,7 @@ function generatePieChart(data, chartWidth = 300, chartHeight = 300) {
               color = "var(--danger-color)";
               break;
             case "Flaky":
-              color = "var(--neutral-500)";
+              color = "#00ccd3";
               break;
             case "Skipped":
               color = "var(--warning-color)";
@@ -1234,7 +1234,7 @@ function generateWorkerDistributionChart(results) {
   const seriesString = JSON.stringify([
     { name: "Passed", data: passedData, color: "var(--success-color)" },
     { name: "Failed", data: failedData, color: "var(--danger-color)" },
-    { name: "Flaky", data: flakyData, color: "var(--neutral-500)" },
+    { name: "Flaky", data: flakyData, color: "#00ccd3" },
     { name: "Skipped", data: skippedData, color: "var(--warning-color)" },
   ]);
 
@@ -1327,7 +1327,7 @@ function generateWorkerDistributionChart(results) {
                 if (test.status === 'passed') color = 'var(--success-color)';
                 else if (test.status === 'failed') color = 'var(--danger-color)';
                 else if (test.status === 'skipped') color = 'var(--warning-color)';
-                else if (test.status === 'flaky') color = 'var(--neutral-500)';
+                else if (test.status === 'flaky') color = '#00ccd3';
 
                 const escapedName = test.name.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
                 testListHtml += \`<li style="color: \${color};"><span style="color: \${color}">[\${test.status.toUpperCase()}]</span> \${escapedName}</li>\`;
@@ -2120,7 +2120,7 @@ function generateSeverityDistributionChart(results) {
   const seriesData = [
     { name: "Passed", data: data.passed, color: "var(--success-color)" },
     { name: "Failed", data: data.failed, color: "var(--danger-color)" },
-    { name: "Flaky", data: data.flaky, color: "var(--neutral-500)" },
+    { name: "Flaky", data: data.flaky, color: "#00ccd3" },
     { name: "Skipped", data: data.skipped, color: "var(--warning-color)" },
   ];
 
@@ -2243,9 +2243,18 @@ function generateHTML(reportData, trendData = null) {
   const flakyCount = (results || []).filter(r => r.outcome === 'flaky').length;
 
   // Calculate retry statistics
+  let retriedTestsCount = 0;
   const totalRetried = (results || []).reduce((acc, test) => {
     if (test.retryHistory && test.retryHistory.length > 0) {
-      return acc + test.retryHistory.length;
+      // Filter out any "passed" or "skipped" entries in the history
+      // We only count attempts that actually failed or timed out, triggering a retry.
+      const unsuccessfulRetries = test.retryHistory.filter(attempt => 
+        attempt.status === 'failed' || attempt.status === 'timedout' || attempt.status === 'flaky'
+      );
+      if (unsuccessfulRetries.length > 0) {
+        retriedTestsCount++;
+      }
+      return acc + unsuccessfulRetries.length;
     }
     return acc;
   }, 0);
@@ -2331,8 +2340,8 @@ function generateHTML(reportData, trendData = null) {
         const severityBadge = `<span class="severity-badge" data-severity="${severity.toLowerCase()}">${severity}</span>`;
         
         // --- Retry Count Badge (only show if retries occurred) ---
-        const retryCount = test.retryHistory ? test.retryHistory.length : 0;
-        const retryBadge = retryCount > 0 ? `<span class="retry-badge">Retry Count: ${retryCount}</span>` : '';
+        const retryCount = (test.retryHistory && test.retryHistory.length > 0) ? test.retryHistory.length : 0;
+        const retryBadge = (test.retryHistory && test.retryHistory.length > 0) ? `<span class="retry-badge">Retry Count: ${retryCount}</span>` : '';
         const generateStepsHTML = (steps, depth = 0) => {
           if (!steps || steps.length === 0)
             return "<div class='no-steps'>No steps recorded for this test.</div>";
@@ -2428,6 +2437,7 @@ function generateHTML(reportData, trendData = null) {
             if(s === 'passed') colorVar = 'var(--success-color)';
             else if(s === 'failed') colorVar = 'var(--danger-color)';
             else if(s === 'skipped') colorVar = 'var(--warning-color)';
+            else if(s === 'flaky') colorVar = '#00ccd3';
             
             return `<span style="
                 display: inline-block; 
@@ -2794,7 +2804,8 @@ function generateHTML(reportData, trendData = null) {
           --success-color: #10b981; --success-dark: #059669; --success-light: #34d399;
           --danger-color: #ef4444; --danger-dark: #dc2626; --danger-light: #f87171;
           --warning-color: #f59e0b; --warning-dark: #d97706; --warning-light: #fbbf24;
-          --info-color: #3b82f6; 
+          --info-color: #3b82f6;
+          --flaky-color: #00ccd3; 
           --neutral-50: #fafafa; --neutral-100: #f5f5f5; --neutral-200: #e5e5e5; --neutral-300: #d4d4d4;
           --neutral-400: #a3a3a3; --neutral-500: #737373; --neutral-600: #525252; --neutral-700: #404040;
           --neutral-800: #262626; --neutral-900: #171717;
@@ -3472,19 +3483,19 @@ function generateHTML(reportData, trendData = null) {
           box-shadow: 0 4px 12px rgba(239, 68, 68, 0.2);
         }
         .summary-card.status-failed .value { color: #ef4444; }
-        .summary-card.status-flaky::before { background: var(--neutral-500); }
+        .summary-card.status-flaky::before { background: #00ccd3; }
         .summary-card.status-skipped { background: rgba(245, 158, 11, 0.02); }
         .summary-card.status-skipped:hover { 
           background: rgba(245, 158, 11, 0.15); 
           box-shadow: 0 4px 12px rgba(245, 158, 11, 0.2);
         }
         .summary-card.status-skipped .value { color: #f59e0b; }
-        .summary-card.flaky-status { background: rgba(156, 163, 175, 0.05); }
+        .summary-card.flaky-status { background: rgba(0, 204, 211, 0.05); }
         .summary-card.flaky-status:hover { 
-          background: rgba(156, 163, 175, 0.15); 
-          box-shadow: 0 4px 12px rgba(156, 163, 175, 0.2);
+          background: rgba(0, 204, 211, 0.15); 
+          box-shadow: 0 4px 12px rgba(0, 204, 211, 0.2);
         }
-        .summary-card.flaky-status .value { color: #64748b; }
+        .summary-card.flaky-status .value { color: #00ccd3; }
         .summary-card:not([class*='status-']) .value { color: #0f172a; }
         .dashboard-bottom-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 28px; align-items: start; }
         .dashboard-column { 
@@ -3584,7 +3595,7 @@ function generateHTML(reportData, trendData = null) {
         }
         .suite-card.status-passed::before { background: var(--success-color); }
         .suite-card.status-failed::before { background: var(--danger-color); }
-        .suite-card.status-flaky::before { background: var(--neutral-500); }
+        .suite-card.status-flaky::before { background: #00ccd3; }
         .suite-card.status-skipped::before { background: var(--warning-color); }
         
         /* Outcome Badge */
@@ -3600,8 +3611,8 @@ function generateHTML(reportData, trendData = null) {
             letter-spacing: 0.5px;
         }
         .outcome-badge.flaky {
-            background-color: #eab308; /* Yellow-500 */
-            color: #000;
+            background-color: #00ccd3;
+            color: #fff;
         }
 
         .suite-card-header {
@@ -3630,9 +3641,9 @@ function generateHTML(reportData, trendData = null) {
         }
         .status-indicator-dot.status-passed { background-color: var(--success-color); box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.15); }
         .status-indicator-dot.status-failed { background-color: var(--danger-color); box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.15); }
-        .status-indicator-dot.status-flaky { background-color: var(--neutral-500); box-shadow: 0 0 0 4px rgba(107, 114, 128, 0.15); }
+        .status-indicator-dot.status-flaky { background-color: #00ccd3; box-shadow: 0 0 0 4px rgba(0, 204, 211, 0.15); }
         .status-indicator-dot.status-skipped { background-color: rgba(245, 158, 11, 0.1); color: var(--warning-dark); border: 1px solid rgba(245, 158, 11, 0.2); }
-        .status-flaky { background-color: #C0C0C0; color: #000000; border: 1px solid #A0A0A0; }
+        .status-flaky { background-color: rgba(0, 204, 211, 0.1); color: #00ccd3; border: 1px solid #00ccd3; }
 
         .browser-tag {
           font-size: 0.8em;
@@ -3684,7 +3695,7 @@ function generateHTML(reportData, trendData = null) {
         .stat-pill svg { width: 14px; height: 14px; }
         .stat-pill.passed { color: var(--success-dark); }
         .stat-pill.failed { color: var(--danger-dark); }
-        .stat-pill.flaky { color: #4b5563; }
+        .stat-pill.flaky { color: #00ccd3; }
         .stat-pill.skipped { color: var(--warning-dark); }
         .filters {
           display: flex;
@@ -3849,7 +3860,7 @@ function generateHTML(reportData, trendData = null) {
           border-radius: 0;
           font-size: 0.7em;
           font-weight: 800;
-          color: white;
+          color: black;
           text-transform: uppercase;
           min-width: 100px;
           text-align: center;
@@ -4560,13 +4571,14 @@ function generateHTML(reportData, trendData = null) {
                 }</div><div class="trend-percentage">${skipPercentage}%</div></div>
                 <div class="summary-card flaky-status"><h3>Flaky</h3><div class="value">${runSummary.flaky || 0}</div>
                 <div class="trend-percentage">${flakyPercentage}%</div></div>
-                <div class="summary-card"><h3>Run Duration</h3><div class="value">${formatDuration(
-                  runSummary.duration,
-                )}</div></div>
-                <div class="summary-card">
-                  <h3>Total Retry Count</h3>
-                  <div class="value">${totalRetried}</div>
-                </div>
+                 <div class="summary-card"><h3>Run Duration</h3><div class="value">${formatDuration(
+                   runSummary.duration,
+                 )}</div><div class="trend-percentage">Avg. Test Duration ${avgTestDuration}</div></div>
+                 <div class="summary-card">
+                   <h3>Total Retry Count</h3>
+                   <div class="value">${totalRetried}</div>
+                   <div class="trend-percentage">Test Retried ${retriedTestsCount}</div>
+                 </div>
                 <div class="summary-card">
                   <h3>🌐 Browser Distribution <span style="font-size: 0.7em; color: var(--text-color-secondary); font-weight: 400;">(${browserBreakdown.length} total)</span></h3>
                   <div class="browser-breakdown" style="max-height: 200px; overflow-y: auto; padding-right: 4px;">

package/scripts/generate-static-report.mjs

@@ -342,7 +342,7 @@ function generateTestTrendsChart(trendData) {
     {
       name: "Flaky",
       data: runs.map((r) => r.flaky || 0),
-      color: "var(--neutral-500)",
+      color: "#00ccd3",
       marker: { symbol: "circle" },
     },
   ];
@@ -668,7 +668,7 @@ function generatePieChart(data, chartWidth = 300, chartHeight = 300) {
               color = "var(--danger-color)";
               break;
             case "Flaky":
-              color = "var(--neutral-500)";
+              color = "#00ccd3";
               break;
             case "Skipped":
               color = "var(--warning-color)";
@@ -1395,7 +1395,7 @@ function generateWorkerDistributionChart(results) {
     { name: "Passed", data: passedData, color: "var(--success-color)" },
     { name: "Failed", data: failedData, color: "var(--danger-color)" },
     { name: "Skipped", data: skippedData, color: "var(--warning-color)" },
-    { name: "Flaky", data: flakyData, color: "var(--neutral-500)" },
+    { name: "Flaky", data: flakyData, color: "#00ccd3" },
   ]);
 
   // The HTML now includes the chart container, the modal, and styles for the modal
@@ -2315,7 +2315,7 @@ function generateSeverityDistributionChart(results) {
   const seriesData = [
     { name: "Passed", data: data.passed, color: "var(--success-color)" },
     { name: "Failed", data: data.failed, color: "var(--danger-color)" },
-    { name: "Flaky", data: data.flaky, color: "var(--neutral-500)" },
+    { name: "Flaky", data: data.flaky, color: "#00ccd3" },
     { name: "Skipped", data: data.skipped, color: "var(--warning-color)" },
   ];
 
@@ -2468,9 +2468,18 @@ function generateHTML(reportData, trendData = null) {
   const flakyCount = (results || []).filter(r => r.outcome === 'flaky').length;
 
   // Calculate retry statistics
+  let retriedTestsCount = 0;
   const totalRetried = (results || []).reduce((acc, test) => {
     if (test.retryHistory && test.retryHistory.length > 0) {
-      return acc + test.retryHistory.length;
+      // Filter out any "passed" or "skipped" entries in the history
+      // We only count attempts that actually failed or timed out, triggering a retry.
+      const unsuccessfulRetries = test.retryHistory.filter(attempt => 
+        attempt.status === 'failed' || attempt.status === 'timedout' || attempt.status === 'flaky'
+      );
+      if (unsuccessfulRetries.length > 0) {
+        retriedTestsCount++;
+      }
+      return acc + unsuccessfulRetries.length;
     }
     return acc;
   }, 0);
@@ -2570,8 +2579,8 @@ function generateHTML(reportData, trendData = null) {
         const severityBadge = `<span class="severity-badge" data-severity="${severity.toLowerCase()}">${severity}</span>`;
 
         // --- Retry Count Badge (only show if retries occurred) ---
-        const retryCount = test.retryHistory ? test.retryHistory.length : 0;
-        const retryBadge = retryCount > 0 ? `<span class="retry-badge">Retry Count: ${retryCount}</span>` : '';
+        const retryCount = (test.retryHistory && test.retryHistory.length > 0) ? test.retryHistory.length : 0;
+        const retryBadge = (test.retryHistory && test.retryHistory.length > 0) ? `<span class="retry-badge">Retry Count: ${retryCount}</span>` : '';
 
         // --- Step Generation ---
         const generateStepsHTML = (steps, depth = 0) => {
@@ -2649,6 +2658,7 @@ function generateHTML(reportData, trendData = null) {
             if(s === 'passed') colorVar = 'var(--success-color)';
             else if(s === 'failed') colorVar = 'var(--danger-color)';
             else if(s === 'skipped') colorVar = 'var(--warning-color)';
+            else if(s === 'flaky') colorVar = '#00ccd3';
             
             return `<span style="
                 display: inline-block; 
@@ -3017,7 +3027,8 @@ function generateHTML(reportData, trendData = null) {
   --success-color: #34d399; --success-dark: #10b981; --success-light: #6ee7b7;
   --danger-color: #f87171; --danger-dark: #ef4444; --danger-light: #fca5a5;
   --warning-color: #fbbf24; --warning-dark: #f59e0b; --warning-light: #fcd34d;
-  --info-color: #9ca3af; 
+  --info-color: #9ca3af;
+  --flaky-color: #00ccd3; 
   --text-primary: #f9fafb; --text-secondary: #e5e7eb; --text-tertiary: #d1d5db;
   --bg-primary: #000000; --bg-secondary: #0a0a0a; --bg-tertiary: #050505;
   --bg-card: #0d0d0d; --bg-card-hover: #121212;
@@ -3471,14 +3482,14 @@ function generateHTML(reportData, trendData = null) {
           color: #f59e0b; 
         }
         .summary-card.flaky-status { 
-          background: rgba(156, 163, 175, 0.08); 
+          background: rgba(0, 204, 211, 0.05); 
         }
         .summary-card.flaky-status:hover { 
-          background: rgba(156, 163, 175, 0.15); 
-          box-shadow: 0 4px 12px rgba(156, 163, 175, 0.2);
+          background: rgba(0, 204, 211, 0.15); 
+          box-shadow: 0 4px 12px rgba(0, 204, 211, 0.2);
         }
         .summary-card.flaky-status .value { 
-          color: #9ca3af; 
+          color: #00ccd3; 
         }
         .summary-card:not([class*='status-']) .value { 
           color: #f9fafb; 
@@ -3602,7 +3613,7 @@ function generateHTML(reportData, trendData = null) {
         }
         .suite-card.status-passed::before { background: var(--success-color); }
         .suite-card.status-failed::before { background: var(--danger-color); }
-        .suite-card.status-flaky::before { background: var(--neutral-500); }
+        .suite-card.status-flaky::before { background: #00ccd3; }
         .suite-card.status-skipped::before { background: var(--warning-color); }
         
         .suite-card.status-skipped::before { background: var(--warning-color); }
@@ -3620,8 +3631,8 @@ function generateHTML(reportData, trendData = null) {
             letter-spacing: 0.5px;
         }
         .outcome-badge.flaky {
-            background-color: #eab308; /* Yellow-500 */
-            color: #000;
+            background-color: #00ccd3;
+            color: #fff;
         }
         
         .suite-card-header {
@@ -3705,7 +3716,7 @@ function generateHTML(reportData, trendData = null) {
         .stat-pill svg { width: 14px; height: 14px; }
         .stat-pill.passed { color: var(--success-dark); }
         .stat-pill.failed { color: var(--danger-dark); }
-        .stat-pill.flaky { color: #4b5563; }
+        .stat-pill.flaky { color: #00ccd3; }
         .stat-pill.skipped { color: var(--warning-dark); }
           color: #93c5fd;
           padding: 6px 12px;
@@ -3901,9 +3912,8 @@ function generateHTML(reportData, trendData = null) {
           background: var(--warning-color);
         }
         .status-badge.status-flaky {
-          background-color: #C0C0C0; 
-          color: #000000; 
-          border: 1px solid #A0A0A0;
+          background-color: #00ccd3; 
+          color: #fff; 
         }
         .status-badge.status-unknown {
           background: var(--dark-gray-color);
@@ -4539,8 +4549,8 @@ function generateHTML(reportData, trendData = null) {
           background-color: #f59e0b; 
         }
         .status-badge-small.status-flaky { 
-          background-color: #C0C0C0; 
-          color: #000000;
+          background-color: #00ccd3; 
+          color: #fff;
         }
         .status-badge-small.status-unknown { 
           background-color: var(--dark-gray-color); 
@@ -6246,10 +6256,11 @@ function generateHTML(reportData, trendData = null) {
                 <div class="trend-percentage">${flakyPercentage}%</div></div>
                 <div class="summary-card"><h3>Run Duration</h3><div class="value">${formatDuration(
                   runSummary.duration,
-                )}</div></div>
+                )}</div><div class="trend-percentage">Avg. Test Duration ${avgTestDuration}</div></div>
                 <div class="summary-card">
                   <h3>Total Retry Count</h3>
                   <div class="value">${totalRetried}</div>
+                  <div class="trend-percentage">Test Retried ${retriedTestsCount}</div>
                 </div>
                 <div class="summary-card">
                   <h3>🌐 Browser Distribution <span style="font-size: 0.7em; color: var(--text-color-secondary); font-weight: 400;">(${browserBreakdown.length} total)</span></h3>

package/dist/index.d.ts

@@ -1,5 +0,0 @@
-import { PlaywrightPulseReporter } from "./playwright-pulse-reporter";
-export default PlaywrightPulseReporter;
-export { PlaywrightPulseReporter };
-export * from "../types";
-export * from "../lib/report-types";

package/dist/index.js

@@ -1,26 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PlaywrightPulseReporter = void 0;
-// src/reporter/index.ts
-const playwright_pulse_reporter_1 = require("./playwright-pulse-reporter");
-Object.defineProperty(exports, "PlaywrightPulseReporter", { enumerable: true, get: function () { return playwright_pulse_reporter_1.PlaywrightPulseReporter; } });
-// Export the reporter class as the default export for CommonJS compatibility
-// and also as a named export for potential ES module consumers.
-exports.default = playwright_pulse_reporter_1.PlaywrightPulseReporter;
-// You can also export other related types or utilities if needed
-__exportStar(require("../types"), exports); // Re-export shared types if they are used by the reporter consumers
-__exportStar(require("../lib/report-types"), exports);

package/dist/lib/data-reader.js

@@ -1,116 +0,0 @@
-'use server';
-import * as fs from 'fs/promises';
-import * as path from 'path';
-const reportFileName = 'playwright-pulse-report.json'; // Use a constant for the filename
-const reportFilePath = path.resolve(process.cwd(), reportFileName); // Default path relative to cwd
-let cachedReportData = null;
-let lastReadTime = null;
-const CACHE_DURATION = 5000; // Cache duration in milliseconds (e.g., 5 seconds)
-export async function readReportDataInternal() {
-    const now = Date.now();
-    // Use cache if it's recent and not forced refresh
-    if (cachedReportData && lastReadTime && (now - lastReadTime < CACHE_DURATION)) {
-        // console.log("Returning cached report data.");
-        return cachedReportData;
-    }
-    // console.log(`Attempting to read report file from: ${reportFilePath}`);
-    try {
-        const fileContent = await fs.readFile(reportFilePath, 'utf-8');
-        let parsedData;
-        try {
-            parsedData = JSON.parse(fileContent);
-        }
-        catch (parseError) {
-            console.error(`Error parsing JSON from ${reportFilePath}:`, parseError);
-            throw new Error(`Invalid JSON in report file: ${parseError.message}`);
-        }
-        // --- Date Reviver ---
-        // Function to convert ISO date strings back to Date objects recursively
-        const reviveDates = (key, value) => {
-            // Matches ISO 8601 date format (YYYY-MM-DDTHH:mm:ss.sssZ)
-            const isoDateRegex = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(\.\d+)?Z$/;
-            if (typeof value === 'string' && isoDateRegex.test(value)) {
-                const date = new Date(value);
-                // Check if the parsed date is valid before returning
-                if (!isNaN(date.getTime())) {
-                    return date;
-                }
-            }
-            return value;
-        };
-        // Re-parse with the date reviver
-        const reportData = JSON.parse(fileContent, reviveDates);
-        // Basic validation after parsing and date revival
-        if (!reportData || typeof reportData !== 'object') {
-            throw new Error('Report file is empty or not a valid object.');
-        }
-        if (!reportData.metadata || typeof reportData.metadata.generatedAt !== 'string') { // generatedAt should remain string from JSON
-            throw new Error('Invalid or missing metadata in report file.');
-        }
-        if (!Array.isArray(reportData.results)) {
-            throw new Error('Missing or invalid "results" array in report file.');
-        }
-        // Optional: Validate run data if present
-        if (reportData.run && typeof reportData.run !== 'object') {
-            throw new Error('Invalid "run" data in report file.');
-        }
-        if (reportData.run && !(reportData.run.timestamp instanceof Date)) {
-            console.warn('Warning: Run timestamp was not correctly revived to a Date object.');
-            // Potentially attempt fallback parsing or throw error
-            reportData.run.timestamp = new Date(reportData.run.timestamp); // Attempt fallback
-            if (isNaN(reportData.run.timestamp.getTime())) {
-                throw new Error('Invalid run timestamp format.');
-            }
-        }
-        // Validate dates within results and steps
-        reportData.results.forEach((result, index) => {
-            if (!(result.startTime instanceof Date) || !(result.endTime instanceof Date)) {
-                console.warn(`Warning: Invalid start/end time for result index ${index}. Attempting fallback parsing.`);
-                result.startTime = new Date(result.startTime);
-                result.endTime = new Date(result.endTime);
-                if (isNaN(result.startTime.getTime()) || isNaN(result.endTime.getTime())) {
-                    throw new Error(`Invalid start/end time in result index ${index}.`);
-                }
-            }
-            if (Array.isArray(result.steps)) {
-                result.steps.forEach((step, stepIndex) => {
-                    if (!(step.startTime instanceof Date) || !(step.endTime instanceof Date)) {
-                        console.warn(`Warning: Invalid start/end time for step index ${stepIndex} in result index ${index}. Attempting fallback parsing.`);
-                        step.startTime = new Date(step.startTime);
-                        step.endTime = new Date(step.endTime);
-                        if (isNaN(step.startTime.getTime()) || isNaN(step.endTime.getTime())) {
-                            throw new Error(`Invalid start/end time in step index ${stepIndex}, result index ${index}.`);
-                        }
-                    }
-                });
-            }
-            else {
-                result.steps = []; // Initialize if steps array is missing
-            }
-        });
-        cachedReportData = reportData;
-        lastReadTime = now;
-        // console.log("Successfully read, parsed, and cached report file.");
-        return reportData;
-    }
-    catch (error) {
-        if (error.code === 'ENOENT') {
-            console.warn(`Report file not found at ${reportFilePath}. Returning empty data structure. Ensure Playwright tests ran with the reporter enabled and the file exists.`);
-            // Return a valid, empty structure
-            const defaultReport = {
-                run: null,
-                results: [],
-                metadata: { generatedAt: new Date().toISOString() }
-            };
-            cachedReportData = defaultReport; // Cache the default empty state
-            lastReadTime = now;
-            return defaultReport;
-        }
-        else {
-            // Log the specific error for debugging
-            console.error(`Error processing report file at ${reportFilePath}:`, error);
-            // Propagate a user-friendly error
-            throw new Error(`Failed to load report data: ${error.message}`);
-        }
-    }
-}