@athenaflow/plugin-e2e-test-builder 2.0.9

package/skills/write-test-code/references/auth-patterns.md

@@ -0,0 +1,63 @@
+# Authentication Setup Patterns
+
+Choose the right auth strategy based on the project's needs.
+
+## Strategy 1: storageState (Recommended for most projects)
+
+Log in once in global setup, save cookies/localStorage to a JSON file, and reuse across all tests:
+
+```typescript
+// global-setup.ts
+import { chromium, FullConfig } from '@playwright/test';
+
+async function globalSetup(config: FullConfig) {
+  const browser = await chromium.launch();
+  const page = await browser.newPage();
+  await page.goto('/login');
+  await page.getByLabel(/email/i).fill(process.env.TEST_USER_EMAIL!);
+  await page.getByLabel(/password/i).fill(process.env.TEST_USER_PASSWORD!);
+  await page.getByRole('button', { name: /sign in/i }).click();
+  await page.waitForURL('/dashboard');
+  await page.context().storageState({ path: 'tests/.auth/user.json' });
+  await browser.close();
+}
+export default globalSetup;
+```
+
+Reference in config: `use: { storageState: 'tests/.auth/user.json' }`
+
+## Strategy 2: Worker-scoped fixture (for parallel workers needing separate accounts)
+
+```typescript
+export const test = base.extend<{}, { workerStorageState: string }>({
+  storageState: ({ workerStorageState }, use) => use(workerStorageState),
+  workerStorageState: [async ({ browser }, use, testInfo) => {
+    const page = await browser.newPage({ storageState: undefined });
+    // Login with worker-specific account...
+    const path = `tests/.auth/worker-${testInfo.parallelIndex}.json`;
+    await page.context().storageState({ path });
+    await use(path);
+    await page.close();
+  }, { scope: 'worker' }],
+});
+```
+
+## Strategy 3: Multi-role testing (admin + user in same test)
+
+```typescript
+test('TC-ADMIN-001: Admin sees user profile', async ({ browser }) => {
+  const adminContext = await browser.newContext({ storageState: 'tests/.auth/admin.json' });
+  const userContext = await browser.newContext({ storageState: 'tests/.auth/user.json' });
+  const adminPage = await adminContext.newPage();
+  const userPage = await userContext.newPage();
+  // Interact with both pages...
+  await adminContext.close();
+  await userContext.close();
+});
+```
+
+## Strategy 4: Per-test login
+
+Only when testing login itself or permission-specific scenarios.
+
+Never hardcode tokens. Use environment variables or `.env.test`.

package/skills/write-test-code/references/mapping-tables.md

@@ -0,0 +1,56 @@
+# Mapping Tables
+
+Standard translations for converting journey specs and exploration results to Playwright API calls.
+
+## Scope-to-Locator
+
+| Journey Scope | Playwright Scoping |
+|---------------|-------------------|
+| `page` | No scoping needed |
+| `header` | `page.locator('header')` |
+| `main` | `page.locator('main')` |
+| `nav` | `page.locator('nav')` |
+| `dialog` | `page.locator('[role="dialog"]')` |
+
+## Action-to-Playwright
+
+| Journey Action | Playwright Code |
+|----------------|-----------------|
+| `goto` | `await page.goto(url)` |
+| `click` | `await locator.click()` |
+| `fill` | `await locator.fill(value)` |
+| `select` | `await locator.selectOption(value)` |
+| `assert` | `await expect(locator).toBeVisible()` |
+
+## Assertion Mapping
+
+| Observed Effect | Playwright Assertion |
+|----------------|---------------------|
+| `url changed to /cart` | `await expect(page).toHaveURL(/cart/)` |
+| `text 'Added' visible` | `await expect(page.getByText(/added/i)).toBeVisible()` |
+| `radio 256GB checked` | `await expect(locator).toBeChecked()` |
+| `button now enabled` | `await expect(locator).toBeEnabled()` |
+
+## Target Kind to Locator
+
+| Target Kind | Value Pattern | Playwright Locator |
+|-------------|--------------|-------------------|
+| `role` | `button name~Add to Bag` | `getByRole('button', { name: /add to bag/i })` |
+| `role` | `radio name~256GB` | `getByRole('radio', { name: /256gb/i })` |
+| `label` | `Email address` | `getByLabel(/email address/i)` |
+| `testid` | `checkout-button` | `getByTestId('checkout-button')` |
+
+## Low Confidence Handling (<0.7)
+
+When journey step confidence is low:
+1. Add extra assertions to verify state
+2. Include fallback locators as comments
+3. Consider retry logic for flaky interactions
+
+```typescript
+// Primary locator
+const storageRadio = page.getByRole('radio', { name: /256gb/i });
+// Fallback: page.getByLabel(/256gb/i)
+await storageRadio.click();
+await expect(storageRadio).toBeChecked({ timeout: 5000 });
+```

package/skills/write-test-code/references/network-interception.md

@@ -0,0 +1,56 @@
+# Network Interception and Error Path Testing
+
+## Network Interception
+
+Use `page.route()` to intercept and mock network requests for deterministic error testing.
+
+**Mock server errors:**
+```typescript
+await page.route('**/api/checkout', route =>
+  route.fulfill({ status: 500, body: JSON.stringify({ error: 'Payment declined' }) })
+);
+```
+
+**Patch real responses (modify, don't replace):**
+```typescript
+await page.route('**/api/products', async route => {
+  const response = await route.fetch();
+  const json = await response.json();
+  json.results = json.results.slice(0, 1); // reduce to 1 item
+  await route.fulfill({ response, json });
+});
+```
+
+**Assert backend was called:**
+```typescript
+const [response] = await Promise.all([
+  page.waitForResponse(resp =>
+    resp.url().includes('/api/order') && resp.status() === 201
+  ),
+  page.getByRole('button', { name: /place order/i }).click(),
+]);
+expect(response.status()).toBe(201);
+```
+
+**Block heavy resources to speed up tests:**
+```typescript
+await page.route('**/*.{png,jpg,jpeg,gif,svg}', route => route.abort());
+```
+
+## Error Path Testing
+
+Every feature needs error path tests. Use network interception (see above) to simulate failures. At minimum, every feature test suite should cover:
+
+- **Server error** — `route.fulfill({ status: 500, ... })` — verify error UI appears
+- **Network timeout** — `route.abort('timedout')` — verify retry option or error message
+- **Empty state** — `route.fulfill({ status: 200, json: { items: [] } })` — verify empty state UI
+
+```typescript
+test('TC-DASHBOARD-005: Shows empty state when no data', async ({ page }) => {
+  await page.route('**/api/items', route =>
+    route.fulfill({ status: 200, json: { items: [] } })
+  );
+  await page.goto('/dashboard');
+  await expect(page.getByText(/no items/i)).toBeVisible();
+});
+```