ortoni-report 1.1.1 → 1.1.3

package/changelog.md

@@ -1,5 +1,40 @@
 # Change Log:
 
+## Version 1.1.3
+
+**New Features:**
+- Added detailed steps to the testDetails section in the HTML report.
+- Introduced a new flaky icon for better visual representation in the report.
+- Display of test steps in the HTML report.
+- Added a filter for retry tests to better categorize and display them.
+
+**Improved:**
+- Updated the package dependencies to remove vulnerabilities.
+- Enhanced time formatting to include milliseconds in the duration display.
+- Enhanced the calculation and display of the success rate in the HTML report.
+
+## Version 1.1.2
+
+**New Features:**
+- **Ellipsis Styling for Test Names:** Long test names are now truncated with ellipsis for better readability.
+- **Retry, Pass, Fail, and Skip Indicators:** Added visual indicators (images) to denote the status of each test, including retries.
+- **Enhanced `msToTime` Function:** Duration now includes milliseconds for more precise time tracking.
+- **Summary Filters:** Clicking on summary filters (passed, failed & other) to display the selected filter.
+
+**Improvements:**
+- **Unified Status Handling:** The `applyFilter` function now treats `failed` and `timedOut` statuses as the same for consistent filtering.
+- **Date and Time Formatting:** Passed date in the format `DD-MMM-YYYY` and included time for more detailed reporting.
+- **Success Rate and Last Run Data:** Added the ability to pass `successRate` and `lastRun` data to the `onEnd` method for comprehensive report details.
+
+**Bug Fixes:**
+- Fixed issues with conditionals in Handlebars for status checking.
+- Improved event listener attachment for filtering and search functionalities.
+
+**Notes:**
+- Screenshot handling has been enhanced with modal dialogs, using Pico.css for styling.
+
+This release includes several visual and functional enhancements aimed at improving the usability and readability of the Playwright test reports. The added features and improvements will help users better understand test outcomes and statuses at a glance.
+
 ### Version 1.1.0
 
 ## New Features

package/dist/ortoni-report.d.ts

