slik-report 1.0.5 → 1.0.6

package/README.md

@@ -1,6 +1,136 @@
+# ✨ Slik Report — Advanced HTML Reporting for Playwright
+
+Slik Report is a **modern, compact, and insight-driven HTML report** for Playwright test runs.  
+It goes beyond pass/fail and focuses on **test stability, flakiness, trends, and execution confidence** — all in a single, readable report.
+
+🔗 NPM: https://www.npmjs.com/package/slik-report
+
+---
+
+## 🚀 Why Slik Report?
+
+Most Playwright reports answer only one question:
+> Did tests pass or fail?
+
+Slik Report answers better questions:
+- How **stable** is my system?
+- Are failures **flaky or reproducible**?
+- Is quality improving over time?
+- Where is execution time actually going?
+
+And it does this without breaking UI at lower zoom levels or cluttering the screen.
+
+---
+
+## 🧠 What Makes Slik Report Different?
+
+### 📊 Confidence-Driven Overview
+The Overview page provides **system-level confidence metrics**, not just counts:
+
+- Total / Passed / Failed / Skipped
+- Pass Rate
+- Stability Score (0–100)
+- Flaky Test Percentage
+- Retry Dependency
+- Failure Reproducibility
+- Risk Level (STABLE / UNSTABLE / HIGH RISK)
+
+This turns raw test data into **decision-ready insights**.
+
+---
+
+### 🧭 Rich Navigation Structure
+
+The report includes clearly separated views:
+
+- **Overview** – KPIs, confidence & metadata
+- **Categories** – Failure grouping (when applicable)
+- **Suites** – Expandable suites → tests → logs
+- **Execution View** – Visual execution flow
+- **Graphs** – Trends, duration distribution, pass rate history
+- **Timeline** – Sequential execution timeline
+- **Historical Runs** – Quality trend across runs
+- **Tags** – Tag-based analysis (auto-enabled)
+- **External HTML** – Embed Playwright’s native report
+
+All sections are available from a fixed sidebar for fast navigation.
+
+---
+
+### 📈 Graphs & Trends Built-In
+
+Slik Report includes visual analytics out of the box:
+
+- Pass / Fail / Skip distribution
+- Test duration histogram
+- Pass-rate trend across runs
+- Historical regression detection
+- Execution timeline chart
+
+No external tools required.
+
+---
+
+### 🧪 Flaky Test Detection
+
+Tests are automatically marked **flaky** when history indicates instability.
+
+You get:
+- Flaky percentage
+- Historical status tracking
+- Retry dependency metrics
+- Visual flaky indicators
+
+This helps teams fix **root causes**, not just rerun failures.
+
+---
+
+### 🧾 Deep Test Logs (API-Friendly)
+
+Each test can expose:
+- Request / response logs
+- Headers and payloads
+- Execution duration
+- Status history
+- Retry behavior
+
+Ideal for **API automation** and backend workflows.
+
+---
+
+### 🌓 Dark Mode & Compact UI
+
+- Light and dark themes
+- Layout remains readable at **80–90% zoom**
+- Designed for laptops, CI artifacts, and shared screens
+
+---
+
+### 📥 Built-In Downloads
+
+One-click export:
+- HTML
+- CSV
+- JSON
+
+Perfect for audits, sharing, or offline analysis.
+
 # slik-report
 
-A powerful Playwright reporter for aggregating test results, flakiness analysis, and historical trend tracking.
+A powerful and interactive Playwright reporter designed for deep test analysis, flakiness tracking, and historical trend visualization.
+
+## Features
+
+- 📊 **Advanced KPI Tracking**: Monitor Pass Rate Consistency (Standard Deviation), Flaky Test Percentage, and Failure Reproducibility.
+- 💯 **Stability Scoring**: A dedicated algorithm calculates an overall stability score (0-100) and risk level for your test suite.
+- 🏷️ **Tag Analysis**: Automated breakdown of metrics by test `@tags`, providing pass rates and duration insights for categorized tests.
+- 🕒 **Historical Trends**: Visualize test performance over time to identify regressions and flakiness patterns across last 20+ runs.
+- 🔍 **Failure Categorization**: Auto-groups failed tests into **Bugs** (Assertion failures) and **Script Issues** (Timeouts/Logic errors).
+- 📈 **Execution Flow**: A hierarchical graph (powered by Cytoscape) that visualizes the flow from Suites to Files to individual Test cases.
+- 🌓 **Interactive Dashboard**: Modern UI with Dark Mode, Global Search (across suites, tests, and logs), and smooth animations.
+- 💾 **Multi-Format Export**: One-click downloads for your summary data in **HTML**, **CSV**, or **JSON** formats.
+- 🔗 **External Report Linking**: Seamlessly jump to Playwright's detailed HTML portal for traces, videos, and network logs.
+
 
 ## Installation
 
@@ -10,11 +140,7 @@ npm install slik-report --save-dev
 
 ## How to Use
 
-To use `slik-report` with Playwright, you need to configure it in your `playwright.config.ts` file.
-
-### Configuration Example
-
-Add `slik-report` to the `reporter` array in your `playwright.config.ts`:
+Configure `slik-report` in your `playwright.config.ts`:
 
 ```typescript
 // playwright.config.ts
@@ -23,23 +149,24 @@ import { defineConfig } from '@playwright/test';
 export default defineConfig({
   reporter: [
     ['json', { outputFile: 'playwright-report/report.json' }],
-    // Use the Slik Report reporter and pass options
     ['slik-report', {
-      input: 'playwright-report/report.json', // Path to the JSON report generated by Playwright
-      output: 'slik-report.html',             // Output file name for the Slik report
-      history: './slik_history',              // Directory to store history data
+      input: 'playwright-report/report.json', // Source JSON from Playwright
+      output: 'slik-report.html',             // Output path for Slik report
+      history: './slik_history',              // History storage directory
+      externalHtml: './playwright-report/index.html' // Optional: Link to Playwright HTML report
     }]
   ],
 });
 ```
 
-### Options
+## Configuration Options
 
-| Option    | Type   | Description                                      | Default                     |
-| :-------- | :----- | :----------------------------------------------- | :-------------------------- |
-| `input`   | string | Path to the JSON report file generated by Playwright. | `playwright-report/report.json` |
-| `output`  | string | Path where the HTML report will be generated.    | `slik-report.html`          |
-| `history` | string | Directory path to store historical run data.     | `./slik_history`            |
+| Option | Type | Description | Default |
+| :--- | :--- | :--- | :--- |
+| `input` | `string` | Path to the JSON report file generated by the Playwright 'json' reporter. | `playwright-report/report.json` |
+| `output` | `string` | Destination path where the Slik HTML dashboard will be generated. | `summary-report.html` |
+| `history` | `string` | Directory path where historical run data (JSON) will be stored. | `./reports/reports_history` |
+| `externalHtml`| `string` | Path to Playwright's standard HTML report for linking traces and logs. | `./playwright-report/reports/index.html` |
 
 ## License