wip

resources/iracing-hosted-sessions/README.md

@@ -1,2 +0,0 @@
-THE HTML FILES I DUMPED ARE JUST STUPID HTML FILES!!!! THEY ARE JUST TO HELP WITH HTML STRUCTURE!!
-THEY DO NOT REPRESENT THE REAL IRACING WEBSITE!!!!

resources/mock-fixtures/README.md

@@ -1,113 +0,0 @@
-# Mock HTML Fixtures
-
-Simplified HTML fixtures for E2E testing of the iRacing hosted session automation workflow.
-
-## Purpose
-
-These fixtures replace full-page iRacing dumps with lightweight, testable HTML pages that simulate the iRacing hosted session wizard. They are designed for use with the `FixtureServer` to test browser automation adapters in isolation.
-
-## Files
-
-| File | Step | Description |
-|------|------|-------------|
-| `step-02-hosted-racing.html` | 2 | Landing page with "Create a Race" button |
-| `step-03-create-race.html` | 3 | Race Information - session name, password, description |
-| `step-04-race-information.html` | 4 | Server Details - region, start time |
-| `step-05-server-details.html` | 5 | Set Admins - admin list management |
-| `step-06-set-admins.html` | 7 | Time Limits - practice, qualify, race durations |
-| `step-07-add-admin.html` | 6 | Add Admin Modal - search and select admin |
-| `step-08-time-limits.html` | 8 | Set Cars - car list management |
-| `step-09-set-cars.html` | 10 | Set Car Classes - multi-class configuration |
-| `step-10-add-car.html` | 9 | Add Car Modal - search and select cars |
-| `step-11-set-car-classes.html` | 11 | Set Track - track selection |
-| `step-12-set-track.html` | 13 | Track Options - configuration, dynamic track |
-| `step-13-add-track.html` | 12 | Add Track Modal - search and select track |
-| `step-14-track-options.html` | 14 | Time of Day - time slider, date, simulated time |
-| `step-15-time-of-day.html` | 15 | Weather - type, temperature, humidity |
-| `step-16-weather.html` | 16 | Race Options - max drivers, start type, cautions |
-| `step-17-race-options.html` | 17 | Team Driving - enable teams, min/max drivers |
-| `step-18-track-conditions.html` | 18 | Track Conditions - track state, marbles, rubber |
-| `common.css` | - | Shared styles for all fixtures |
-
-## Data Attributes
-
-All fixtures use consistent `data-*` attributes for reliable automation:
-
-### Navigation
-- `data-action="create"` - Create a Race button (step 2)
-- `data-action="next"` - Next step button
-- `data-action="back"` - Previous step button
-- `data-action="confirm"` - Confirm modal action
-- `data-action="cancel"` - Cancel modal action
-- `data-action="select"` - Select item from list
-
-### Step Identification
-- `data-step="N"` - Step number on body element
-- `data-indicator="name"` - Step indicator element
-
-### Form Fields
-- `data-field="name"` - Text/number inputs and textareas
-- `data-dropdown="name"` - Select dropdowns
-- `data-toggle="name"` - Checkbox toggles
-- `data-slider="name"` - Range slider inputs
-
-### Modals
-- `data-modal="true"` - Modal container (on body)
-- `data-modal-trigger="type"` - Button that opens a modal
-
-### Lists
-- `data-list="name"` - List container
-- `data-item="id"` - Selectable list item
-
-## Usage with FixtureServer
-
-```typescript
-import { FixtureServer } from '@infrastructure/adapters/automation/FixtureServer';
-
-const server = new FixtureServer({ fixturesPath: 'resources/mock-fixtures' });
-await server.start();
-
-// Navigate to step 2
-await page.goto(`${server.baseUrl}/step-02-hosted-racing.html`);
-
-// Use data attributes for automation
-await page.click('[data-action="create"]');
-await page.fill('[data-field="sessionName"]', 'My Race');
-await page.click('[data-action="next"]');
-```
-
-## Selector Strategy
-
-Use attribute selectors for reliable automation:
-
-```typescript
-const SELECTORS = {
-  stepContainer: (step: number) => `[data-step="${step}"]`,
-  nextButton: '[data-action="next"]',
-  backButton: '[data-action="back"]',
-  field: (name: string) => `[data-field="${name}"]`,
-  dropdown: (name: string) => `[data-dropdown="${name}"]`,
-  toggle: (name: string) => `[data-toggle="${name}"]`,
-  slider: (name: string) => `[data-slider="${name}"]`,
-  modal: '[data-modal="true"]',
-  modalTrigger: (type: string) => `[data-modal-trigger="${type}"]`,
-};
-```
-
-## Design Principles
-
-1. **Explicit Test Attributes**: Every interactive element has stable `data-*` attributes
-2. **Minimal HTML**: Only essential structure, no framework artifacts
-3. **Self-Contained**: Each fixture includes shared CSS via `common.css`
-4. **Navigation-Aware**: Buttons link to appropriate next/previous fixtures
-5. **Form Fields Match Domain**: Field names align with `HostedSessionConfig` entity
-
-## Testing Verification
-
-For each fixture, verify:
-- [ ] `data-step` attribute present on body
-- [ ] `data-indicator` present for step identification
-- [ ] All navigation buttons have `data-action`
-- [ ] All form fields have appropriate `data-*` attributes
-- [ ] Modal fixtures have `data-modal="true"`
-- [ ] Navigation links point to correct fixtures