@@ -1,4 +1,4 @@
-import { Reporter, FullConfig, Suite, TestCase, TestResult, FullResult } from '@playwright/test/reporter';
+import { TestStep, Reporter, FullConfig, Suite, TestCase, TestResult, FullResult } from '@playwright/test/reporter';
 
 interface ReporterConfig {
     projectName?: string;
@@ -6,6 +6,22 @@ interface ReporterConfig {
     testType?: string;
 }
 
+interface TestResultData {
+    retry: string;
+    isRetry: number;
+    projectName: any;
+    suite: any;
+    title: string;
+    status: "passed" | "failed" | "timedOut" | "skipped" | "interrupted" | "expected" | "unexpected" | "flaky";
+    flaky: string;
+    duration: string;
+    errors: any[];
+    steps: TestStep[];
+    logs: string;
+    screenshotPath: string | null;
+    filePath: any;
+}
+
 declare class OrtoniReport implements Reporter {
     private results;
     private groupedResults;
@@ -16,7 +32,7 @@ declare class OrtoniReport implements Reporter {
     onTestBegin(test: TestCase, result: TestResult): void;
     onTestEnd(test: TestCase, result: TestResult): void;
     onEnd(result: FullResult): void;
-    generateHTML(): string;
+    generateHTML(filteredResults: TestResultData[], totalDuration: string): string;
 }
 
 export { OrtoniReport as default };

package/dist/ortoni-report.js

@@ -38,25 +38,39 @@ var import_path2 = __toESM(require("path"));
 var import_handlebars = __toESM(require("handlebars"));
 var import_safe = __toESM(require("colors/safe"));
 
-// src/utils/time.ts
+// src/utils/utils.ts
 var import_path = __toESM(require("path"));
 function msToTime(duration) {
+  const milliseconds = Math.floor(duration % 1e3);
   const seconds = Math.floor(duration / 1e3 % 60);
   const minutes = Math.floor(duration / (1e3 * 60) % 60);
   const hours = Math.floor(duration / (1e3 * 60 * 60) % 24);
-  const parts = [];
-  if (hours > 0)
-    parts.push(hours + "h");
-  if (minutes > 0)
-    parts.push(minutes + "m");
-  if (seconds > 0 || parts.length === 0)
-    parts.push(seconds + "s");
-  return parts.join(" ");
+  let result = "";
+  if (hours > 0) {
+    result += (hours < 10 ? "0" + hours : hours) + "h:";
+  }
+  if (minutes > 0 || hours > 0) {
+    result += (minutes < 10 ? "0" + minutes : minutes) + "m:";
+  }
+  if (seconds > 0 || minutes > 0 || hours > 0) {
+    result += (seconds < 10 ? "0" + seconds : seconds) + "s";
+  }
+  if (milliseconds > 0) {
+    result += ":" + (milliseconds < 100 ? "0" + milliseconds : milliseconds) + "ms";
+  }
+  return result;
 }
 function normalizeFilePath(filePath) {
   const normalizedPath = import_path.default.normalize(filePath);
   return import_path.default.basename(normalizedPath);
 }
+function formatDate(date) {
+  const day = String(date.getDate()).padStart(2, "0");
+  const month = date.toLocaleString("default", { month: "short" });
+  const year = date.getFullYear();
+  const time = date.toLocaleTimeString();
+  return `${day}-${month}-${year} ${time}`;
+}
 
 // src/ortoni-report.ts
 var OrtoniReport = class {
@@ -75,22 +89,30 @@ var OrtoniReport = class {
   onTestBegin(test, result) {
   }
   onTestEnd(test, result) {
+    let status = result.status;
+    if (test.outcome() === "flaky") {
+      status = "flaky";
+    }
     const testResult = {
-      totalDuration: "",
+      retry: result.retry > 0 ? "retry" : "",
+      isRetry: result.retry,
       projectName: test.titlePath()[1],
-      // Get the project name
       suite: test.titlePath()[3],
-      // Adjust the index based on your suite hierarchy
       title: test.title,
-      status: result.status,
+      status,
       flaky: test.outcome(),
       duration: msToTime(result.duration),
       errors: result.errors.map((e) => import_safe.default.strip(e.message || e.toString())),
       steps: result.steps.map((step) => ({
-        title: step.title,
+        titlePath: step.titlePath,
         category: step.category,
         duration: step.duration,
-        status: result.status
+        error: step.error,
+        location: step.location,
+        parent: step.parent,
+        startTime: step.startTime,
+        steps: step.steps,
+        title: step.title
       })),
       logs: import_safe.default.strip(result.stdout.concat(result.stderr).map((log) => log).join("\n")),
       screenshotPath: null,
@@ -112,7 +134,8 @@ var OrtoniReport = class {
     this.results.push(testResult);
   }
   onEnd(result) {
-    this.results[0].totalDuration = msToTime(result.duration);
+    const filteredResults = this.results.filter((r) => r.status !== "skipped" && !r.isRetry);
+    const totalDuration = msToTime(result.duration);
     this.groupedResults = this.results.reduce((acc, result2, index) => {
       const filePath = result2.filePath;
       const suiteName = result2.suite;
@@ -132,30 +155,51 @@ var OrtoniReport = class {
     import_handlebars.default.registerHelper("json", function(context) {
       return safeStringify(context);
     });
-    const html = this.generateHTML();
+    import_handlebars.default.registerHelper("eq", function(actualStatus, expectedStatus) {
+      return actualStatus === expectedStatus;
+    });
+    import_handlebars.default.registerHelper("or", () => {
+      var args = Array.prototype.slice.call(arguments);
+      var options = args.pop();
+      for (var i = 0; i < args.length; i++) {
+        if (args[i]) {
+          return options.fn(this);
+        }
+      }
+      return options.inverse(this);
+    });
+    import_handlebars.default.registerHelper("gt", function(a, b) {
+      return a > b;
+    });
+    const html = this.generateHTML(filteredResults, totalDuration);
     const outputPath = import_path2.default.resolve(process.cwd(), "ortoni-report.html");
     import_fs.default.writeFileSync(outputPath, html);
     console.log(`Ortoni HTML report generated at ${outputPath}`);
   }
-  generateHTML() {
+  generateHTML(filteredResults, totalDuration) {
+    const totalTests = filteredResults.length;
+    const passedTests = this.results.filter((r) => r.status === "passed").length;
+    const flakyTests = this.results.filter((r) => r.flaky === "flaky").length;
+    const failed = filteredResults.filter((r) => r.status === "failed" || r.status === "timedOut").length;
+    const successRate = ((passedTests + flakyTests) / totalTests * 100).toFixed(2);
     const templateSource = import_fs.default.readFileSync(import_path2.default.resolve(__dirname, "report-template.hbs"), "utf-8");
     const template = import_handlebars.default.compile(templateSource);
     const data = {
-      totalDuration: this.results[0].totalDuration,
+      totalDuration,
       suiteName: this.suiteName,
       results: this.results,
-      passCount: this.results.filter((r) => r.status === "passed").length,
-      failCount: this.results.filter((r) => r.status === "failed" || r.status === "timedOut").length,
+      retryCount: this.results.filter((r) => r.isRetry).length,
+      passCount: passedTests,
+      failCount: failed,
       skipCount: this.results.filter((r) => r.status === "skipped").length,
-      flakyCount: this.results.filter((r) => r.flaky === "flaky").length,
-      totalCount: this.results.length,
+      flakyCount: flakyTests,
+      totalCount: filteredResults.length,
       groupedResults: this.groupedResults,
       projectName: this.config.projectName,
-      // Include project name
       authorName: this.config.authorName,
-      // Include author name
-      testType: this.config.testType
-      // Include test type
+      testType: this.config.testType,
+      successRate,
+      lastRunDate: formatDate(/* @__PURE__ */ new Date())
     };
     return template(data);
   }

package/dist/ortoni-report.mjs

@@ -4,25 +4,39 @@ import path2 from "path";
 import Handlebars from "handlebars";
 import colors from "colors/safe";
 
-// src/utils/time.ts
+// src/utils/utils.ts
 import path from "path";
 function msToTime(duration) {
+  const milliseconds = Math.floor(duration % 1e3);
   const seconds = Math.floor(duration / 1e3 % 60);
   const minutes = Math.floor(duration / (1e3 * 60) % 60);
   const hours = Math.floor(duration / (1e3 * 60 * 60) % 24);
-  const parts = [];
-  if (hours > 0)
-    parts.push(hours + "h");
-  if (minutes > 0)
-    parts.push(minutes + "m");
-  if (seconds > 0 || parts.length === 0)
-    parts.push(seconds + "s");
-  return parts.join(" ");
+  let result = "";
+  if (hours > 0) {
+    result += (hours < 10 ? "0" + hours : hours) + "h:";
+  }
+  if (minutes > 0 || hours > 0) {
+    result += (minutes < 10 ? "0" + minutes : minutes) + "m:";
+  }
+  if (seconds > 0 || minutes > 0 || hours > 0) {
+    result += (seconds < 10 ? "0" + seconds : seconds) + "s";
+  }
+  if (milliseconds > 0) {
+    result += ":" + (milliseconds < 100 ? "0" + milliseconds : milliseconds) + "ms";
+  }
+  return result;
 }
 function normalizeFilePath(filePath) {
   const normalizedPath = path.normalize(filePath);
   return path.basename(normalizedPath);
 }
+function formatDate(date) {
+  const day = String(date.getDate()).padStart(2, "0");
+  const month = date.toLocaleString("default", { month: "short" });
+  const year = date.getFullYear();
+  const time = date.toLocaleTimeString();
+  return `${day}-${month}-${year} ${time}`;
+}
 
 // src/ortoni-report.ts
 var OrtoniReport = class {
@@ -41,22 +55,30 @@ var OrtoniReport = class {
   onTestBegin(test, result) {
   }
   onTestEnd(test, result) {
+    let status = result.status;
+    if (test.outcome() === "flaky") {
+      status = "flaky";
+    }
     const testResult = {
-      totalDuration: "",
+      retry: result.retry > 0 ? "retry" : "",
+      isRetry: result.retry,
       projectName: test.titlePath()[1],
-      // Get the project name
       suite: test.titlePath()[3],
-      // Adjust the index based on your suite hierarchy
       title: test.title,
-      status: result.status,
+      status,
       flaky: test.outcome(),
       duration: msToTime(result.duration),
       errors: result.errors.map((e) => colors.strip(e.message || e.toString())),
       steps: result.steps.map((step) => ({
-        title: step.title,
+        titlePath: step.titlePath,
         category: step.category,
         duration: step.duration,
-        status: result.status
+        error: step.error,
+        location: step.location,
+        parent: step.parent,
+        startTime: step.startTime,
+        steps: step.steps,
+        title: step.title
       })),
       logs: colors.strip(result.stdout.concat(result.stderr).map((log) => log).join("\n")),
       screenshotPath: null,
@@ -78,7 +100,8 @@ var OrtoniReport = class {
     this.results.push(testResult);
   }
   onEnd(result) {
-    this.results[0].totalDuration = msToTime(result.duration);
+    const filteredResults = this.results.filter((r) => r.status !== "skipped" && !r.isRetry);
+    const totalDuration = msToTime(result.duration);
     this.groupedResults = this.results.reduce((acc, result2, index) => {
       const filePath = result2.filePath;
       const suiteName = result2.suite;
@@ -98,30 +121,51 @@ var OrtoniReport = class {
     Handlebars.registerHelper("json", function(context) {
       return safeStringify(context);
     });
-    const html = this.generateHTML();
+    Handlebars.registerHelper("eq", function(actualStatus, expectedStatus) {
+      return actualStatus === expectedStatus;
+    });
+    Handlebars.registerHelper("or", () => {
+      var args = Array.prototype.slice.call(arguments);
+      var options = args.pop();
+      for (var i = 0; i < args.length; i++) {
+        if (args[i]) {
+          return options.fn(this);
+        }
+      }
+      return options.inverse(this);
+    });
+    Handlebars.registerHelper("gt", function(a, b) {
+      return a > b;
+    });
+    const html = this.generateHTML(filteredResults, totalDuration);
     const outputPath = path2.resolve(process.cwd(), "ortoni-report.html");
     fs.writeFileSync(outputPath, html);
     console.log(`Ortoni HTML report generated at ${outputPath}`);
   }
-  generateHTML() {
+  generateHTML(filteredResults, totalDuration) {
+    const totalTests = filteredResults.length;
+    const passedTests = this.results.filter((r) => r.status === "passed").length;
+    const flakyTests = this.results.filter((r) => r.flaky === "flaky").length;
+    const failed = filteredResults.filter((r) => r.status === "failed" || r.status === "timedOut").length;
+    const successRate = ((passedTests + flakyTests) / totalTests * 100).toFixed(2);
     const templateSource = fs.readFileSync(path2.resolve(__dirname, "report-template.hbs"), "utf-8");
     const template = Handlebars.compile(templateSource);
     const data = {
-      totalDuration: this.results[0].totalDuration,
+      totalDuration,
       suiteName: this.suiteName,
       results: this.results,
-      passCount: this.results.filter((r) => r.status === "passed").length,
-      failCount: this.results.filter((r) => r.status === "failed" || r.status === "timedOut").length,
+      retryCount: this.results.filter((r) => r.isRetry).length,
+      passCount: passedTests,
+      failCount: failed,
       skipCount: this.results.filter((r) => r.status === "skipped").length,
-      flakyCount: this.results.filter((r) => r.flaky === "flaky").length,
-      totalCount: this.results.length,
+      flakyCount: flakyTests,
+      totalCount: filteredResults.length,
       groupedResults: this.groupedResults,
       projectName: this.config.projectName,
-      // Include project name
       authorName: this.config.authorName,
-      // Include author name
-      testType: this.config.testType
-      // Include test type
+      testType: this.config.testType,
+      successRate,
+      lastRunDate: formatDate(/* @__PURE__ */ new Date())
     };
     return template(data);
   }