@decocms/start 0.19.0

package/.cursor/skills/deco-e2e-testing/templates/scripts/baseline.ts

@@ -0,0 +1,279 @@
+#!/usr/bin/env -S deno run -A
+/**
+ * Baseline Management Script
+ * ==========================
+ * Save current test results as baseline and compare against it.
+ *
+ * Usage:
+ *   deno run -A scripts/baseline.ts save [name]
+ *   deno run -A scripts/baseline.ts compare [name]
+ *   deno run -A scripts/baseline.ts list
+ *   deno run -A scripts/baseline.ts delete <name>
+ */
+
+import { ensureDirSync, existsSync } from "https://deno.land/std@0.224.0/fs/mod.ts";
+import { join, dirname, fromFileUrl } from "https://deno.land/std@0.224.0/path/mod.ts";
+
+interface PerformanceMetrics {
+    TTFB: number | null
+    FCP: number | null
+    LCP: number | null
+    CLS: number | null
+}
+
+interface PageMetrics {
+    pageName: string
+    performance: PerformanceMetrics
+    network: { totalRequests: number; totalBytes: number }
+}
+
+interface Report {
+    metrics: PageMetrics[]
+    timestamp: string
+    savedAt?: string
+    name?: string
+}
+
+interface ComparisonResult {
+    pageName: string
+    metric: string
+    baseline: number
+    current: number
+    diff: number
+    diffPercent: number
+    status: 'improved' | 'regressed' | 'unchanged'
+}
+
+const SCRIPT_DIR = dirname(fromFileUrl(import.meta.url))
+const REPORTS_DIR = join(SCRIPT_DIR, '..', 'reports')
+const BASELINES_DIR = join(REPORTS_DIR, 'baselines')
+const LATEST_REPORT = join(REPORTS_DIR, 'report-latest.json')
+const DEFAULT_BASELINE = join(BASELINES_DIR, 'baseline.json')
+
+// Threshold percentages for regression detection
+const THRESHOLDS: Record<string, number> = {
+    TTFB: 10,    // 10% slower = regression
+    FCP: 10,
+    LCP: 15,
+    CLS: 50,     // CLS is more variable
+}
+
+function loadReport(filepath: string): Report | null {
+    try {
+        const content = Deno.readTextFileSync(filepath)
+        return JSON.parse(content)
+    } catch {
+        return null
+    }
+}
+
+function saveBaseline(name?: string): void {
+    ensureDirSync(BASELINES_DIR)
+
+    const latest = loadReport(LATEST_REPORT)
+    if (!latest) {
+        console.error('❌ No report found at', LATEST_REPORT)
+        console.error('   Run the e2e tests first: deno task test:e2e')
+        Deno.exit(1)
+    }
+
+    const targetPath = name
+        ? join(BASELINES_DIR, `baseline-${name}.json`)
+        : DEFAULT_BASELINE
+
+    const baseline: Report = {
+        ...latest,
+        savedAt: new Date().toISOString(),
+        name: name || 'default',
+    }
+
+    Deno.writeTextFileSync(targetPath, JSON.stringify(baseline, null, 2))
+    console.log(`✅ Baseline saved: ${targetPath}`)
+    console.log(`   Timestamp: ${latest.timestamp}`)
+    console.log(`   Pages: ${latest.metrics.map(m => m.pageName).join(', ')}`)
+}
+
+function listBaselines(): void {
+    ensureDirSync(BASELINES_DIR)
+
+    let files: string[] = []
+    try {
+        files = [...Deno.readDirSync(BASELINES_DIR)]
+            .filter(f => f.isFile && f.name.endsWith('.json'))
+            .map(f => f.name)
+    } catch {
+        // Directory might not exist yet
+    }
+
+    if (files.length === 0) {
+        console.log('📋 No baselines saved yet')
+        console.log('   Save one with: deno task test:e2e:baseline:save')
+        return
+    }
+
+    console.log('📋 Saved baselines:\n')
+    for (const file of files) {
+        const filepath = join(BASELINES_DIR, file)
+        const baseline = loadReport(filepath)
+        if (baseline) {
+            const name = file.replace('baseline-', '').replace('.json', '')
+            console.log(`   ${name}`)
+            console.log(`      Saved: ${baseline.savedAt || baseline.timestamp}`)
+            console.log(`      Pages: ${baseline.metrics.length}`)
+            console.log('')
+        }
+    }
+}
+
+function deleteBaseline(name: string): void {
+    const targetPath = name === 'default'
+        ? DEFAULT_BASELINE
+        : join(BASELINES_DIR, `baseline-${name}.json`)
+
+    if (!existsSync(targetPath)) {
+        console.error(`❌ Baseline not found: ${name}`)
+        Deno.exit(1)
+    }
+
+    Deno.removeSync(targetPath)
+    console.log(`✅ Deleted baseline: ${name}`)
+}
+
+function compare(baselineName?: string): void {
+    const baselinePath = baselineName
+        ? join(BASELINES_DIR, `baseline-${baselineName}.json`)
+        : DEFAULT_BASELINE
+
+    const baseline = loadReport(baselinePath)
+    if (!baseline) {
+        console.error('❌ No baseline found at', baselinePath)
+        console.error('   Save a baseline first: deno task test:e2e:baseline:save')
+        Deno.exit(1)
+    }
+
+    const current = loadReport(LATEST_REPORT)
+    if (!current) {
+        console.error('❌ No current report found at', LATEST_REPORT)
+        console.error('   Run the e2e tests first: deno task test:e2e')
+        Deno.exit(1)
+    }
+
+    console.log('📊 Performance Comparison\n')
+    console.log(`   Baseline: ${baseline.savedAt || baseline.timestamp}`)
+    console.log(`   Current:  ${current.timestamp}\n`)
+
+    const results: ComparisonResult[] = []
+    let hasRegression = false
+
+    // Compare each page
+    for (const currentPage of current.metrics) {
+        const baselinePage = baseline.metrics.find(m => m.pageName === currentPage.pageName)
+        if (!baselinePage) continue
+
+        // Compare key metrics
+        for (const metric of ['TTFB', 'FCP', 'LCP'] as const) {
+            const baseVal = baselinePage.performance[metric]
+            const currVal = currentPage.performance[metric]
+
+            if (baseVal === null || currVal === null) continue
+
+            const diff = currVal - baseVal
+            const diffPercent = (diff / baseVal) * 100
+            const threshold = THRESHOLDS[metric]
+
+            let status: 'improved' | 'regressed' | 'unchanged'
+            if (diffPercent < -threshold) {
+                status = 'improved'
+            } else if (diffPercent > threshold) {
+                status = 'regressed'
+                hasRegression = true
+            } else {
+                status = 'unchanged'
+            }
+
+            results.push({
+                pageName: currentPage.pageName,
+                metric,
+                baseline: baseVal,
+                current: currVal,
+                diff,
+                diffPercent,
+                status,
+            })
+        }
+    }
+
+    // Print results grouped by page
+    const pageNames = [...new Set(results.map(r => r.pageName))]
+    for (const pageName of pageNames) {
+        console.log(`   ${pageName}`)
+        const pageResults = results.filter(r => r.pageName === pageName)
+
+        for (const r of pageResults) {
+            const icon = r.status === 'improved' ? '✅' : r.status === 'regressed' ? '❌' : '➖'
+            const sign = r.diff > 0 ? '+' : ''
+            const diffStr = `${sign}${r.diff.toFixed(0)}ms (${sign}${r.diffPercent.toFixed(1)}%)`
+
+            console.log(`      ${icon} ${r.metric}: ${r.baseline.toFixed(0)}ms → ${r.current.toFixed(0)}ms ${diffStr}`)
+        }
+        console.log('')
+    }
+
+    // Summary
+    const improved = results.filter(r => r.status === 'improved').length
+    const regressed = results.filter(r => r.status === 'regressed').length
+    const unchanged = results.filter(r => r.status === 'unchanged').length
+
+    console.log('   Summary:')
+    console.log(`      ✅ Improved: ${improved}`)
+    console.log(`      ❌ Regressed: ${regressed}`)
+    console.log(`      ➖ Unchanged: ${unchanged}`)
+
+    if (hasRegression) {
+        console.log('\n⚠️  Performance regressions detected!')
+        Deno.exit(1)
+    } else {
+        console.log('\n✅ No regressions detected')
+    }
+}
+
+// CLI
+const [command, arg] = Deno.args
+
+switch (command) {
+    case 'save':
+        saveBaseline(arg)
+        break
+    case 'compare':
+        compare(arg)
+        break
+    case 'list':
+        listBaselines()
+        break
+    case 'delete':
+        if (!arg) {
+            console.error('❌ Please specify baseline name to delete')
+            Deno.exit(1)
+        }
+        deleteBaseline(arg)
+        break
+    default:
+        console.log(`
+Baseline Management Script
+==========================
+
+Commands:
+  save [name]      Save current report as baseline (default name: "default")
+  compare [name]   Compare current report against baseline
+  list             List all saved baselines
+  delete <name>    Delete a specific baseline
+
+Examples:
+  deno task test:e2e:baseline:save
+  deno task test:e2e:baseline:compare
+
+  # With names:
+  deno run -A scripts/baseline.ts save pre-release
+  deno run -A scripts/baseline.ts compare pre-release
+`)
+}

