Testing Microservices

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113

import { test, expect, Page } from "@playwright/test";
 
// Well-designed E2E test: Tests a complete user journey
test.describe("Checkout Journey", () => {
  let testUser: TestUser;
  let testProducts: TestProduct[];
  
  test.beforeAll(async () => {
    // Create isolated test data for this test suite
    testUser = await TestDataFactory.createUser({
      email: `checkout-test-${Date.now()}@test.com`,
      verified: true,
      paymentMethods: [{
        type: "card",
        last4: "4242",
        brand: "visa",
      }],
    });
    
    testProducts = await TestDataFactory.createProducts([
      { name: "Test Widget", price: 29.99, stock: 100 },
      { name: "Test Gadget", price: 49.99, stock: 50 },
    ]);
  });
  
  test.afterAll(async () => {
    // Clean up test data
    await TestDataFactory.cleanupUser(testUser.id);
    await TestDataFactory.cleanupProducts(testProducts.map(p => p.id));
  });
  
  test("complete checkout with saved payment method", async ({ page }) => {
    // ARRANGE: Login
    await loginAs(page, testUser);
    
    // ACT: Complete the shopping journey
    await page.goto("/products");
    await page.click(`[data-product-id="${testProducts[0].id}"]`);
    await page.click('[data-action="add-to-cart"]');
    
    await page.click('[data-action="view-cart"]');
    await expect(page.locator('[data-testid="cart-item"]')).toHaveCount(1);
    
    await page.click('[data-action="proceed-to-checkout"]');
    
    // Select saved payment method
    await page.click('[data-payment-method="card-4242"]');
    
    // Confirm order
    await page.click('[data-action="place-order"]');
    
    // ASSERT: Verify order confirmation
    await expect(page.locator('[data-testid="order-confirmation"]')).toBeVisible();
    await expect(page.locator('[data-testid="order-total"]')).toContainText("29.99");
    
    // Verify order appears in order history
    await page.goto("/orders");
    const latestOrder = page.locator('[data-testid="order-row"]').first();
    await expect(latestOrder).toContainText("29.99");
    await expect(latestOrder).toContainText("Processing");
    
    // Verify email was sent (via API or test mailbox)
    const confirmationEmail = await TestMailbox.waitForEmail({
      to: testUser.email,
      subject: /Order Confirmation/,
      timeout: 10000,
    });
    expect(confirmationEmail).toBeDefined();
  });
  
  test("checkout fails gracefully when payment is declined", async ({ page }) => {
    // Use a test card that will be declined
    const decliningUser = await TestDataFactory.createUser({
      paymentMethods: [{
        type: "card",
        last4: "0002", // Test card that declines
        brand: "visa",
      }],
    });
    
    await loginAs(page, decliningUser);
    
    // Add item and proceed to checkout
    await page.goto(`/products/${testProducts[0].id}`);
    await page.click('[data-action="add-to-cart"]');
    await page.click('[data-action="proceed-to-checkout"]');
    await page.click('[data-payment-method="card-0002"]');
    await page.click('[data-action="place-order"]');
    
    // ASSERT: Appropriate error handling
    await expect(page.locator('[data-testid="payment-error"]')).toBeVisible();
    await expect(page.locator('[data-testid="payment-error"]')).toContainText("declined");
    
    // Cart should be preserved
    await page.click('[data-action="view-cart"]');
    await expect(page.locator('[data-testid="cart-item"]')).toHaveCount(1);
    
    // No order should be created
    await page.goto("/orders");
    await expect(page.locator('[data-testid="order-row"]')).toHaveCount(0);
    
    await TestDataFactory.cleanupUser(decliningUser.id);
  });
});
 
