# Dashboard BDD E2E Tests

This directory contains BDD (Behavior-Driven Development) E2E tests for the GridPilot dashboard functionality.

## Test Coverage

### 1. Driver Dashboard View (`driver-dashboard-view.spec.ts`)
Tests the main dashboard view that displays driver information and upcoming events.

**Scenarios:**
- Driver sees their current statistics (rating, rank, starts, wins, podiums, leagues)
- Driver sees next race information when a race is scheduled
- Driver sees upcoming races list (up to 3 races)
- Driver sees championship standings
- Driver sees recent activity feed
- Driver sees empty states when no data is available
- Dashboard displays KPI overview with correct values

**Focus:** Final user outcomes - what the driver sees and can verify on the dashboard.

### 2. Dashboard Navigation (`dashboard-navigation.spec.ts`)
Tests navigation functionality from the dashboard to other pages.

**Scenarios:**
- Driver can navigate to full races schedule from dashboard
- Driver can navigate to specific race details from upcoming races list
- Driver can navigate to league details from standings
- Driver can navigate to race results from recent activity
- Dashboard navigation maintains user session

**Focus:** Final user outcomes - what the driver can navigate to from the dashboard.

### 3. Dashboard Error States (`dashboard-error-states.spec.ts`)
Tests error handling and edge cases for the dashboard.

**Scenarios:**
- Driver cannot access dashboard without authentication
- Driver sees error message when dashboard API fails
- Driver sees error message when dashboard data is invalid
- Driver sees empty dashboard when no data is available
- Driver dashboard handles network timeout gracefully
- Driver dashboard handles server error (500) gracefully
- Driver dashboard handles not found error (404) gracefully
- Driver dashboard handles unauthorized error (401) gracefully
- Driver dashboard handles forbidden error (403) gracefully
- Driver dashboard handles validation error gracefully

**Focus:** Final user outcomes - what the driver experiences in error scenarios.

## Dashboard Functionality Overview

The dashboard displays the following information for a registered driver:

### Current Driver Stats
- **Rating**: Driver's current rating
- **Rank**: Driver's current rank (e.g., #123)
- **Starts**: Total number of races started
- **Wins**: Total number of race wins
- **Podiums**: Total number of podium finishes
- **Leagues**: Number of active leagues

### Next Race (if scheduled)
- Track name
- Car type
- Scheduled date and time
- Time until race (e.g., "2 days 4 hours")

### Upcoming Races (up to 3)
- Track name
- Car type
- Scheduled date and time
- Time until race

### Championship Standings
- League name
- Current position in league
- Current points
- Total number of drivers in league

### Recent Activity Feed
- Activity type (race_result, etc.)
- Description/headline
- Timestamp
- Status (success for race results, info for other events)

## Test Philosophy

These tests follow the BDD testing concept defined in `plans/bdd_testing_concept.md`:

1. **Focus on Outcomes**: Tests validate final user outcomes, not visual implementation
2. **Gherkin Syntax**: Tests use Given/When/Then structure
3. **Acceptance Criteria**: Tests serve as the final source of truth for dashboard functionality
4. **Playwright**: Tests use Playwright for E2E testing

## Implementation Notes

- All test files are placeholders with TODO comments
- Tests should be implemented using Playwright
- Authentication setup should be shared across tests
- Tests should validate final user outcomes, not implementation details
- Tests should be independent and can run in any order

## Directory Structure

```
tests/e2e/bdd/dashboard/
├── driver-dashboard-view.spec.ts      # Main dashboard view tests
├── dashboard-navigation.spec.ts       # Navigation tests
├── dashboard-error-states.spec.ts     # Error handling tests
└── README.md                          # This file
```

## Related Files

- `apps/website/app/dashboard/page.tsx` - Dashboard page component
- `apps/website/app/dashboard/layout.tsx` - Dashboard layout
- `apps/website/client-wrapper/DashboardPageClient.tsx` - Client wrapper
- `apps/website/templates/DashboardTemplate.tsx` - Dashboard template
- `apps/website/lib/view-data/DashboardViewData.ts` - Dashboard view data interface
- `plans/bdd_testing_concept.md` - BDD testing concept and philosophy