resources/mock-fixtures/common.css

@@ -1,354 +0,0 @@
-/* Common styles for mock fixtures */
-* { 
-  box-sizing: border-box; 
-  margin: 0; 
-  padding: 0; 
-}
-
-body { 
-  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, sans-serif;
-  background: #1a1a2e; 
-  color: #eee; 
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-}
-
-.header {
-  background: #16213e;
-  padding: 16px 24px;
-  border-bottom: 1px solid #0f3460;
-}
-
-.step-indicator {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  font-size: 14px;
-  color: #888;
-}
-
-.step-indicator .current {
-  color: #e94560;
-  font-weight: bold;
-}
-
-.main {
-  flex: 1;
-  padding: 32px 24px;
-  max-width: 600px;
-  margin: 0 auto;
-  width: 100%;
-}
-
-.page-title {
-  font-size: 24px;
-  font-weight: 600;
-  margin-bottom: 24px;
-}
-
-.form-group {
-  margin-bottom: 20px;
-}
-
-.form-label {
-  display: block;
-  font-size: 14px;
-  color: #aaa;
-  margin-bottom: 6px;
-}
-
-.form-label.required::after {
-  content: " *";
-  color: #e94560;
-}
-
-.form-input,
-.form-select {
-  width: 100%;
-  padding: 12px 16px;
-  background: #16213e;
-  border: 1px solid #0f3460;
-  border-radius: 4px;
-  color: #eee;
-  font-size: 16px;
-}
-
-.form-input:focus,
-.form-select:focus {
-  outline: none;
-  border-color: #e94560;
-}
-
-textarea.form-input {
-  min-height: 100px;
-  resize: vertical;
-}
-
-.footer {
-  background: #16213e;
-  padding: 16px 24px;
-  border-top: 1px solid #0f3460;
-  display: flex;
-  justify-content: space-between;
-}
-
-.btn {
-  padding: 12px 24px;
-  border-radius: 4px;
-  font-size: 14px;
-  font-weight: 500;
-  cursor: pointer;
-  border: none;
-  transition: all 0.2s;
-}
-
-.btn-primary {
-  background: #e94560;
-  color: white;
-}
-
-.btn-primary:hover {
-  background: #ff6b6b;
-}
-
-.btn-secondary {
-  background: transparent;
-  color: #aaa;
-  border: 1px solid #0f3460;
-}
-
-.btn-secondary:hover {
-  background: #0f3460;
-  color: #eee;
-}
-
-/* Toggle/Checkbox styles */
-.toggle-group {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  margin-bottom: 16px;
-}
-
-.toggle-input {
-  width: 20px;
-  height: 20px;
-  cursor: pointer;
-}
-
-.toggle-label {
-  font-size: 14px;
-  color: #eee;
-  cursor: pointer;
-}
-
-/* Slider styles */
-.slider-group {
-  margin-bottom: 20px;
-}
-
-.slider-header {
-  display: flex;
-  justify-content: space-between;
-  margin-bottom: 8px;
-}
-
-.slider-label {
-  font-size: 14px;
-  color: #aaa;
-}
-
-.slider-value {
-  font-size: 14px;
-  color: #e94560;
-  font-weight: bold;
-}
-
-.slider-input {
-  width: 100%;
-  height: 8px;
-  border-radius: 4px;
-  background: #0f3460;
-  cursor: pointer;
-  -webkit-appearance: none;
-}
-
-.slider-input::-webkit-slider-thumb {
-  -webkit-appearance: none;
-  width: 20px;
-  height: 20px;
-  border-radius: 50%;
-  background: #e94560;
-  cursor: pointer;
-}
-
-/* List styles */
-.list-container {
-  background: #16213e;
-  border: 1px solid #0f3460;
-  border-radius: 4px;
-  min-height: 120px;
-  margin-bottom: 16px;
-  padding: 12px;
-}
-
-.list-empty {
-  color: #666;
-  text-align: center;
-  padding: 24px;
-  font-style: italic;
-}
-
-.list-item {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 12px;
-  background: #1a1a2e;
-  border-radius: 4px;
-  margin-bottom: 8px;
-  cursor: pointer;
-  transition: background 0.2s;
-}
-
-.list-item:hover {
-  background: #0f3460;
-}
-
-.list-item:last-child {
-  margin-bottom: 0;
-}
-
-.list-item.selected {
-  border: 2px solid #e94560;
-}
-
-/* Modal styles */
-.modal-overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0, 0, 0, 0.7);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 1000;
-}
-
-.modal-content {
-  background: #1a1a2e;
-  border-radius: 8px;
-  width: 90%;
-  max-width: 500px;
-  max-height: 80vh;
-  overflow-y: auto;
-  border: 1px solid #0f3460;
-}
-
-.modal-header {
-  padding: 16px 24px;
-  border-bottom: 1px solid #0f3460;
-}
-
-.modal-title {
-  font-size: 18px;
-  font-weight: 600;
-}
-
-.modal-body {
-  padding: 24px;
-}
-
-.modal-footer {
-  padding: 16px 24px;
-  border-top: 1px solid #0f3460;
-  display: flex;
-  justify-content: flex-end;
-  gap: 12px;
-}
-
-/* Search input */
-.search-group {
-  margin-bottom: 16px;
-}
-
-.search-input {
-  width: 100%;
-  padding: 12px 16px;
-  background: #16213e;
-  border: 1px solid #0f3460;
-  border-radius: 4px;
-  color: #eee;
-  font-size: 16px;
-}
-
-.search-input:focus {
-  outline: none;
-  border-color: #e94560;
-}
-
-/* Grid layout for cars/tracks */
-.grid-list {
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  gap: 12px;
-}
-
-.grid-item {
-  padding: 16px;
-  background: #16213e;
-  border: 1px solid #0f3460;
-  border-radius: 4px;
-  text-align: center;
-  cursor: pointer;
-  transition: all 0.2s;
-}
-
-.grid-item:hover {
-  border-color: #e94560;
-}
-
-.grid-item.selected {
-  border-color: #e94560;
-  background: #0f3460;
-}
-
-/* Center layout for landing page */
-.center-content {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  min-height: 60vh;
-  text-align: center;
-}
-
-.hero-title {
-  font-size: 32px;
-  font-weight: 700;
-  margin-bottom: 16px;
-}
-
-.hero-subtitle {
-  font-size: 16px;
-  color: #888;
-  margin-bottom: 32px;
-}
-
-.btn-large {
-  padding: 16px 48px;
-  font-size: 18px;
-}
-
-/* Display field (read-only) */
-.display-field {
-  padding: 12px 16px;
-  background: #0f3460;
-  border: 1px solid #0f3460;
-  border-radius: 4px;
-  color: #aaa;
-  font-size: 16px;
-}