Playwright Historical Dashboard & AI Reporter 🎭

An advanced, interactive historical metrics dashboard extension for Playwright test suites. Track your test suite execution trends across local runs, view performance visual analytics via dynamic charts, flip into a sleek Dark Mode, and leverage Google Gemini AI to diagnose test failure root causes instantly!

✨ Features

• 📈 Interactive Trend Analytics: View beautiful line and doughnut graphs charting your test outcomes over time using Chart.js.
• 🎯 Cross-Panel Event Filtering: Click directly on data points in your execution line graph to instantly switch and view the details of that specific historical run.
• 🌓 Sleek Theme Toggling: Full native support for a dark mode and light mode configuration that saves your preferences.
• 🤖 AI Root-Cause Diagnosis: Integrated with Google Gemini to analyze failed test stack traces on demand, providing succinct explanations and actionable code-fix suggestions.
• 🛡️ CI-Aware Runtime: Safely runs completely headlessly during CI automation pipelines, while spawning a rich interactive dashboard server locally.

🚀 Installation

Install the package alongside your Playwright project as a development dependency:

npm install playwright-historical-dashboard-reporter --save-dev
Ensure you have your official Gemini API Key ready if you wish to leverage the automated AI diagnostics system.

🛠️ Configuration
Open your project's playwright.config.ts (or playwright.config.js) file and append the reporter to your configurations:

TypeScript
import { defineConfig } from '@playwright/test';

export default defineConfig({
  // ... your existing options ...
  reporter: [
    ['html'], // Keeping default report formats active
    ['playwright-historical-dashboard-reporter'] // Adding the historical dashboard!
  ],
});
💻 How to Use
1. Set up your Environment Variable
To use the built-in AI debugging system, make sure your terminal instance can access your Gemini API Key. You can set this via your console or simply create a .env file in the root directory of your test project:

Code snippet
GEMINI_API_KEY=AIzaSyYourActualGeminiAPIKeyHere