// Helper functions for readable tests
async function loginAs(page: Page, user: TestUser): Promise<void> {
  await page.goto("/login");
  await page.fill('[data-testid="email-input"]', user.email);
  await page.fill('[data-testid="password-input"]', user.password);
  await page.click('[data-action="login"]');
  await expect(page.locator('[data-testid="user-menu"]')).toBeVisible();
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152

// Layer 1: Test Specifications (What to test)
// These are the actual test files - focused on user intent
// src/e2e/specs/checkout.spec.ts
 
test("user can complete purchase", async () => {
  const user = await users.createVerified();
  const product = await products.getAvailable();
  
  await checkoutFlow.addToCart(product);
  await checkoutFlow.proceedToCheckout();
  await checkoutFlow.completePayment(user.paymentMethod);
  
  await assertions.orderConfirmationDisplayed();
  await assertions.orderInHistory();
});
 
// Layer 2: Page Objects / Flow Objects (How to interact)
// Encapsulate page interactions - shield tests from UI changes
// src/e2e/flows/checkout-flow.ts
 
export class CheckoutFlow {
  constructor(private page: Page) {}
  
  async addToCart(product: Product): Promise<void> {
    await this.page.goto(`/products/${product.id}`);
    await this.page.click('[data-action="add-to-cart"]');
    await expect(
      this.page.locator('[data-testid="cart-added-notification"]')
    ).toBeVisible();
  }
  
  async proceedToCheckout(): Promise<void> {
    await this.page.click('[data-action="view-cart"]');
    await this.page.click('[data-action="proceed-to-checkout"]');
    await expect(this.page.locator('[data-testid="checkout-form"]')).toBeVisible();
  }
  
  async completePayment(method: PaymentMethod): Promise<void> {
    await this.page.click(`[data-payment-id="${method.id}"]`);
    await this.page.click('[data-action="place-order"]');
  }
}
 
// Layer 3: Test Data Factory (What data to use)
// Creates isolated, deterministic test data
// src/e2e/data/test-data-factory.ts
 
export class TestDataFactory {
  private readonly apiClient: AdminApiClient;
  private createdEntities: EntityReference[] = [];
  
  async createUser(overrides: Partial<UserData> = {}): Promise<TestUser> {
    const user = await this.apiClient.createUser({
      email: `test-${randomId()}@e2e-tests.local`,
      password: "TestPassword123!",
      verified: true,
      ...overrides,
    });
    
    this.createdEntities.push({ type: "user", id: user.id });
    return user;
  }
  
  async createProduct(overrides: Partial<ProductData> = {}): Promise<TestProduct> {
    const product = await this.apiClient.createProduct({
      name: `E2E Test Product ${randomId()}`,
      price: 29.99,
      stock: 100,
      ...overrides,
    });
    
    this.createdEntities.push({ type: "product", id: product.id });
    return product;
  }
  
  // Cleanup all entities created during test
  async cleanup(): Promise<void> {
    for (const entity of this.createdEntities.reverse()) {
      await this.apiClient.delete(entity.type, entity.id);
    }
    this.createdEntities = [];
  }
}
 
// Layer 4: Assertions (What to verify)
// Business-focused assertions with meaningful error messages
// src/e2e/assertions/order-assertions.ts
 
export class OrderAssertions {
  constructor(private page: Page) {}
  
  async orderConfirmationDisplayed(): Promise<void> {
    const confirmation = this.page.locator('[data-testid="order-confirmation"]');
    
    await expect(confirmation).toBeVisible({ timeout: 10000 });
    await expect(confirmation.locator('[data-testid="order-number"]')).not.toBeEmpty();
    await expect(confirmation.locator('[data-testid="estimated-delivery"]')).toBeVisible();
  }
  
  async orderInHistory(orderId?: string): Promise<void> {
    await this.page.goto("/orders");
    
    const orderRow = orderId 
      ? this.page.locator(`[data-order-id="${orderId}"]`)
      : this.page.locator('[data-testid="order-row"]').first();
    
    await expect(orderRow).toBeVisible();
    await expect(orderRow.locator('[data-testid="order-status"]')).toHaveText(/Processing|Confirmed/);
  }
}
 
// Layer 5: API Client (Backdoor operations)
// Direct API access for setup/teardown and assertions
// src/e2e/api/admin-api-client.ts
 
export class AdminApiClient {
  constructor(
    private baseUrl: string,
    private adminToken: string
  ) {}
  
  async createUser(data: CreateUserData): Promise<User> {
    const response = await fetch(`${this.baseUrl}/admin/users`, {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        "Authorization": `Bearer ${this.adminToken}`,
      },
      body: JSON.stringify(data),
    });
    
    if (!response.ok) {
      throw new Error(`Failed to create user: ${response.status}`);
    }
    
    return response.json();
  }
  
  async getOrderById(orderId: string): Promise<Order> {
    const response = await fetch(`${this.baseUrl}/admin/orders/${orderId}`, {
      headers: { "Authorization": `Bearer ${this.adminToken}` },
    });
    return response.json();
  }
  
  async delete(entityType: string, id: string): Promise<void> {
    await fetch(`${this.baseUrl}/admin/${entityType}/${id}`, {
      method: "DELETE",
      headers: { "Authorization": `Bearer ${this.adminToken}` },
    });
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114

# Docker Compose for local E2E testing
# docker-compose.e2e.yml
version: '3.8'
 
services:
  # API Gateway - entry point
  gateway:
    image: traefik:v2.10
    ports:
      - "80:80"
    volumes:
      - ./traefik.yml:/etc/traefik/traefik.yml
    depends_on:
      - order-service
      - user-service
      - product-service
  
  # Microservices
  order-service:
    build:
      context: ./services/order
      dockerfile: Dockerfile
    environment:
      - DATABASE_URL=postgresql://postgres:postgres@order-db:5432/orders
      - KAFKA_BROKERS=kafka:9092
      - USER_SERVICE_URL=http://user-service:3000
      - PRODUCT_SERVICE_URL=http://product-service:3000
    depends_on:
      - order-db
      - kafka
  
  user-service:
    build:
      context: ./services/user
      dockerfile: Dockerfile
    environment:
      - DATABASE_URL=postgresql://postgres:postgres@user-db:5432/users
      - REDIS_URL=redis://redis:6379
    depends_on:
      - user-db
      - redis
  
  product-service:
    build:
      context: ./services/product
      dockerfile: Dockerfile
    environment:
      - DATABASE_URL=postgresql://postgres:postgres@product-db:5432/products
      - ELASTICSEARCH_URL=http://elasticsearch:9200
    depends_on:
      - product-db
      - elasticsearch
  
  # Databases - each service has its own
  order-db:
    image: postgres:15
    environment:
      POSTGRES_DB: orders
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: postgres
  
  user-db:
    image: postgres:15
    environment:
      POSTGRES_DB: users
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: postgres
  
  product-db:
    image: postgres:15
    environment:
      POSTGRES_DB: products
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: postgres
  
  # Infrastructure
  kafka:
    image: confluentinc/cp-kafka:7.4.0
    environment:
      KAFKA_NODE_ID: 1
      KAFKA_LISTENER_SECURITY_PROTOCOL_MAP: CONTROLLER:PLAINTEXT,PLAINTEXT:PLAINTEXT
      KAFKA_LISTENERS: PLAINTEXT://0.0.0.0:9092,CONTROLLER://0.0.0.0:9093
      KAFKA_ADVERTISED_LISTENERS: PLAINTEXT://kafka:9092
      KAFKA_PROCESS_ROLES: broker,controller
      KAFKA_CONTROLLER_QUORUM_VOTERS: 1@kafka:9093
      KAFKA_CONTROLLER_LISTENER_NAMES: CONTROLLER
      CLUSTER_ID: 'ciWo7IWazngRchmPES6q5A=='
      KAFKA_AUTO_CREATE_TOPICS_ENABLE: 'true'
  
  redis:
    image: redis:7-alpine
  
  elasticsearch:
    image: docker.elastic.co/elasticsearch/elasticsearch:8.9.0
    environment:
      - discovery.type=single-node
      - xpack.security.enabled=false
 
# Health check and wait script
# scripts/wait-for-services.sh
#!/bin/bash
echo "Waiting for services to be healthy..."
 
services=("http://localhost/health" "http://order-service:3000/health" "http://user-service:3000/health")
 
for service in "${services[@]}"; do
  until curl -sf "$service" > /dev/null 2>&1; do
    echo "Waiting for $service..."
    sleep 2
  done
  echo "$service is ready"
done
 
echo "All services are healthy!"

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133

// BAD: Using arbitrary sleeps
test("order is processed", async ({ page }) => {
  await page.click('[data-action="place-order"]');
  await page.waitForTimeout(10000); // ❌ Fragile, slow, unreliable
  await expect(page.locator('[data-testid="order-status"]')).toHaveText("Confirmed");
});
 
// GOOD: Polling with smart waiting
test("order is processed", async ({ page }) => {
  await page.click('[data-action="place-order"]');
  
  // Wait for initial acknowledgment (synchronous)
  await expect(page.locator('[data-testid="order-received"]')).toBeVisible();
  
  // Extract order ID for polling
  const orderId = await page.locator('[data-testid="order-id"]').textContent();
  
  // Poll for final status via API (faster than UI polling)
  await waitForCondition(async () => {
    const order = await adminApi.getOrder(orderId!);
    return order.status === "CONFIRMED";
  }, {
    timeout: 30000,
    interval: 1000,
    message: `Order ${orderId} did not reach CONFIRMED status`,
  });
  
  // Verify UI reflects final state
  await page.reload();
  await expect(page.locator('[data-testid="order-status"]')).toHaveText("Confirmed");
});
 
// Reusable polling utility
async function waitForCondition(
  condition: () => Promise<boolean>,
  options: {
    timeout: number;
    interval: number;
    message?: string;
  }
): Promise<void> {
  const startTime = Date.now();
  
  while (Date.now() - startTime < options.timeout) {
    try {
      if (await condition()) {
        return;
      }
    } catch (error) {
      // Condition threw - keep polling
    }
    
    await new Promise(resolve => setTimeout(resolve, options.interval));
  }
  
  throw new Error(options.message || "Condition not met within timeout");
}
 
// Testing webhook/callback flows
test("payment webhook updates order status", async ({ page }) => {
  // Setup: Create order via UI
  await createOrderViaUI(page);
  const orderId = await getCreatedOrderId(page);
  
  // Action: Simulate webhook from payment provider
  await simulatePaymentWebhook({
    orderId,
    event: "payment.succeeded",
    amount: 2999,
  });
  
  // Assert: Order status updated
  await waitForCondition(async () => {
    const order = await adminApi.getOrder(orderId);
    return order.status === "PAID";
  }, { timeout: 10000, interval: 500 });
  
  // Verify user-facing update
  await page.goto(`/orders/${orderId}`);
  await expect(page.locator('[data-testid="payment-status"]')).toHaveText("Paid");
});
 
// Testing email/notification flows
test("user receives confirmation email", async ({ page }) => {
  const user = await testData.createUserWithEmail("confirm-test@mailtest.local");
  
  await loginAs(page, user);
  await completeCheckoutFlow(page);
  
  // Wait for email via test mailbox API
  const email = await testMailbox.waitForEmail({
    to: user.email,
    subjectContains: "Order Confirmation",
    timeout: 30000,
  });
  
  expect(email).toBeDefined();
  expect(email.body).toContain("Thank you for your order");
  expect(email.body).toContain("Order #");
});
 
// Test mailbox helper
class TestMailbox {
  constructor(private apiUrl: string) {}
  
  async waitForEmail(criteria: {
    to: string;
    subjectContains?: string;
    timeout: number;
  }): Promise<Email | undefined> {
    return waitForCondition(
      async () => {
        const emails = await this.getEmails(criteria.to);
        const match = emails.find(e => 
          !criteria.subjectContains || 
          e.subject.includes(criteria.subjectContains)
        );
        return match !== undefined;
      },
      { timeout: criteria.timeout, interval: 1000 }
    ).then(() => this.getEmails(criteria.to).then(e => 
      e.find(email => 
        !criteria.subjectContains || 
        email.subject.includes(criteria.subjectContains)
      )
    ));
  }
  
  private async getEmails(address: string): Promise<Email[]> {
    const response = await fetch(`${this.apiUrl}/messages?to=${address}`);
    return response.json();
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122

// Pattern 1: Explicit waits for elements to be ready
async function clickWhenReady(page: Page, selector: string): Promise<void> {
  const element = page.locator(selector);
  
  // Wait for element to be visible
  await element.waitFor({ state: "visible" });
  
  // Wait for element to be enabled
  await expect(element).toBeEnabled();
  
  // Wait for any animations to complete
  await page.waitForTimeout(100); // Small buffer for animations
  
  // Scroll into view if needed
  await element.scrollIntoViewIfNeeded();
  
  // Click with force if standard click fails (covered element)
  try {
    await element.click({ timeout: 5000 });
  } catch (error) {
    await element.click({ force: true });
  }
}
 
// Pattern 2: Retry wrapper for flaky operations
async function withRetry<T>(
  operation: () => Promise<T>,
  options: { maxAttempts: number; delay: number } = { maxAttempts: 3, delay: 1000 }
): Promise<T> {
  let lastError: Error | undefined;
  
  for (let attempt = 1; attempt <= options.maxAttempts; attempt++) {
    try {
      return await operation();
    } catch (error) {
      lastError = error as Error;
      console.log(`Attempt ${attempt} failed: ${lastError.message}`);
      
      if (attempt < options.maxAttempts) {
        await new Promise(resolve => setTimeout(resolve, options.delay));
      }
    }
  }
  
  throw lastError;
}
 
// Pattern 3: Disable animations in test environment
// In your app's CSS or global test setup
`
/* test-environment.css */
*, *::before, *::after {
  animation-duration: 0.01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.01ms !important;
}
`
 
// Or in Playwright config
use: {
  // Launch browser with reduced motion
  contextOptions: {
    reducedMotion: "reduce",
  },
}
 
// Pattern 4: Isolate test data with unique identifiers
function createTestData(): TestOrder {
  const uniqueId = `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
  
  return {
    customerEmail: `e2e-test-${uniqueId}@test.local`,
    externalReference: `E2E-${uniqueId}`,
    // Data that can be uniquely identified and cleaned up
  };
}
 
// Pattern 5: Clean browser state between tests
test.beforeEach(async ({ page, context }) => {
  // Clear cookies
  await context.clearCookies();
  
  // Clear localStorage and sessionStorage
  await page.evaluate(() => {
    localStorage.clear();
    sessionStorage.clear();
  });
  
  // Clear IndexedDB if used
  await page.evaluate(async () => {
    const databases = await indexedDB.databases();
    for (const db of databases) {
      indexedDB.deleteDatabase(db.name!);
    }
  });
});
 
// Pattern 6: Mock external services
test.beforeAll(async () => {
  // Intercept calls to external payment provider
  await page.route("**/api.stripe.com/**", async (route) => {
    if (route.request().url().includes("payment_intents")) {
      await route.fulfill({
        status: 200,
        contentType: "application/json",
        body: JSON.stringify({
          id: "pi_mock_123",
          status: "succeeded",
          amount: 2999,
        }),
      });
    }
  });
});
 
// Pattern 7: Use test IDs instead of fragile selectors
// Instead of:
await page.click(".btn.btn-primary.checkout"); // ❌ Fragile
await page.click("text=Complete Purchase"); // ❌ Changes with UX copy
 
// Use:
await page.click('[data-testid="checkout-submit"]'); // ✅ Stable

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162

# GitHub Actions: Tiered E2E testing strategy
name: E2E Tests
 
on:
  push:
    branches: [main]
  pull_request:
    branches: [main]
  # Scheduled full E2E suite
  schedule:
    - cron: '0 */4 * * *'  # Every 4 hours
 
jobs:
  # Fast smoke tests on every PR
  smoke-tests:
    if: github.event_name == 'pull_request'
    runs-on: ubuntu-latest
    timeout-minutes: 15
    
    steps:
      - uses: actions/checkout@v4
      
      - name: Setup Node
        uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      
      - name: Install dependencies
        run: npm ci
      
      - name: Start services (lightweight)
        run: |
          docker compose -f docker-compose.e2e-light.yml up -d
          npm run wait-for-services
      
      - name: Run smoke tests
        run: npx playwright test --project=chromium --grep @smoke
        env:
          E2E_BASE_URL: http://localhost
      
      - name: Upload failure artifacts
        if: failure()
        uses: actions/upload-artifact@v4
        with:
          name: smoke-test-failures
          path: |
            test-results/
            playwright-report/
  
  # Full E2E suite on main branch
  full-e2e:
    if: github.event_name == 'push' && github.ref == 'refs/heads/main'
    runs-on: ubuntu-latest
    timeout-minutes: 45
    
    strategy:
      fail-fast: false
      matrix:
        shard: [1, 2, 3, 4]  # Parallel test shards
    
    steps:
      - uses: actions/checkout@v4
      
      - name: Setup Node
        uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      
      - name: Install dependencies
        run: npm ci
      
      - name: Install Playwright browsers
        run: npx playwright install --with-deps
      
      - name: Start full environment
        run: |
          docker compose -f docker-compose.e2e.yml up -d
          npm run wait-for-services
          npm run db:migrate:e2e
          npm run db:seed:e2e
      
      - name: Run E2E tests (shard)
        run: |
          npx playwright test --shard=${{ matrix.shard }}/4
        env:
          E2E_BASE_URL: http://localhost
          CI: true
      
      - name: Upload test results
        uses: actions/upload-artifact@v4
        if: always()
        with:
          name: e2e-results-shard-${{ matrix.shard }}
          path: |
            test-results/
            playwright-report/
  
  # Merge sharded reports
  merge-reports:
    needs: full-e2e
    if: always()
    runs-on: ubuntu-latest
    
    steps:
      - uses: actions/checkout@v4
      
      - name: Download all artifacts
        uses: actions/download-artifact@v4
        with:
          pattern: e2e-results-shard-*
          merge-multiple: true
      
      - name: Merge Playwright reports
        run: npx playwright merge-reports --reporter=html ./e2e-results-*
      
      - name: Publish report
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: ./playwright-report
          destination_dir: e2e-report
  
  # Nightly comprehensive tests (all browsers, edge cases)
  nightly:
    if: github.event_name == 'schedule'
    runs-on: ubuntu-latest
    timeout-minutes: 120
    
    steps:
      - uses: actions/checkout@v4
      
      - name: Setup environment
        run: |
          npm ci
          npx playwright install --with-deps
          docker compose -f docker-compose.e2e.yml up -d
          npm run wait-for-services
      
      - name: Run all tests on all browsers
        run: |
          npx playwright test --project=chromium
          npx playwright test --project=firefox
          npx playwright test --project=webkit
          npx playwright test --project=mobile-chrome
      
      - name: Notify on failure
        if: failure()
        uses: slackapi/slack-github-action@v1
        with:
          payload: |
            {
              "text": "Nightly E2E tests failed!",
              "blocks": [{
                "type": "section",
                "text": {
                  "type": "mrkdwn",
                  "text": ":x: Nightly E2E tests failed. <${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}|View run>"
                }
              }]
            }