bdd tests

tests/e2e/bdd/dashboard/README.md

@@ -0,0 +1,120 @@
+# 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

tests/e2e/bdd/dashboard/dashboard-error-states.spec.ts

@@ -0,0 +1,117 @@
+/**
+ * BDD E2E Test: Dashboard Error States and Edge Cases
+ * 
+ * Tests error handling and edge cases for the dashboard:
+ * - Dashboard access without authentication
+ * - Dashboard access with network errors
+ * - Dashboard access with API errors
+ * - Dashboard access with no data available
+ * 
+ * Focus: Final user outcomes - what the driver experiences in error scenarios
+ */
+
+import { test, expect } from '@playwright/test';
+
+test.describe('Dashboard Error States', () => {
+  test('Driver cannot access dashboard without authentication', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Unauthenticated access to dashboard
+    // Given I am not authenticated
+    // When I try to access the dashboard page directly
+    // Then I should be redirected to the login page
+    // And I should see an authentication required message
+  });
+
+  test('Driver sees error message when dashboard API fails', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Dashboard API error
+    // Given I am a registered driver "John Doe"
+    // And the dashboard API is unavailable
+    // When I navigate to the dashboard page
+    // Then I should see an error message
+    // And I should see options to retry or contact support
+  });
+
+  test('Driver sees error message when dashboard data is invalid', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Dashboard data validation error
+    // Given I am a registered driver "John Doe"
+    // And the dashboard API returns invalid data
+    // When I navigate to the dashboard page
+    // Then I should see an error message
+    // And I should see options to retry or contact support
+  });
+
+  test('Driver sees empty dashboard when no data is available', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: New driver with no data
+    // Given I am a newly registered driver
+    // And I have no race history or upcoming races
+    // When I navigate to the dashboard page
+    // Then I should see the dashboard layout
+    // And I should see my basic driver stats (rating, rank, etc.)
+    // And I should see empty states for upcoming races
+    // And I should see empty states for championship standings
+    // And I should see empty states for recent activity
+  });
+
+  test('Driver dashboard handles network timeout gracefully', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Network timeout
+    // Given I am a registered driver "John Doe"
+    // And the dashboard API times out
+    // When I navigate to the dashboard page
+    // Then I should see a timeout error message
+    // And I should see a retry button
+  });
+
+  test('Driver dashboard handles server error (500) gracefully', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Server error
+    // Given I am a registered driver "John Doe"
+    // And the dashboard API returns a 500 error
+    // When I navigate to the dashboard page
+    // Then I should see a server error message
+    // And I should see options to retry or contact support
+  });
+
+  test('Driver dashboard handles not found error (404) gracefully', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Not found error
+    // Given I am a registered driver "John Doe"
+    // And the dashboard API returns a 404 error
+    // When I navigate to the dashboard page
+    // Then I should see a not found error message
+    // And I should see options to retry or contact support
+  });
+
+  test('Driver dashboard handles unauthorized error (401) gracefully', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Unauthorized error
+    // Given I am a registered driver "John Doe"
+    // And my session has expired
+    // When I navigate to the dashboard page
+    // Then I should be redirected to the login page
+    // And I should see an authentication required message
+  });
+
+  test('Driver dashboard handles forbidden error (403) gracefully', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Forbidden error
+    // Given I am a registered driver "John Doe"
+    // And I do not have permission to access the dashboard
+    // When I navigate to the dashboard page
+    // Then I should see a forbidden error message
+    // And I should see options to contact support
+  });
+
+  test('Driver dashboard handles validation error gracefully', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Validation error
+    // Given I am a registered driver "John Doe"
+    // And the dashboard API returns validation errors
+    // When I navigate to the dashboard page
+    // Then I should see a validation error message
+    // And I should see options to retry or contact support
+  });
+});

tests/e2e/bdd/dashboard/dashboard-navigation.spec.ts

@@ -0,0 +1,71 @@
+/**
+ * BDD E2E Test: Dashboard Navigation
+ * 
+ * Tests navigation functionality from the dashboard:
+ * - Navigation to the full races schedule page
+ * - Navigation to other dashboard sections (if applicable)
+ * 
+ * Focus: Final user outcomes - what the driver can navigate to from the dashboard
+ */
+
+import { test, expect } from '@playwright/test';
+
+test.describe('Dashboard Navigation', () => {
+  test.beforeEach(async ({ page }) => {
+    // TODO: Implement authentication setup for a registered driver
+    // - Navigate to login page
+    // - Enter credentials for "John Doe" or similar test driver
+    // - Verify successful login
+    // - Navigate to dashboard page
+  });
+
+  test('Driver can navigate to full races schedule from dashboard', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver navigates to full schedule
+    // Given I am a registered driver "John Doe"
+    // And I am on the Dashboard page
+    // When I click the "View Full Schedule" button
+    // Then I should be redirected to the races schedule page
+    // And I should see the full list of upcoming races
+  });
+
+  test('Driver can navigate to specific race details from upcoming races list', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver navigates to race details
+    // Given I am a registered driver "John Doe"
+    // And I have upcoming races on the dashboard
+    // When I click on a specific upcoming race
+    // Then I should be redirected to the race details page
+    // And I should see detailed information about that race
+  });
+
+  test('Driver can navigate to league details from standings', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver navigates to league details
+    // Given I am a registered driver "John Doe"
+    // And I have championship standings on the dashboard
+    // When I click on a league name in the standings
+    // Then I should be redirected to the league details page
+    // And I should see detailed standings and information
+  });
+
+  test('Driver can navigate to race results from recent activity', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver navigates to race results
+    // Given I am a registered driver "John Doe"
+    // And I have race results in the recent activity feed
+    // When I click on a race result activity item
+    // Then I should be redirected to the race results page
+    // And I should see detailed results for that race
+  });
+
+  test('Dashboard navigation maintains user session', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Navigation preserves authentication
+    // Given I am a registered driver "John Doe"
+    // And I am on the Dashboard page
+    // When I navigate to another page
+    // Then I should remain authenticated
+    // And I should be able to navigate back to the dashboard
+  });
+});

