Playwright-A11y-Dashboard/Outline.md

Project Outline: Playwright Dashboard v1

Core Features (v1)

Dashboard UI

• Submit a new scan job (manual URL entry, or import from sitemap)
• Choose from predefined scan profiles (fixtures)
• Show queued/running/completed jobs
• View summary results per scan (pass/fail counts, screenshot diffs, timestamp)
• Download or inspect full logs, JSON reports, etc.

Scan Runner (Worker)

• Headless Playwright runner service
• Consumes scan jobs from a queue or task table
• Runs tests per scan profile
• Saves structured results and artifacts to DB/storage

Database

• Users (optional for v1; could just be open if internal)
• ScanJobs: id, status, URLs, scanProfile, createdAt, startedAt, finishedAt, etc.
• ScanResults: per URL, with status, screenshot, log, metadata
• Fixtures: reusable definitions that map to Playwright test setups

Storage

Store screenshots, JSON logs, reports (could use DO Spaces or local disk initially)

Authentication (Optional)

Basic auth or DigitalOcean OAuth proxy if needed (internal access)

Suggested Tech Stack

Frontend

• Framework: TBD
• Styling: Tailwind CSS
• Charts/Graphs: Chart.js or Recharts (for pass/fail summaries)

Backend / API

• Language: Node.js (needed for Playwright)
• Playwright Integration: Separate worker or job processor using the Playwright API
• Job Queue: PostgreSQL-backed status tracking

Playwright Worker

Node service that:

• Polls DB for new jobs
• Runs Playwright with specified profile
• Uploads artifacts and writes results to DB

Database

Postgres Tables: users (optional), scan_jobs, scan_results, fixtures

File Storage

DO Spaces or local volume

Store screenshots, accessibility reports, raw output JSON

Deployment (DigitalOcean App Platform)

• One service: Dashboard App
• One background service: Worker (Playwright runner)
• Shared Postgres DB and Spaces bucket

Flow Overview

User → Web UI → Submit scan job
                       ↓
                Writes to DB
                       ↓
        Worker polls → finds new job
                       ↓
       Runs Playwright tests → stores results/screenshots
                       ↓
            UI polls for job status or gets WS update
                       ↓
              Displays results + logs

Dev Considerations

• Full local dev via docker-compose (Web UI + DB + Worker)
• Test fixtures in a tests/ folder, easy to map/override
• Webhook or CLI trigger support (so we could scan on deploy or PR merge)