# Order Confirmation Template

Tests the success page and order details after checkout.

## Prerequisites
- Completed order with ID `{{orderId}}`
- Authenticated session via `{{authStorageStatePath}}`
- App running at `{{baseUrl}}`

---

## TypeScript

```typescript
import { test, expect } from '@playwright/test';

test.describe('Order Confirmation', () => {
  test.use({ storageState: '{{authStorageStatePath}}' });

  // Happy path: confirmation page content
  test('shows order confirmation with correct details', async ({ page }) => {
    await page.goto('{{baseUrl}}/order-confirmation/{{orderId}}');
    await expect(page.getByRole('heading', { name: /order confirmed|thank you/i })).toBeVisible();
    await expect(page.getByText('{{orderId}}')).toBeVisible();
    await expect(page.getByText('{{productName}}')).toBeVisible();
    await expect(page.getByText('{{orderTotal}}')).toBeVisible();
  });

  // Happy path: confirmation email notice
  test('shows confirmation email notice', async ({ page }) => {
    await page.goto('{{baseUrl}}/order-confirmation/{{orderId}}');
    await expect(page.getByText(/confirmation.*sent to|email.*{{username}}/i)).toBeVisible();
  });

  // Happy path: billing and shipping details shown
  test('displays shipping address on confirmation page', async ({ page }) => {
    await page.goto('{{baseUrl}}/order-confirmation/{{orderId}}');
    await expect(page.getByText('{{shippingAddress}}')).toBeVisible();
    await expect(page.getByText('{{billingAddress}}')).toBeVisible();
  });

  // Happy path: CTA navigates to order history
  test('"view your orders" link navigates to order history', async ({ page }) => {
    await page.goto('{{baseUrl}}/order-confirmation/{{orderId}}');
    await page.getByRole('link', { name: /view.*orders|my orders/i }).click();
    await expect(page).toHaveURL('{{baseUrl}}/orders');
  });

  // Happy path: continue shopping CTA
  test('"continue shopping" returns to products', async ({ page }) => {
    await page.goto('{{baseUrl}}/order-confirmation/{{orderId}}');
    await page.getByRole('link', { name: /continue shopping/i }).click();
    await expect(page).toHaveURL('{{baseUrl}}/products');
  });

  // Error case: accessing another user's order shows 403
  test('cannot access another user\'s confirmation page', async ({ page }) => {
    await page.goto('{{baseUrl}}/order-confirmation/{{otherUsersOrderId}}');
    await expect(page).toHaveURL(/\/403|\/dashboard/);
  });

  // Edge case: cart is empty after successful checkout
  test('cart is empty after order confirmed', async ({ page }) => {
    await page.goto('{{baseUrl}}/order-confirmation/{{orderId}}');
    await expect(page.getByRole('status', { name: /cart/i })).toContainText('0');
  });
});
```

---

## JavaScript

```javascript
const { test, expect } = require('@playwright/test');

test.describe('Order Confirmation', () => {
  test.use({ storageState: '{{authStorageStatePath}}' });

  test('shows order id and total on confirmation', async ({ page }) => {
    await page.goto('{{baseUrl}}/order-confirmation/{{orderId}}');
    await expect(page.getByRole('heading', { name: /order confirmed|thank you/i })).toBeVisible();
    await expect(page.getByText('{{orderId}}')).toBeVisible();
    await expect(page.getByText('{{orderTotal}}')).toBeVisible();
  });

  test('cart is empty after checkout', async ({ page }) => {
    await page.goto('{{baseUrl}}/order-confirmation/{{orderId}}');
    await expect(page.getByRole('status', { name: /cart/i })).toContainText('0');
  });

  test('cannot access another user\'s order', async ({ page }) => {
    await page.goto('{{baseUrl}}/order-confirmation/{{otherUsersOrderId}}');
    await expect(page).toHaveURL(/\/403|\/dashboard/);
  });
});
```

## Variants
| Variant | Description |
|---------|-------------|
| Confirmation content | Order ID, product, total visible |
| Email notice | Confirmation email address shown |
| Shipping/billing | Addresses displayed |
| View orders CTA | Navigates to /orders |
| Continue shopping | Returns to /products |
| Unauthorized | Other user's order → 403 |
| Cart cleared | Cart count = 0 after checkout |
