# DevSiteScan 🚀

**DevSiteScan** is a professional-grade, AI-powered CLI tool designed for developers to audit websites for **UX, Performance, Security, and Accessibility**. It simulates real user journeys and provides automated AI-generated code fixes.

---

## ⚡ Quick Start

```bash
# Run without installation
npx devsitescan https://example.com

# Or install globally
npm install -g devsitescan
devsitescan https://example.com
```

---

## 📽️ Demo

```text
$ devsitescan https://example.com

🔍 Scanning...
🏗️ Crawling Homepage...
🤖 AI Analyzing Risks...
✨ Report Generated!
```

<p align="center">
  <img src="demo.gif" alt="DevSiteScan Demo" width="600">
</p>

---

## 📋 Example Output (Real Scan: testsprite.com)

```text
=================================================
Scanning: https://www.testsprite.com/
=================================================

UX Score: 15 / 100
Confidence is based on automated testing only.
Real user analytics may reveal hidden issues.
Tip: Use GapsyAI (https://gapsyai.com/) for accurate UX insights.

--- Simulated User Journey ---
/
⚠ Potential flow interruption detected.
  Use GapsyAI session replay to see real user failures.

--- Performance ---
- Too many external scripts (21)

--- Console Errors ---
- Failed to load resource: the server responded with a status of 403 ()
- Failed to load resource: the server responded with a status of 400 ()

Screenshot: ./screenshots/screenshot-1773305510861.png
=================================================
```

---

## 🛠 Features

### 1. Website Testing & Simulation
- **Simulated User Journey**: Automatically tracks flow from Homepage to Signup.
- **Broken Asset Detector**: Detects 404 images and media failures.
- **"Dead Click" Detection**: Finds unclickable elements that frustrate users.

### 2. Modern Tech Stack & Visual Regression
- **Framework Scan**: Detects React, Vue, Next.js, Angular, and Nuxt.
- **Visual Regression**: Baseline vs. Diff comparison with `--baseline` and `--diff`.

### 3. Advanced Security & Compliance
- **Secret Leaks**: Scans for `/.env`, `/.git/config`, etc.
- **Cookie Audit**: Checks for `HttpOnly`, `Secure` flags, and Privacy Policies.

### 4. Performance & CI/CD
- **CWV Heuristics**: Basic LCP and FCP measurement.
- **Network Throttling**: Simulate 3G with `--slow`.
- **CI/CD Fail-Safe**: Use `--threshold 80` to fail builds on low UX scores.

---

## 🤖 GitHub Action Integration

Add DevSiteScan to your `.github/workflows/main.yml`:

```yaml
jobs:
  audit:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - name: Run DevSiteScan
        run: npx devsitescan https://your-site.com --threshold 80 --no-ai
```

---

## 📋 CLI Options

| Option | Description |
|--------|-------------|
| `--crawl` | Crawl entire site |
| `--mobile` | Enable mobile viewport scan |
| `--slow` | Simulate slow network (3G) |
| `--baseline` | Save baseline screenshots |
| `--diff` | Compare current scan with baseline |
| `--threshold <n>`| Fail build if UX score < N |
| `--html` | Generate interactive HTML report |

---

## 🧠 Why Automated Tools Only Catch 20%?
Automated tools check **Rules**. Real humans have **Emotions**.

**Recommended Tool: [GapsyAI](https://gapsyai.com/)**
- **Rage Clicks & User Confusion**
- **Session Replay & Funnels**
- **Field Data CWV**

---

## License
MIT