tests/e2e/bdd/dashboard/driver-dashboard-view.spec.ts

@@ -0,0 +1,130 @@
+/**
+ * BDD E2E Test: Driver Dashboard View
+ * 
+ * Tests the main dashboard view that displays:
+ * - Current driver statistics (rating, rank, starts, wins, podiums, leagues)
+ * - Next race information (track, car, scheduled time, time until)
+ * - Upcoming races (list of 3 races)
+ * - Championship standings (league name, position, points)
+ * - Recent activity feed (race results, other events)
+ * 
+ * Focus: Final user outcomes - what the driver sees and can verify
+ */
+
+import { test, expect } from '@playwright/test';
+
+test.describe('Driver Dashboard View', () => {
+  test.beforeEach(async ({ page }) => {
+    // TODO: Implement authentication setup for a registered driver
+    // - Navigate to login page
+    // - Enter credentials for "John Doe" or similar test driver
+    // - Verify successful login
+    // - Navigate to dashboard page
+  });
+
+  test('Driver sees their current statistics on the dashboard', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver views their personal stats
+    // Given I am a registered driver "John Doe"
+    // And I am on the Dashboard page
+    // Then I should see my current rating displayed
+    // And I should see my current rank displayed
+    // And I should see my total race starts displayed
+    // And I should see my total wins displayed
+    // And I should see my total podiums displayed
+    // And I should see my active leagues count displayed
+  });
+
+  test('Driver sees next race information when a race is scheduled', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver views next race details
+    // Given I am a registered driver "John Doe"
+    // And I have an upcoming race scheduled
+    // When I am on the Dashboard page
+    // Then I should see the "Next Event" section
+    // And I should see the track name (e.g., "Monza")
+    // And I should see the car type (e.g., "GT3")
+    // And I should see the scheduled date and time
+    // And I should see the time until the race (e.g., "2 days 4 hours")
+  });
+
+  test('Driver sees upcoming races list on the dashboard', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver views upcoming races
+    // Given I am a registered driver "John Doe"
+    // And I have multiple upcoming races scheduled
+    // When I am on the Dashboard page
+    // Then I should see the "Upcoming Schedule" section
+    // And I should see up to 3 upcoming races
+    // And each race should show track name, car type, date, and time until
+  });
+
+  test('Driver sees championship standings on the dashboard', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver views their championship standings
+    // Given I am a registered driver "John Doe"
+    // And I am participating in active championships
+    // When I am on the Dashboard page
+    // Then I should see the "Championship Standings" section
+    // And I should see each league name I'm participating in
+    // And I should see my current position in each league
+    // And I should see my current points in each league
+    // And I should see the total number of drivers in each league
+  });
+
+  test('Driver sees recent activity feed on the dashboard', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver views recent activity
+    // Given I am a registered driver "John Doe"
+    // And I have recent race results or other events
+    // When I am on the Dashboard page
+    // Then I should see the "Recent Activity" section
+    // And I should see activity items with type, description, and timestamp
+    // And race results should be marked with success status
+    // And other events should be marked with info status
+  });
+
+  test('Driver sees empty state when no upcoming races exist', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver with no upcoming races
+    // Given I am a registered driver "John Doe"
+    // And I have no upcoming races scheduled
+    // When I am on the Dashboard page
+    // Then I should see the "Upcoming Schedule" section
+    // And I should see a message indicating no upcoming races
+  });
+
+  test('Driver sees empty state when no championship standings exist', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver with no active championships
+    // Given I am a registered driver "John Doe"
+    // And I am not participating in any active championships
+    // When I am on the Dashboard page
+    // Then I should see the "Championship Standings" section
+    // And I should see a message indicating no active championships
+  });
+
+  test('Driver sees empty state when no recent activity exists', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver with no recent activity
+    // Given I am a registered driver "John Doe"
+    // And I have no recent race results or events
+    // When I am on the Dashboard page
+    // Then I should see the "Recent Activity" section
+    // And I should see a message indicating no recent activity
+  });
+
+  test('Dashboard displays KPI overview with correct values', async ({ page }) => {
+    // TODO: Implement test
+    // Scenario: Driver views KPI overview
+    // Given I am a registered driver "John Doe"
+    // When I am on the Dashboard page
+    // Then I should see a KPI row with 6 items:
+    // - Rating (primary intent)
+    // - Rank (warning intent)
+    // - Starts (default intent)
+    // - Wins (success intent)
+    // - Podiums (warning intent)
+    // - Leagues (default intent)
+  });
+});