package/.cursor/skills/deco-e2e-testing/templates/scripts/run-e2e.ts

@@ -0,0 +1,194 @@
+#!/usr/bin/env -S deno run -A
+/**
+ * E2E Test Runner Script
+ * ======================
+ * This script:
+ * 1. Checks if the dev server is already running on port 8000
+ * 2. If not, starts it in the background
+ * 3. Waits for the server to be ready (liveness check)
+ * 4. Runs the e2e tests
+ * 5. Reports the results
+ * 6. Cleans up server on exit (including Ctrl+C)
+ *
+ * Usage:
+ *   deno task test:e2e           # Run tests (auto-start server if needed)
+ *   deno task test:e2e:headed    # Run tests with visible browser
+ *
+ * Placeholders to replace:
+ *   {{SITE_NAME}} - Your site name (e.g., "lojastorra-2")
+ */
+
+const SITE_URL = "http://localhost:8000";
+const LIVENESS_PATH = "/deco/_liveness";
+const E2E_DIR = "./tests/e2e";
+const MAX_LIVENESS_RETRIES = 60;
+const LIVENESS_RETRY_DELAY = 1000;
+
+// Global state for cleanup
+let serverProcess: Deno.ChildProcess | null = null;
+let serverStartedByUs = false;
+let isCleaningUp = false;
+
+function cleanup(exitCode: number = 1): void {
+  if (isCleaningUp) return;
+  isCleaningUp = true;
+
+  if (serverProcess && serverStartedByUs) {
+    console.log("\n🛑 Stopping dev server...");
+    try {
+      serverProcess.kill("SIGTERM");
+    } catch {
+      // Process may already be dead
+    }
+    // Give it a moment to terminate gracefully, then force kill
+    setTimeout(() => {
+      try {
+        serverProcess?.kill("SIGKILL");
+      } catch {
+        // Ignore
+      }
+      Deno.exit(exitCode);
+    }, 1000);
+  } else {
+    Deno.exit(exitCode);
+  }
+}
+
+// Handle Ctrl+C and other termination signals
+Deno.addSignalListener("SIGINT", () => {
+  console.log("\n⚠️ Interrupted (Ctrl+C)");
+  cleanup(130); // Standard exit code for SIGINT
+});
+
+Deno.addSignalListener("SIGTERM", () => {
+  console.log("\n⚠️ Terminated");
+  cleanup(143); // Standard exit code for SIGTERM
+});
+
+// Handle uncaught errors
+globalThis.addEventListener("unhandledrejection", (event) => {
+  console.error("❌ Unhandled error:", event.reason);
+  cleanup(1);
+});
+
+async function isServerRunning(): Promise<boolean> {
+  try {
+    const res = await fetch(`${SITE_URL}${LIVENESS_PATH}`, {
+      signal: AbortSignal.timeout(2000),
+    });
+    return res.ok;
+  } catch {
+    return false;
+  }
+}
+
+async function waitForServer(): Promise<boolean> {
+  console.log("⏳ Waiting for server to be ready...");
+
+  for (let i = 0; i < MAX_LIVENESS_RETRIES; i++) {
+    if (await isServerRunning()) {
+      console.log(`✅ Server is ready (attempt ${i + 1})`);
+      return true;
+    }
+    await new Promise((r) => setTimeout(r, LIVENESS_RETRY_DELAY));
+    if ((i + 1) % 10 === 0) {
+      console.log(`   Still waiting... (${i + 1}/${MAX_LIVENESS_RETRIES})`);
+    }
+  }
+
+  return false;
+}
+
+async function startServer(): Promise<Deno.ChildProcess> {
+  console.log("🚀 Starting dev server...");
+
+  const command = new Deno.Command("deno", {
+    args: ["task", "dev"],
+    stdout: "piped",
+    stderr: "piped",
+  });
+
+  const process = command.spawn();
+
+  // Log server output in background
+  (async () => {
+    const decoder = new TextDecoder();
+    for await (const chunk of process.stdout) {
+      const text = decoder.decode(chunk);
+      if (text.includes("Fresh ready") || text.includes("Listening")) {
+        console.log("   📡 Server started");
+      }
+    }
+  })();
+
+  return process;
+}
+
+async function runTests(headed: boolean = false): Promise<boolean> {
+  console.log(`\n🧪 Running e2e tests${headed ? " (headed mode)" : ""}...\n`);
+
+  const args = ["test", "--project=desktop-chrome"];
+  if (headed) {
+    args.push("--headed");
+  }
+
+  const command = new Deno.Command("npm", {
+    args,
+    cwd: E2E_DIR,
+    env: {
+      ...Deno.env.toObject(),
+      SITE_URL,
+      HEADED: headed ? "true" : "false",
+    },
+    stdout: "inherit",
+    stderr: "inherit",
+  });
+
+  const { code } = await command.output();
+  return code === 0;
+}
+
+async function main() {
+  const args = Deno.args;
+  const headed = args.includes("--headed") || args.includes("-h");
+  const skipServerCheck = args.includes("--skip-server-check");
+
+  try {
+    // Check if server is already running
+    if (!skipServerCheck) {
+      const serverAlreadyRunning = await isServerRunning();
+
+      if (serverAlreadyRunning) {
+        console.log("✅ Dev server already running");
+      } else {
+        // Start the server
+        serverProcess = await startServer();
+        serverStartedByUs = true;
+
+        // Wait for it to be ready
+        const ready = await waitForServer();
+        if (!ready) {
+          console.error("❌ Server failed to start within timeout");
+          cleanup(1);
+          return;
+        }
+      }
+    }
+
+    // Run the tests
+    const testsPassed = await runTests(headed);
+
+    if (testsPassed) {
+      console.log("\n✅ All tests passed!");
+    } else {
+      console.log("\n❌ Some tests failed");
+    }
+
+    cleanup(testsPassed ? 0 : 1);
+  } catch (err) {
+    console.error("❌ Error:", err);
+    cleanup(1);
+  }
+}
+
+main();