@arghajit/playwright-pulse-report 0.3.2 → 0.3.4

package/dist/utils/compression-utils.js

@@ -0,0 +1,112 @@
+"use strict";
+// src/utils/compression-utils.ts
+/**
+ * Compression utilities for images
+ * Uses sharp for image compression (works cross-platform with no external dependencies)
+ */
+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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.compressImage = compressImage;
+exports.compressAttachment = compressAttachment;
+const fs = __importStar(require("fs/promises"));
+const path = __importStar(require("path"));
+/**
+ * Compress an image file in-place
+ * @param filePath - Absolute path to the image file
+ * @param options - Compression options
+ */
+async function compressImage(filePath, options = {}) {
+    try {
+        const sharp = require('sharp');
+        const quality = options.quality || 75;
+        const ext = path.extname(filePath).toLowerCase();
+        // Read original file
+        const imageBuffer = await fs.readFile(filePath);
+        let compressedBuffer;
+        if (ext === '.png') {
+            // Compress PNG
+            compressedBuffer = await sharp(imageBuffer)
+                .png({ quality, compressionLevel: 9 })
+                .toBuffer();
+        }
+        else if (ext === '.jpg' || ext === '.jpeg') {
+            // Compress JPEG
+            compressedBuffer = await sharp(imageBuffer)
+                .jpeg({ quality, mozjpeg: true })
+                .toBuffer();
+        }
+        else if (ext === '.webp') {
+            // Compress WebP
+            compressedBuffer = await sharp(imageBuffer)
+                .webp({ quality })
+                .toBuffer();
+        }
+        else if (ext === '.gif') {
+            // Compress GIF
+            compressedBuffer = await sharp(imageBuffer)
+                .gif()
+                .toBuffer();
+        }
+        else if (ext === '.tiff' || ext === '.tif') {
+            // Compress TIFF
+            compressedBuffer = await sharp(imageBuffer)
+                .tiff({ quality, compression: 'lzw' })
+                .toBuffer();
+        }
+        else {
+            // Unsupported format, skip compression
+            return;
+        }
+        // Only overwrite if compression actually reduced size
+        if (compressedBuffer.length < imageBuffer.length) {
+            await fs.writeFile(filePath, compressedBuffer);
+        }
+    }
+    catch (error) {
+        // File remains unchanged
+    }
+}
+/**
+ * Compress an attachment file (auto-detects type)
+ * Note: Only compresses images. Videos are already compressed by Playwright.
+ * @param filePath - Absolute path to the file
+ * @param contentType - MIME content type
+ */
+async function compressAttachment(filePath, contentType) {
+    if (contentType.startsWith('image/')) {
+        await compressImage(filePath, { quality: 75 });
+    }
+    // Videos are skipped - already compressed by Playwright as WebM
+}

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@arghajit/playwright-pulse-report",
   "author": "Arghajit Singha",
-  "version": "0.3.2",
+  "version": "0.3.4",
   "description": "A Playwright reporter and dashboard for visualizing test results.",
-  "homepage": "https://playwright-pulse-report.netlify.app/",
+  "homepage": "https://arghajit47.github.io/playwright-pulse/",
   "repository": {
     "type": "git",
     "url": "https://github.com/Arghajit47/playwright-pulse"
@@ -34,12 +34,14 @@
   ],
   "license": "MIT",
   "bin": {
+    "logo": "node scripts/terminal-logo.mjs",
     "generate-pulse-report": "scripts/generate-static-report.mjs",
     "generate-report": "scripts/generate-report.mjs",
     "merge-pulse-report": "scripts/merge-pulse-report.js",
     "send-email": "scripts/sendReport.mjs",
     "generate-trend": "scripts/generate-trend.mjs",
-    "generate-email-report": "scripts/generate-email-report.mjs"
+    "generate-email-report": "scripts/generate-email-report.mjs",
+    "pulse-logo": "scripts/terminal-logo.mjs"
   },
   "exports": {
     ".": {
@@ -71,7 +73,7 @@
     "node-fetch": "^3.3.2",
     "nodemailer": "^7.0.3",
     "patch-package": "^8.0.0",
-    "recharts": "^2.15.1",
+    "sharp": "^0.33.5",
     "ua-parser-js": "^1.0.41",
     "zod": "^3.24.2"
   },
@@ -88,6 +90,10 @@
     "@playwright/test": ">=1.40.0"
   },
   "overrides": {
-    "glob": "^13.0.0"
+    "brace-expansion": "^2.0.2",
+    "@isaacs/brace-expansion": "^5.0.1",
+    "glob": "^13.0.0",
+    "minimatch": "^10.1.2",
+    "lodash": "^4.17.23"
   }
