ortoni-report 1.1.8 → 2.0.0

package/dist/report-template.hbs

@@ -188,9 +188,6 @@
                                                             alt="flaky"></span>
                                                         {{/if}}
                                                         <span>{{title}}</span>
-                                                        {{#if retryCount}}
-                                                        <p>Retry Count: {{retryCount}}</p>
-                                                        {{/if}}
                                                     </div>
                                                 </li>
                                                 {{/each}}
@@ -316,6 +313,8 @@
     </section>
     <script src="node_modules/ortoni-report/dist/utils/chart.js"></script>
     <script>
+        
+
         function escapeHtml(unsafe) {
             return unsafe.replace(/[&<"']/g, function (match) {
                 const escapeMap = {
@@ -508,7 +507,31 @@
                 });
                 return stepsList;
             }
-
+            function openModal() {
+                let modal = document.querySelector("#testImage");
+                modal.classList.add("is-active");
+            }
+            function openVideo(){
+                let modal = document.querySelector("#testVideo");
+                modal.classList.add("is-active");
+            }
+            function closeVideo(){
+                let modal = document.querySelector("#testVideo");
+                modal.classList.remove("is-active");
+            }
+            function closeModal() {
+                let modal = document.querySelector("#testImage");
+                modal.classList.remove("is-active");
+            }
+            window.openModal = openModal;
+            window.openVideo = openVideo;
+            window.closeVideo = closeVideo;
+            window.closeModal = closeModal;
+            
+            document.addEventListener('keydown', (event) => {
+            if (event.key === "Escape") {
+                closeModal();
+            }});
 
             function attachEventListeners() {
                 const testItems = document.querySelectorAll('[data-test-id]');
@@ -647,6 +670,5 @@
         });
 
     </script>
-<script src="node_modules/ortoni-report/dist/utils/modal.js"></script>
 </body>
 </html>

package/dist/utils/utils.js

@@ -3,25 +3,28 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.formatDate = exports.normalizeFilePath = exports.msToTime = void 0;
+exports.ensureHtmlExtension = exports.safeStringify = exports.formatDate = exports.normalizeFilePath = exports.msToTime = void 0;
 const path_1 = __importDefault(require("path"));
 function msToTime(duration) {
-    const milliseconds = Math.floor((duration % 1000));
+    const milliseconds = Math.floor(duration % 1000);
     const seconds = Math.floor((duration / 1000) % 60);
     const minutes = Math.floor((duration / (1000 * 60)) % 60);
     const hours = Math.floor((duration / (1000 * 60 * 60)) % 24);
     let result = '';
     if (hours > 0) {
-        result += (hours < 10 ? "0" + hours : hours) + "h:";
+        result += `${hours}h:`;
     }
-    if (minutes > 0 || hours > 0) { // Include minutes if hours are included
-        result += (minutes < 10 ? "0" + minutes : minutes) + "m:";
+    if (minutes > 0 || hours > 0) {
+        result += `${minutes < 10 ? '0' + minutes : minutes}m:`;
     }
-    if (seconds > 0 || minutes > 0 || hours > 0) { // Include seconds if minutes or hours are included
-        result += (seconds < 10 ? "0" + seconds : seconds) + "s";
+    if (seconds > 0 || minutes > 0 || hours > 0) {
+        result += `${seconds < 10 ? '0' + seconds : seconds}s`;
     }
-    if (milliseconds > 0) {
-        result += ":" + (milliseconds < 100 ? "0" + milliseconds : milliseconds) + "ms";
+    if (milliseconds > 0 && !(seconds > 0 || minutes > 0 || hours > 0)) {
+        result += `${milliseconds}ms`;
+    }
+    else if (milliseconds > 0) {
+        result += `:${milliseconds < 100 ? '0' + milliseconds : milliseconds}ms`;
     }
     return result;
 }
@@ -42,3 +45,27 @@ function formatDate(date) {
 }
 exports.formatDate = formatDate;
 ;
+function safeStringify(obj, indent = 2) {
+    const cache = new Set();
+    const json = JSON.stringify(obj, (key, value) => {
+        if (typeof value === 'object' && value !== null) {
+            if (cache.has(value)) {
+                return;
+            }
+            cache.add(value);
+        }
+        return value;
+    }, indent);
+    cache.clear();
+    return json;
+}
+exports.safeStringify = safeStringify;
+function ensureHtmlExtension(filename) {
+    const ext = path_1.default.extname(filename);
+    if (ext && ext.toLowerCase() === '.html') {
+        return filename;
+    }
+    return `${filename}.html`;
+}
+exports.ensureHtmlExtension = ensureHtmlExtension;
+;

package/package.json

@@ -1,8 +1,13 @@
 {
   "name": "ortoni-report",
-  "version": "1.1.8",
+  "version": "2.0.0",
   "description": "Playwright Report By LetCode with Koushik",
+  "bin": {
+    "ortoni-report": "./dist/cli/cli.js"
+  },
   "scripts": {
+    "buildparcel": "parcel build",
+    "tsc": "tsc",
     "test": "npx playwright test",
     "build": "tsup",
     "release": "npm publish",
@@ -31,18 +36,19 @@
     "url": "https://github.com/ortoniKC/ortoni-report/issues"
   },
   "homepage": "https://github.com/ortoniKC/ortoni-report#readme",
-  "dependencies": {
-    "colors": "^1.4.0",
-    "handlebars": "^4.7.8",
-    "ws": "^8.18.0"
-  },
   "devDependencies": {
     "@playwright/test": "^1.44.1",
-    "@types/node": "^20.14.2",
+    "@types/node": "^22.0.2",
+    "colors": "^1.4.0",
+    "handlebars": "^4.7.8",
     "tsup": "^6.5.0",
-    "typescript": "^4.9.4"
+    "typescript": "^4.9.4",
+    "commander": "^12.1.0"
+  },
+  "dependencies": {
+    "parcel": "^2.12.0"
   },
   "main": "dist/ortoni-report.js",
   "module": "dist/ortoni-report.mjs",
   "types": "dist/ortoni-report.d.ts"
-}
+}

package/readme.md

@@ -1,12 +1,12 @@
-## Playwright Report by Koushik
+# Playwright Report by Koushik
 
-Welcome to OrtoniReport (Playwright report - unofficial), a robust HTML report generator tailored for Playwright tests. This release introduces powerful features to enhance test reporting, making it easier to visualize and manage test results.
+Welcome to Ortoni Report (Playwright report - unofficial), a robust HTML report generator tailored for Playwright tests. Ortoni Report introduces powerful features to enhance test reporting, making it easier to visualize and manage test results.
 
 Explore the live demo: [OrtoniReport Demo](https://ortoni.netlify.app/)
 
-![OrtoniReport](https://github.com/ortoniKC/ortoni-report/assets/58769833/e88f33d4-eb5c-41c7-b90a-f8a283af0058)
+![alt text](Ortoni-Report.png)
 
-### Key Features
+## Key Features
 
 1. **Hierarchical Grouping**
    - Tests are grouped hierarchically by file name, suite, and project, offering a structured view of test execution.
@@ -32,6 +32,7 @@ Explore the live demo: [OrtoniReport Demo](https://ortoni.netlify.app/)
 7. **Customization and Themes**
    - Customize project details, author name, test types, and toggle between dark/light themes.
    - Option to choose between Base64 images or file path for screenshots.
+   - User can set the report file name
 
 8. **Responsive Design**
    - Optimized layout that adapts seamlessly to different screen sizes for accessibility.
@@ -39,9 +40,36 @@ Explore the live demo: [OrtoniReport Demo](https://ortoni.netlify.app/)
 9. **Integration and Configuration**
    - Easily integrate with Playwright configurations using TypeScript/JavaScript.
    - Configure reporting preferences within your Playwright setup.
-
+   
 10. **Add logo to the report**
-   - Add relative or absolute path of the image to the config
+      - Add relative or absolute path of the image to the config.
+
+11. **Share report**
+      - Generat the report and zip the folder and share.   
+
+
+### How to Use ortoni-report
+
+### Installation
+
+1. **Install the ortoni-report package**:
+
+    ```sh
+    npm install -g ortoni-report
+    ```
+
+### Generate and Bundle HTML Report
+
+2. **Generate and bundle the report** (Optional):
+
+    ```sh
+    npx ortoni-report gr -f ortoni-report.html
+    ```
+
+### Command Overview
+
+- `npx ortoni-report gr -f <filename>`: Bundle the specified report file.
+  - `-f, --filename <filename>`: Specify the filename for the generated report (default: `ortoni-report.html`).   
 
 ### Configurable Report Generation
 
@@ -52,6 +80,7 @@ import { defineConfig } from '@playwright/test';
 import { OrtoniReportConfig } from 'ortoni-report';
 
 const reportConfig: OrtoniReportConfig = {
+  filename:"myawesomereport.html",
   logo: "path/logo.png",
   authorName: "LetCode Koushik",
   base64Image: false,
@@ -66,9 +95,19 @@ export default defineConfig({
 });
 ```
 
+### Common Issue
+```
+Error: Command failed:
+@parcel/namer-default: Target "main" declares an     
+output file path of "index.js" which does not match  
+the compiled bundle type "html".
+```
+Solution:
+Remove "main" in the ```package.json``` file
+
 ### Comprehensive Test Details
 
-- **Rich Test Information:** Each test includes details like title, status, duration, tags, errors, steps, logs, video, and screenshot paths.
+- **Rich Test Information:** Each test includes details like title, status, duration, tags, errors, steps, logs, video, and screenshot.
 - **Color-coded Status:** Status indicators (green for passed, red for failed, yellow for skipped) for quick identification.
 
 ### Handlebars Template Integration

package/dist/utils/modal.js

@@ -1,23 +0,0 @@
-// Functions to open and close a modal
-function openModal() {
-  let modal = document.querySelector("#testImage");
-  modal.classList.add("is-active")
-}
-function openVideo(){
- let modal = document.querySelector("#testVideo");;
-  modal.classList.add("is-active")
-}
-function closeVideo(){
-  let modal = document.querySelector("#testVideo");;
-   modal.classList.remove("is-active")
- }
-function closeModal() {
-  let modal = document.querySelector("#testImage");;
-  modal.classList.remove("is-active")
-}
-// Add a keyboard event to close all modals
-document.addEventListener('keydown', (event) => {
-  if (event.key === "Escape") {
-    closeModal();
-  }
-});