code-ai-installer 1.2.0 → 1.3.0

package/locales/en/.agents/qa_e2e_playwright/SKILL.md

@@ -1,116 +1,313 @@
----
-name: qa_e2e_playwright
-description: Playwright-based E2E testing for CI/CD — automated spec files, page objects, visual regression, and pipeline integration. For manual testing inside Antigravity use $qa_browser_testing.
-last_verified: 2026-03-11
-version: 2.0
----
-
-# Skill: E2E Playwright (CI/CD Automated)
-
-## Purpose
-Automated E2E regression suite using **Playwright** for the CI/CD pipeline.
-Page Objects, spec files, visual snapshot comparison, and GitHub Actions integration.
-
-> [!IMPORTANT]
-> This skill is for automated CI/CD tests.
-> For interactive testing inside Google Antigravity use `$qa_browser_testing`.
-
-## When to use
-- The project is mature enough for an E2E gate in CI/CD
-- You need automated regression on each PR or deploy
-- You need visual regression with baseline screenshots in CI
-- The UI is stable enough to avoid chronic flakiness
-
-## When not to use
-- Interactive testing inside Antigravity -> `$qa_browser_testing`
-- Wix/Shopify sandbox flows unavailable in CI -> `$qa_browser_testing`
-- Unit/integration testing -> Vitest
-- First unstable slice of UI -> tests will be flaky
-
-## Project stack (SCR)
-| Component | Technology | Location |
-|-----------|-----------|----------|
-| Unit/Integration | **Vitest** | `apps/*/vitest.config.js` |
-| E2E | **Playwright** | `apps/dashboard/e2e/` |
-| Wix Test Utils | `@wix/wix-ui-test-utils` | node_modules |
-| Wix UniDriver | `@wix/unidriver-playwright` | node_modules |
-
-## Setup
-1. Install:
-```bash
-cd apps/dashboard
-npm init playwright@latest -- --yes --browser=chromium --lang=js
-```
-2. Add `playwright.config.js` with trace/screenshot/video in CI.
-3. Create `fixtures/`, `pages/`, `specs/`, and `screenshots/expected/` inside `apps/dashboard/e2e/`.
-
-## Page Object Model
-Use page objects for key pages and keep selectors stable.
-Prefer `data-testid` over fragile CSS selectors.
-
-## Test patterns
-- Happy path: critical flow succeeds end to end
-- Error path: validation and failure states are asserted
-- UI state coverage: loading / empty / error / success
-- Visual regression: compare key components with approved baselines
-
-Example visual assertion:
-```js
-await expect(page.locator('[data-testid="popup-container"]')).toHaveScreenshot('glassmorphism-popup.png', {
-  maxDiffPixelRatio: 0.05,
-  threshold: 0.2,
-});
-```
-
-## Run commands
-```bash
-npx playwright test
-npx playwright test e2e/specs/widget-design.spec.js
-npx playwright test --ui
-npx playwright test --headed
-npx playwright test --update-snapshots
-npx playwright show-report
-```
-
-## CI/CD pipeline
-```yaml
-# .github/workflows/e2e.yml
-e2e-tests:
-  runs-on: ubuntu-latest
-  steps:
-    - uses: actions/checkout@v4
-    - uses: actions/setup-node@v4
-      with: { node-version: 20 }
-    - run: npm ci
-      working-directory: apps/dashboard
-    - run: npx playwright install --with-deps chromium
-      working-directory: apps/dashboard
-    - run: npx playwright test
-      working-directory: apps/dashboard
-```
-
-## Anti-patterns
-- CSS selectors instead of `data-testid`
-- `page.waitForTimeout(...)` instead of proper waits
-- E2E for logic already covered by unit tests
-- Shared state between tests
-- Hard-coded data inside specs
-- Ignoring flaky tests instead of stabilizing or removing them
-- Full-page screenshots when component-level snapshots are enough
-
-## Definition of Done
-- [ ] Critical flows from Test Plan are covered
-- [ ] Each test has a happy path and at least one error path
-- [ ] Page Objects exist for key pages
-- [ ] `data-testid` is added for interactive elements
-- [ ] Baseline screenshots are approved
-- [ ] No flaky failures across 3 consecutive runs
-- [ ] CI pipeline is configured
-- [ ] Run command is documented in README
-
-## Deliverables
-- Spec files in `apps/dashboard/e2e/specs/`
-- Page Objects in `apps/dashboard/e2e/pages/`
-- `playwright.config.js`
-- CI/CD pipeline config
-- Requested `data-testid` inventory for DEV
+---
+name: qa_e2e_playwright
+description: Playwright-based E2E testing for CI/CD — automated spec files, page objects, visual regression, and pipeline integration. For manual testing inside Antigravity use $qa_browser_testing.
+last_verified: 2026-03-11
+version: 2.0
+---
+
+# Skill: E2E Playwright (CI/CD Automated)
+
+## Purpose
+
+Page Objects, spec files, visual snapshot comparison, and GitHub Actions integration.
+Page Objects, spec-files, visual snapshot comparison, GitHub Actions.
+
+> [!IMPORTANT]
+> For interactive testing inside Google Antigravity use `$qa_browser_testing`.
+> For interactive testing in Google Antigravity → `$qa_browser_testing`.
+
+---
+
+## When to use
+
+- The project has grown to a CI/CD pipeline with an E2E gate
+## When not to use
+- Interactive testing inside Antigravity -> `$qa_browser_testing`
+- Wix/Shopify sandbox flows unavailable in CI -> `$qa_browser_testing`
+
+- First unstable slice of UI -> tests will be flaky
+
+- Testing inside Antigravity → `$qa_browser_testing`
+- Wix/Shopify sandbox (no access from CI) → `$qa_browser_testing`
+- Unit/integration → Vitest
+| Unit/Integration | **Vitest** | `apps/*/vitest.config.js` |
+
+---
+
+## Stack project (SCR)
+
+1. Install:
+|-----------|-----------|-------------|
+| Unit/Integration | **Vitest** | `apps/*/vitest.config.js` |
+| E2E | **Playwright** | `apps/dashboard/e2e/` (create) |
+| Wix Test Utils | `@wix/wix-ui-test-utils` | In node_modules |
+| Wix UniDriver | `@wix/unidriver-playwright` | In node_modules |
+
+---
+
+## Setup
+
+### 1. Setup
+
+```bash
+cd apps/dashboard
+npm init playwright@latest -- --yes --browser=chromium --lang=js
+```
+
+### 2. Configuration: `playwright.config.js`
+
+```js
+// apps/dashboard/playwright.config.js
+import { defineConfig, devices } from '@playwright/test';
+
+export default defineConfig({
+  testDir: './e2e',
+  timeout: 30_000,
+  expect: { timeout: 5_000 },
+  fullyParallel: false,
+  retries: process.env.CI ? 2 : 0,
+  workers: 1,
+  reporter: [['html', { open: 'never' }], ['list']],
+
+  use: {
+    baseURL: process.env.BASE_URL || 'https://manage.wix.com',
+    trace: 'on-first-retry',
+    screenshot: 'only-on-failure',
+    video: 'on-first-retry',
+  },
+
+  projects: [
+    {
+      name: 'wix-dashboard',
+      use: { ...devices['Desktop Chrome'] },
+    },
+  ],
+});
+```
+
+- run: npx playwright test
+
+```
+apps/dashboard/e2e/
+├── fixtures/
+│   ├── auth.fixture.js      # Auth (storageState)
+- `page.waitForTimeout(...)` instead of proper waits
+├── pages/
+│   ├── BasePage.js            # Base page object
+│   ├── WidgetDesignPage.js    # Widget Design Editor
+│   ├── RulesTriggersPage.js   # Rules & Triggers
+│   └── CouponsPage.js         # Coupons Management
+├── specs/
+│   ├── widget-design.spec.js  # Widget editor E2E
+│   ├── coupon-flow.spec.js    # Coupon CRUD
+│   └── visual-parity.spec.js  # Screenshot comparison
+└── screenshots/
+    - [ ] `data-testid` is added for interactive elements
+```
+
+---
+
+## Page Object Model
+
+### BasePage
+
+```js
+/**
+ - Requested `data-testid` inventory for DEV
+ */
+export class BasePage {
+  /**
+   * @param {import('@playwright/test').Page} page - Playwright page instance.
+   */
+  constructor(page) {
+    this.page = page;
+  }
+
+  /**
+   * Waits for page load.
+   * @param {string} contentSelector - CSS-selector main content.
+   * @param {number} [timeout=10000] - wait timeout in ms.
+   */
+  async waitForPageLoad(contentSelector, timeout = 10_000) {
+    await this.page.waitForSelector(contentSelector, {
+      state: 'visible',
+      timeout,
+    });
+  }
+
+  /**
+   * Does screenshot component for visual parity.
+   * @param {string} name - name screenshot.
+   * @returns {Promise<Buffer>} screenshot.
+   */
+  async takeScreenshot(name) {
+    return this.page.screenshot({
+      path: `e2e/screenshots/actual/${name}.png`,
+      fullPage: true,
+    });
+  }
+}
+```
+
+---
+
+## Test patterns
+
+### Happy Path
+
+```js
+import { test, expect } from '@playwright/test';
+import { WidgetDesignPage } from '../pages/WidgetDesignPage.js';
+
+test.describe('Widget Design Editor', () => {
+  test('should select template and save', async ({ page }) => {
+    const editor = new WidgetDesignPage(page);
+    await editor.waitForPageLoad('[data-testid="widget-editor"]');
+    await editor.selectTemplate('Glassmorphism');
+    await editor.fillFields({ headline: 'Special Offer!', coupon: 'SAVE20' });
+    await editor.save();
+
+    await expect(editor.livePreview).toContainText('Special Offer!');
+  });
+});
+```
+
+### Error Path
+
+```js
+test('should show validation error for empty coupon', async ({ page }) => {
+  const editor = new WidgetDesignPage(page);
+  await editor.waitForPageLoad('[data-testid="widget-editor"]');
+  await editor.fillFields({ coupon: '' });
+  await editor.save();
+
+  const error = page.locator('[data-testid="coupon-error"]');
+  await expect(error).toBeVisible();
+});
+```
+
+### UI States
+
+```js
+test('should show empty state when no templates', async ({ page }) => {
+  await page.route('**/api/templates', (route) =>
+    route.fulfill({ status: 200, body: '[]', headers: { 'Content-Type': 'application/json' } }),
+  );
+  await page.reload();
+  await expect(page.locator('[data-testid="empty-state"]')).toContainText('No templates');
+});
+```
+
+---
+
+## Visual Regression
+
+> [!IMPORTANT]
+> **Source of truth is determined UX Designer** (mandatory question #2).
+> Baseline-screenshots depend from the selected source.
+
+```js
+test('visual parity: popup matches design', async ({ page }) => {
+  await page.goto('/preview/glassmorphism');
+  const popup = page.locator('[data-testid="popup-container"]');
+  await expect(popup).toHaveScreenshot('glassmorphism-popup.png', {
+    maxDiffPixelRatio: 0.05,
+    threshold: 0.2,
+  });
+});
+```
+
+```bash
+# Update baseline
+npx playwright test --update-snapshots
+```
+
+---
+
+## Naming Convention
+
+```
+[feature].spec.js             — tests
+[feature].visual.spec.js      — visual regression
+[PageName].js                  — page objects
+
+# Test IDs (data-testid)
+[component]-[element]          → popup-container
+[component]-[element]-[state]  → save-button-disabled
+```
+
+> [!WARNING]
+> DEV must add `data-testid` for all interactive elements.
+
+---
+
+## Run
+
+```bash
+npx playwright test                              # All
+npx playwright test e2e/specs/widget-design.spec.js  # One spec
+npx playwright test --ui                         # Debug UI
+npx playwright test --headed                     # Headed
+npx playwright test --update-snapshots           # Update baseline
+npx playwright show-report                       # Report
+```
+
+---
+
+## CI/CD Pipeline
+
+```yaml
+# .github/workflows/e2e.yml
+e2e-tests:
+  runs-on: ubuntu-latest
+  steps:
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
+      with: { node-version: 20 }
+    - run: npm ci
+      working-directory: apps/dashboard
+    - run: npx playwright install --with-deps chromium
+      working-directory: apps/dashboard
+    - run: npx playwright test
+      working-directory: apps/dashboard
+    - uses: actions/upload-artifact@v4
+      if: failure()
+      with:
+        name: playwright-report
+        path: apps/dashboard/playwright-report/
+```
+
+---
+
+## Anti-patterns
+
+- ❌ CSS-selectors (`.class-name`) — fragile, only `data-testid`
+- ❌ `page.waitForTimeout(3000)` — use `waitForSelector`
+- ❌ E2E for logic, coverage unit-tests — excessive
+- ❌ Dependency tests each from other — each test isolated
+- ❌ Hard-coded data in specs — extract in `fixtures/test-data.js`
+- ❌ Ignore flaky — stabilize or delete
+- ❌ Screenshot entire pages — take screenshots of the **specific component**
+
+---
+
+## Definition of Done
+
+- [ ] Critical flows from Test Plan covered E2E
+- [ ] Each test: happy path + ≥1 error path
+- [ ] Page Objects for key pages
+- [ ] `data-testid` add (DEV)
+- [ ] Baseline-screenshots agreed
+- [ ] No flaky (3 run stably)
+- [ ] CI pipeline configured
+- [ ] Team startup in README
+
+---
+
+## Deliverables
+
+- Spec-files: `apps/dashboard/e2e/specs/`
+- Page Objects: `apps/dashboard/e2e/pages/`
+- `playwright.config.js`
+- CI/CD pipeline config
+- List `data-testid` (request to DEV)

package/locales/en/.agents/qa_manual_run/SKILL.md

@@ -1,16 +1,209 @@
 ---
 name: qa_manual_run
-description: Manual running of critical scenarios and regression: happy/edge/error paths according to UX Spec; fixing bugs with steps and evidence.
+description: Manually run critical scenarios and regression ? happy/edge/error paths from the UX Spec; record bugs with steps and evidence.
 ---
 
 # Skill: QA Manual Run
 
-## What to check
-- Critical flows (login/main CRUD/purchase/search, etc. if available)
-- UI states: loading/empty/error/success
-- Roles/permissions (403/hiding functions + server-side bans)
-- Regression on previously closed bugs
+Manual run test cases with documenting results.
 
-## Exit
-- PASS/FAIL/BLOCKED list
-- Bug reports
+**Sections:**
+1. [Workflow](#1-workflow)
+2. [Test Case Template](#2-test-case)
+3. [Bug Report Template](#3-bug-report)
+4. [Evidence Requirements](#4-evidence)
+5. [Output Template](#5-output)
+
+---
+
+## 1. Workflow
+
+```
+1. Preparation
+   ├── Read Test Plan (from $qa_test_plan)
+   ├── Check entry criteria (CI green, env up, data seeded)
+   └── Prepare test data / fixtures
+
+2. Run
+   ├── Go through each test case by priority (P0 → P1 → P2)
+   ├── For each: execution steps, check expected result
+   ├── Record: PASS / FAIL / BLOCKED / SKIPPED
+   └── For FAIL → create bug report (section 3)
+
+3. Regression
+   └── Rerun previously closed bugs (check that the fix did not break anything)
+
+4. Report
+   └── Fill in output template (section 5)
+```
+
+---
+
+## 2. Test Case Template
+
+### Format one test case
+
+```markdown
+### TC-SETTINGS-01: Update popup title
+
+**Priority:** P0
+**Type:** Happy path
+**Preconditions:**
+- User logged in to dashboard
+- App installed on test site
+
+**Steps:**
+1. Open Settings → General tab
+2. Change title to "New Sale!"
+3. Click "Save"
+4. Open Live Preview
+
+**Expected Result:**
+- Toast "Settings saved" appears
+- Live Preview shows "New Sale!" as popup title
+- API returns 200 with updated settings
+
+**Actual Result:** _<fill during run>_
+**Status:** PASS / FAIL / BLOCKED / SKIPPED
+**Evidence:** _<screenshot or link>_
+**Notes:** _<any observations>_
+```
+
+### What to test per category
+
+| Category | What to verify | Examples |
+|----------|---------------|---------|
+| **Happy path** | Core flow works as expected | Create coupon → saved, widget renders |
+| **Edge cases** | Boundary values, empty states | Empty list, max length input, 0 discount |
+| **Error paths** | Invalid input, server errors | Missing required fields → error message |
+| **UI states** | Loading, empty, error, success | Spinner while saving, empty coupon list |
+| **Roles/permissions** | Access control in UI + API | Uninstalled app → correct handling |
+| **Regression** | Previously fixed bugs still fixed | Check bugs from previous iterations |
+
+---
+
+## 3. Bug Report Template
+
+```markdown
+## BUG-XXX: <Short descriptive title>
+
+**Severity:** 🔴 P0 / 🟠 P1 / 🟡 P2
+**Found in:** TC-<id> / Exploratory
+**Environment:** local / staging / production
+**Date:** YYYY-MM-DD
+
+### Steps to Reproduce
+1. Open dashboard → Settings
+2. Change title to empty string
+3. Click Save
+4. Error: _blank title saved without validation_
+
+### Expected Behavior
+- Validation error shown: "Title is required"
+- Save button disabled when title is empty
+
+### Actual Behavior
+- Empty title saved successfully
+- Widget shows blank title area
+
+### Evidence
+- Screenshot: <link or embedded>
+- Console errors: <if any>
+- Network: <relevant request/response>
+
+### Notes
+- Regression from: BUG-003 (fixed in v0.9)
+- Related test case: TC-SETTINGS-03
+```
+
+---
+
+## 4. Evidence Requirements
+
+| Test Result | Required Evidence |
+|------------|-------------------|
+| **PASS** | Not required (optional screenshot) |
+| **FAIL** | **Required:** screenshot + steps + expected vs actual |
+| **BLOCKED** | Reason + what's needed to unblock |
+| **SKIPPED** | Rationale for skip |
+
+### For browser testing (Antigravity)
+
+Use `$qa_browser_testing` workflow:
+1. `browser_subagent` → navigate to page
+2. Capture screenshot for evidence
+3. Verify visual elements match UX Spec
+4. Save evidence to artifacts
+
+---
+
+## 5. Output Template
+
+```markdown
+# Manual Test Run Report
+
+**Sprint/Feature:** <name>
+**Tester:** Tester Agent
+**Date:** YYYY-MM-DD
+**Environment:** <staging URL>
+**Test Plan:** <reference>
+
+## Summary
+
+| Status | Count | % |
+|--------|:-----:|:---:|
+| ✅ PASS | 18 | 75% |
+| ❌ FAIL | 3 | 12.5% |
+| 🚫 BLOCKED | 2 | 8.3% |
+| ⏭️ SKIPPED | 1 | 4.2% |
+| **Total** | **24** | **100%** |
+
+## Results by Priority
+
+| Priority | Total | Pass | Fail | Blocked |
+|----------|:-----:|:----:|:----:|:-------:|
+| P0 | 10 | 9 | 1 | 0 |
+| P1 | 10 | 7 | 2 | 1 |
+| P2 | 4 | 2 | 0 | 2 |
+
+## Detailed Results
+
+| TC-ID | Flow | Priority | Status | Notes |
+|-------|------|:--------:|:------:|-------|
+| TC-01 | Install webhook | P0 | ✅ | — |
+| TC-06 | Update settings | P0 | ❌ | BUG-012: empty title saved |
+| TC-12 | Create coupon | P0 | ✅ | — |
+| TC-20 | Widget empty state | P1 | 🚫 | Widget endpoint down |
+
+## New Bugs Found
+
+| Bug ID | Severity | Title | TC | Status |
+|--------|----------|-------|----|--------|
+| BUG-012 | 🔴 P0 | Empty title saved without validation | TC-06 | Open |
+| BUG-013 | 🟠 P1 | Timer shows NaN for 0 seconds | TC-14 | Open |
+| BUG-014 | 🟠 P1 | Coupon code not trimmed | TC-13 | Open |
+
+## Regression Check
+| Previous Bug | Fixed in | Still fixed? |
+|-------------|---------|:------------:|
+| BUG-003 | v0.9 | ✅ |
+| BUG-007 | v0.9.2 | ❌ Regressed! → BUG-012 |
+
+## Exit Criteria Status
+- [x] All P0 test cases executed
+- [ ] All P0 test cases PASS ← 1 failure (BUG-012)
+- [x] No open P0 bugs from previous ← except regression
+
+## Verdict
+- ✅ **RELEASE** — all P0 pass, no open P0 bugs
+- ⚠️ **CONDITIONAL** — P0 bugs must be fixed first
+- ❌ **BLOCKED** — critical failures, not ready
+```
+
+---
+
+## See also
+- `$qa_test_plan` — create test plan before running
+- `$qa_browser_testing` — browser-based visual testing with Antigravity
+- `$qa_api_contract_tests` — API-level testing
+- `$qa_security_smoke_tests` — security smoke tests

package/locales/en/.agents/qa_manual_run/agents/claude.json

@@ -1,12 +1,12 @@
 {
   "name": "qa_manual_run",
   "display_name": "QA Manual Run",
-  "description": "Manual running of critical scenarios and regression: happy/edge/error paths according to UX Spec; fixing bugs with steps and evidence.",
+  "description": "Manually run critical scenarios and regression ? happy/edge/error paths from the UX Spec; record bugs with steps and evidence.",
   "default_prompt": "Use $qa_manual_run when the task matches the \"QA Manual Run\" skill.",
   "triggers": [
     "qa_manual_run",
     "qa manual run",
-    "Manual running of critical scenarios and regression"
+    "Manually run critical scenarios and regression ? happy/edge/error paths from the UX Spec"
   ],
   "capabilities": [
     "qa",

package/locales/en/.agents/qa_manual_run/agents/copilot.json

@@ -1,12 +1,12 @@
 {
   "name": "qa_manual_run",
   "display_name": "QA Manual Run",
-  "description": "Manual running of critical scenarios and regression: happy/edge/error paths according to UX Spec; fixing bugs with steps and evidence.",
+  "description": "Manually run critical scenarios and regression ? happy/edge/error paths from the UX Spec; record bugs with steps and evidence.",
   "default_prompt": "Use $qa_manual_run when the task matches the \"QA Manual Run\" skill.",
   "triggers": [
     "qa_manual_run",
     "qa manual run",
-    "Manual running of critical scenarios and regression"
+    "Manually run critical scenarios and regression ? happy/edge/error paths from the UX Spec"
   ],
   "capabilities": [
     "qa",