-}
+}

package/scripts/generate-email-report.mjs

@@ -3,6 +3,7 @@
 import * as fs from "fs/promises";
 import path from "path";
 import { getOutputDir } from "./config-reader.mjs";
+import { animate } from "./terminal-logo.mjs";
 
 // Use dynamic import for chalk as it's ESM only
 let chalk;
@@ -159,6 +160,8 @@ function getStatusClass(status) {
       return "status-failed";
     case "skipped":
       return "status-skipped";
+    case "flaky":
+      return "status-flaky";
     default:
       return "status-unknown";
   }
@@ -171,6 +174,8 @@ function getStatusIcon(status) {
       return "❌";
     case "skipped":
       return "⏭️";
+    case "flaky":
+      return "⚠";
     default:
       return "❓";
   }
@@ -241,6 +246,20 @@ function generateMinifiedHTML(reportData) {
           severity
         )}; 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 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: ${unsuccessfulRetries.length}
+            </span>`
+          : '';
+
         // --- NEW: Tags Logic ---
         const tagsBadges = (test.tags || [])
           .map(
@@ -265,6 +284,7 @@ function generateMinifiedHTML(reportData) {
                 test.name
               )}">${sanitizeHTML(testTitle)}</span>
               
+              ${retryCountBadge}
               ${severityBadge}
               ${tagsBadges}
             </li>
@@ -297,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;
@@ -387,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;
@@ -481,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 {
@@ -531,10 +555,10 @@ function generateMinifiedHTML(reportData) {
             </div>
             <div class="run-info">
                 <strong>Run Date:</strong> ${formatDate(
-                  runSummary.timestamp
+                  runSummary.timestamp,
                 )}<br>
                 <strong>Total Duration:</strong> ${formatDuration(
-                  runSummary.duration
+                  runSummary.duration,
                 )}
             </div>
         </header>
@@ -557,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>
 
@@ -582,11 +610,11 @@ function generateMinifiedHTML(reportData) {
             <div class="filters-section">
                 <input type="text" id="filter-min-name" placeholder="Search by test name...">
                 <select id="filter-min-status">
-                    <option value="">All Statuses</option>
-                    <option value="passed">Passed</option>
-                    <option value="failed">Failed</option>
-                    <option value="skipped">Skipped</option>
-                    <option value="unknown">Unknown</option>
+                    <option value="">All Status</option>
+                    <option value="passed">✅ Passed</option>
+                    <option value="failed">❌ Failed</option>
+                    <option value="skipped">⏭️ Skipped</option>
+                    <option value="flaky">⚠ Flaky</option>
                 </select>
                 <select id="filter-min-browser">
                     <option value="">All Browsers</option>
@@ -594,8 +622,8 @@ function generateMinifiedHTML(reportData) {
                       .map(
                         (browser) =>
                           `<option value="${sanitizeHTML(
-                            browser.toLowerCase()
-                          )}">${sanitizeHTML(capitalize(browser))}</option>`
+                            browser.toLowerCase(),
+                          )}">${sanitizeHTML(capitalize(browser))}</option>`,
                       )
                       .join("")}
                 </select>
@@ -608,7 +636,7 @@ function generateMinifiedHTML(reportData) {
         <footer class="report-footer">
             <div style="display: inline-flex; align-items: center; gap: 0.5rem;">
                 <span>Created for</span>
-                <a href="https://playwright-pulse-report.netlify.app/" target="_blank" rel="noopener noreferrer">
+                <a href="https://arghajit47.github.io/playwright-pulse/" target="_blank" rel="noopener noreferrer">
                     Pulse Email Report
                 </a>
             </div>
@@ -712,6 +740,8 @@ function generateMinifiedHTML(reportData) {
   `;
 }
 async function main() {
+  await animate();
+  
   const outputDir = await getOutputDir(customOutputDir);
   const reportJsonPath = path.resolve(outputDir, DEFAULT_JSON_FILE);
   const minifiedReportHtmlPath = path.resolve(outputDir, MINIFIED_HTML_FILE); // Path for the new minified HTML
@@ -763,8 +793,8 @@ async function main() {
     await fs.writeFile(minifiedReportHtmlPath, htmlContent, "utf-8");
     console.log(
       chalk.green.bold(
-        `🎉 Minified Pulse summary report generated successfully at: ${minifiedReportHtmlPath}`
-      )
+        `Minified Pulse summary report generated successfully at: ${minifiedReportHtmlPath}`,
+      ),
     );
     console.log(chalk.gray(`(This HTML file is designed to be lightweight)`));
   } catch (error) {