@aisdlc/core 1.2.0 → 1.3.1

package/dist/index.js

@@ -120,17 +120,31 @@ function calculateLocAndHalstead(fullText, cyclomatic) {
   const normalizedMI = Math.max(0, Math.min(100, rawMI * 100 / 171));
   return { loc, mi: Math.round(normalizedMI * 10) / 10 };
 }
-function detectAstCodeSmells(node, loc, nodeText) {
+var TEST_FILE_PATTERN = /(?:^|\/)(?:tests|__tests__|fixtures)\/|\.(?:spec|test)\.[cm]?[jt]sx?$/i;
+var EMPTY_UI_HANDLER_PATTERN = /\bon[A-Z]\w*\s*=\s*\{\s*(?:\([^)]*\)\s*=>\s*\{\s*\}|function\s*\([^)]*\)\s*\{\s*\})\s*\}/;
+var FAKE_WIRING_STUB_PATTERN = /(?:\/\/\s*T[O]DO:\s*(?:connect|wire|integrate)\b|\b(?:m[o]ckData|F[A]KE_DATA)\b)/i;
+function isProductionFile(filePath) {
+  return !TEST_FILE_PATTERN.test(filePath.replace(/\\/g, "/"));
+}
+function detectAstCodeSmells(node, loc, fullText, filePath) {
   const smells = [];
   if (node.getDescendantsOfKind(SyntaxKind.AnyKeyword).length > 0) {
     smells.push('Uso prohibido de "any"');
   }
-  if (/\/\/\s*@ts-ignore|\/\/\s*eslint-disable/.test(nodeText)) {
+  if (/\/\/\s*@ts-ignore|\/\/\s*eslint-disable/.test(fullText)) {
     smells.push("Supresi\xF3n no autorizada de linter");
   }
   if (loc > 40) {
     smells.push(`Funci\xF3n extensa (${loc} l\xEDneas > l\xEDmite 40)`);
   }
+  if (isProductionFile(filePath)) {
+    if (EMPTY_UI_HANDLER_PATTERN.test(fullText)) {
+      smells.push("Handler de UI vac\xEDo (fake-wiring detectado)");
+    }
+    if (FAKE_WIRING_STUB_PATTERN.test(fullText)) {
+      smells.push("Datos simulados o conexi\xF3n pendiente en producci\xF3n (fake-wiring)");
+    }
+  }
   return smells;
 }
 function isDeclarationFunction(node) {
@@ -154,9 +168,8 @@ function buildNodeMetrics(node, filePath) {
   const cyclomatic = computeCyclomaticFromAst(node);
   const cognitive = computeCognitiveFromAst(node);
   const fullText = node.getFullText();
-  const nodeText = node.getText();
   const { loc, mi } = calculateLocAndHalstead(fullText, cyclomatic);
-  const codeSmells = detectAstCodeSmells(node, loc, nodeText);
+  const codeSmells = detectAstCodeSmells(node, loc, fullText, filePath);
   return { functionName, filePath, loc, cyclomatic, cognitive, maintainability: mi, codeSmells };
 }
 function buildModuleFallback(content, filePath) {
@@ -709,6 +722,12 @@ function walkMdFiles(dir, fileList = [], excludeDirs = [
   "node_modules",
   ".git",
   "dist",
+  "bin",
+  "obj",
+  "build",
+  "out",
+  "target",
+  "coverage",
   ".changeset",
   "scratch",
   "test-scaffold",
@@ -720,7 +739,9 @@ function walkMdFiles(dir, fileList = [], excludeDirs = [
   ".claude",
   ".cursor",
   ".github",
-  ".vscode"
+  ".vscode",
+  ".vs",
+  ".idea"
 ]) {
   try {
     if (!fs6.existsSync(dir)) return fileList;
@@ -3271,10 +3292,18 @@ var SKIPPED_DIR_NAMES = /* @__PURE__ */ new Set([
   "node_modules",
   ".git",
   "dist",
+  "bin",
+  "obj",
+  "build",
+  "out",
+  "target",
+  "coverage",
   "scratch",
   "fixtures",
   "templates",
-  "examples"
+  "examples",
+  ".vs",
+  ".idea"
 ]);
 function shouldSkipDir(name) {
   return SKIPPED_DIR_NAMES.has(name) || name.startsWith("temp-");
@@ -3377,7 +3406,12 @@ function verifyTraceability(options = {}) {
         }
       }
       if (relFile.includes("architecture/") || relFile.includes("06_runtime_view") || relFile.includes("08_security_concept") || relFile.includes("09_decisions")) {
-        architectureViews.push({ file: relFile, content });
+        architectureViews.push({
+          file: relFile,
+          id: frontmatter.id ? String(frontmatter.id).trim() : void 0,
+          type: typeof frontmatter.type === "string" ? frontmatter.type.trim() : void 0,
+          content
+        });
       }
     } catch {
     }
@@ -3480,8 +3514,9 @@ function verifyTraceability(options = {}) {
     }
     for (const view of architectureViews) {
       if (view.content.includes(reqId)) {
-        const viewName = path8.basename(view.file);
-        if (!archTraces.includes(viewName)) archTraces.push(viewName);
+        const isEntityWithId = view.type === "component" || view.type === "adr" || view.type === "architecture-decision-record" || view.type === "security-enclave" || view.id !== void 0 && (view.id.startsWith("CMP-") || view.id.startsWith("ADR-") || view.id.startsWith("SEC-ENC-"));
+        const viewIdentifier = isEntityWithId && view.id ? view.id : path8.basename(view.file);
+        if (!archTraces.includes(viewIdentifier)) archTraces.push(viewIdentifier);
       }
     }
     const uniqueArchTraces = Array.from(new Set(archTraces));
@@ -3818,7 +3853,7 @@ function scanAllTestArtifacts(rootDir) {
     for (const e of entries) {
       const fullPath = path8.join(dir, e.name);
       if (e.isDirectory()) {
-        if (!["node_modules", ".git", "dist", ".changeset", "scratch", "fixtures", "templates", "examples"].includes(e.name)) {
+        if (!["node_modules", ".git", "dist", "bin", "obj", "build", "out", "target", "coverage", ".changeset", "scratch", "fixtures", "templates", "examples", ".vs", ".idea"].includes(e.name)) {
           walk(fullPath);
         }
       } else {
@@ -7123,7 +7158,31 @@ function buildGraphElements(rootDir = process.cwd()) {
   for (const n of pdac.drifts) {
     driftTargets.add(n.targetId);
   }
+  const NON_GRAPH_TYPES = /* @__PURE__ */ new Set([
+    "term",
+    "handoff",
+    "agent-handoff",
+    "tasks",
+    "task-plan",
+    "spec-change-proposal",
+    "proposal",
+    "spec-design",
+    "spec-change-design",
+    "design",
+    "delivery-spec",
+    "spec",
+    "pre-merge-audit-report",
+    "user-design-feedback",
+    "release-kpis",
+    "session-telemetry",
+    "license-manifest",
+    "mcp-config",
+    "user-manual",
+    "production-manual",
+    "architecture-glossary"
+  ]);
   const scannedArtifactsMap = /* @__PURE__ */ new Map();
+  const archViewByBasename = /* @__PURE__ */ new Map();
   const artifactDirs = ["product", "architecture", "specs", "security"];
   for (const dirName of artifactDirs) {
     const fullDirPath = path8.join(rootDir, dirName);
@@ -7133,6 +7192,7 @@ function buildGraphElements(rootDir = process.cwd()) {
         try {
           const fileContent = fs6.readFileSync(f, "utf-8");
           const relPath = path8.relative(rootDir, f).replace(/\\/g, "/");
+          if (relPath.includes("/changes/") || relPath.startsWith("changes/")) continue;
           const match = fileContent.match(/^---\r?\n([\s\S]*?)\r?\n---/);
           if (!match) continue;
           let fm = {};
@@ -7144,6 +7204,9 @@ function buildGraphElements(rootDir = process.cwd()) {
           const id = typeof fm.id === "string" ? fm.id.trim() : void 0;
           if (!id) continue;
           let type = typeof fm.type === "string" ? fm.type.trim() : "";
+          if (NON_GRAPH_TYPES.has(type) || id.startsWith("TERM-") || id.startsWith("HOF-") || id.startsWith("AHOF-") || id.startsWith("CHG-") || id.startsWith("DSG-") || id.startsWith("SPEC-") || id.startsWith("TSK-") || id.startsWith("UDF-") || id.startsWith("AUDIT-")) {
+            continue;
+          }
           let layer = "product";
           if (id.startsWith("JRN-") || type === "journey") {
             type = "journey";
@@ -7178,16 +7241,19 @@ function buildGraphElements(rootDir = process.cwd()) {
           } else if (id.startsWith("SEC-REQ-") || type === "security-requirement") {
             type = "security-requirement";
             layer = "requirement";
-          } else if (id.startsWith("FR-") || id.startsWith("QR-") || id.startsWith("CON-") || type === "requirement") {
+          } else if (id.startsWith("FR-") || id.startsWith("QR-") || id.startsWith("CON-") || type === "requirement" || type === "functional-requirement" || type === "quality-requirement") {
             type = "requirement";
             layer = "requirement";
+          } else if (id.startsWith("ARCH-") || relPath.includes("architecture/")) {
+            type = "architecture";
+            layer = "architecture";
           } else {
             type = type || "product";
             layer = "product";
           }
           const title = typeof fm.title === "string" ? fm.title.trim() : id;
           const content = fileContent.replace(/^---\r?\n[\s\S]*?\r?\n---/, "").trim();
-          scannedArtifactsMap.set(id, {
+          const scannedArt = {
             id,
             type,
             title,
@@ -7195,7 +7261,12 @@ function buildGraphElements(rootDir = process.cwd()) {
             filePath: relPath,
             content,
             frontmatter: fm
-          });
+          };
+          if (layer === "architecture" && type === "architecture") {
+            archViewByBasename.set(path8.basename(relPath), scannedArt);
+          } else {
+            scannedArtifactsMap.set(id, scannedArt);
+          }
         } catch {
         }
       }
@@ -7204,7 +7275,7 @@ function buildGraphElements(rootDir = process.cwd()) {
   for (const r of trace.rows) {
     const isOk = (r.productStatus === "COMPLIANT" || r.productStatus === "CONFORME") && (r.archStatus === "COMPLIANT" || r.archStatus === "CONFORME") && (r.testStatus === "COMPLIANT" || r.testStatus === "CONFORME");
     const status = isOk ? "COMPLIANT" : "ORPHAN";
-    const reqType = r.id.startsWith("SEC-REQ-") ? "security-requirement" : r.type || "requirement";
+    const reqType = r.id.startsWith("SEC-REQ-") ? "security-requirement" : "requirement";
     nodeMap.set(r.id, {
       id: r.id,
       label: r.id,
@@ -7264,13 +7335,16 @@ function buildGraphElements(rootDir = process.cwd()) {
         });
         if (!nodeMap.has(a)) {
           const aType = a.startsWith("CMP-") ? "component" : a.startsWith("ADR-") ? "adr" : a.startsWith("SEC-ENC-") ? "security-enclave" : "architecture";
+          const viewArt = archViewByBasename.get(a);
           nodeMap.set(a, {
             id: a,
             label: a,
-            title: a,
+            title: viewArt?.title || a,
             type: aType,
             layer: "architecture",
-            status: "COMPLIANT"
+            status: "COMPLIANT",
+            filePath: viewArt?.filePath,
+            content: viewArt?.content
           });
         }
       }
@@ -7402,7 +7476,31 @@ function buildGraphElements(rootDir = process.cwd()) {
           status: "COMPLIANT"
         });
       }
-      const governedBy = Array.isArray(fm["governed-by"]) ? fm["governed-by"] : [];
+      const supportingActors = Array.isArray(fm["supporting-actors"]) ? fm["supporting-actors"] : Array.isArray(fm["secondary-actors"]) ? fm["secondary-actors"] : [];
+      for (const actorId of supportingActors) {
+        if (typeof actorId === "string" && actorId.trim()) {
+          const a = actorId.trim();
+          if (!nodeMap.has(a)) {
+            nodeMap.set(a, {
+              id: a,
+              label: a,
+              title: a,
+              type: "actor",
+              layer: "product",
+              status: "COMPLIANT"
+            });
+          }
+          addEdge({
+            id: `edge-${a}-${art.id}`,
+            source: a,
+            target: art.id,
+            label: "initiates",
+            relation: "initiates",
+            status: "COMPLIANT"
+          });
+        }
+      }
+      const governedBy = Array.isArray(fm["governed-by"]) ? fm["governed-by"] : Array.isArray(fm["business-rules"]) ? fm["business-rules"] : [];
       for (const ruleId of governedBy) {
         if (typeof ruleId === "string" && ruleId.trim()) {
           const r = ruleId.trim();
@@ -7463,7 +7561,31 @@ function buildGraphElements(rootDir = process.cwd()) {
           status: "COMPLIANT"
         });
       }
-      const rawTargets = fm["targets-use-case"] ? [fm["targets-use-case"]] : Array.isArray(fm["targets-use-cases"]) ? fm["targets-use-cases"] : Array.isArray(fm["targets"]) ? fm["targets"] : [];
+      const secondaryThreatActors = Array.isArray(fm["secondary-actors"]) ? fm["secondary-actors"] : Array.isArray(fm["supporting-actors"]) ? fm["supporting-actors"] : [];
+      for (const secActor of secondaryThreatActors) {
+        if (typeof secActor === "string" && secActor.trim()) {
+          const sa = secActor.trim();
+          if (!nodeMap.has(sa)) {
+            nodeMap.set(sa, {
+              id: sa,
+              label: sa,
+              title: sa,
+              type: sa.startsWith("ACT-THREAT-") ? "threat-actor" : "actor",
+              layer: "product",
+              status: "COMPLIANT"
+            });
+          }
+          addEdge({
+            id: `edge-${sa}-${art.id}`,
+            source: sa,
+            target: art.id,
+            label: "threatens",
+            relation: "threatens",
+            status: "COMPLIANT"
+          });
+        }
+      }
+      const rawTargets = Array.isArray(fm["targets-use-case"]) ? fm["targets-use-case"] : typeof fm["targets-use-case"] === "string" ? [fm["targets-use-case"]] : Array.isArray(fm["targets-use-cases"]) ? fm["targets-use-cases"] : Array.isArray(fm["targets"]) ? fm["targets"] : [];
       for (const tgt of rawTargets) {
         if (typeof tgt === "string" && tgt.trim()) {
           const t = tgt.trim();
@@ -7528,6 +7650,40 @@ function buildGraphElements(rootDir = process.cwd()) {
           });
         }
       }
+    } else if (art.type === "adr") {
+      const affectedComponents = Array.isArray(fm["affects-components"]) ? fm["affects-components"] : typeof fm["affects-components"] === "string" ? [fm["affects-components"]] : [];
+      for (const cmpId of affectedComponents) {
+        if (typeof cmpId === "string" && cmpId.trim()) {
+          const c = cmpId.trim();
+          if (nodeMap.has(c)) {
+            addEdge({
+              id: `edge-${art.id}-${c}`,
+              source: art.id,
+              target: c,
+              label: "governs",
+              relation: "governs",
+              status: "COMPLIANT"
+            });
+          }
+        }
+      }
+    } else if (art.type === "security-enclave") {
+      const enforcedBy = Array.isArray(fm["enforced-by"]) ? fm["enforced-by"] : typeof fm["enforced-by"] === "string" ? [fm["enforced-by"]] : [];
+      for (const secReq of enforcedBy) {
+        if (typeof secReq === "string" && secReq.trim()) {
+          const s = secReq.trim();
+          if (nodeMap.has(s)) {
+            addEdge({
+              id: `edge-${s}-${art.id}`,
+              source: s,
+              target: art.id,
+              label: "satisfies",
+              relation: "satisfies",
+              status: "COMPLIANT"
+            });
+          }
+        }
+      }
     }
   }
   for (const [id, node] of nodeMap.entries()) {
@@ -7677,6 +7833,9 @@ function collectDashboardMetrics(rootDir) {
 function escapeHtml(str) {
   return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
 }
+function safeJsonForScript(data) {
+  return JSON.stringify(data).replace(/</g, "\\u003c").replace(/>/g, "\\u003e").replace(/&/g, "\\u0026").replace(/\u2028/g, "\\u2028").replace(/\u2029/g, "\\u2029");
+}
 function renderAutonomyModeSection(mode, statusIcon, count, roleDescription, allTasks = []) {
   const modeTasks = (allTasks || []).filter(
     (t) => (t.task?.autonomyMode || "").toUpperCase() === mode
@@ -7788,14 +7947,14 @@ function renderAutonomyModeSection(mode, statusIcon, count, roleDescription, all
 }
 function renderDashboardHtml(graphData, metricsData, title = "AI-SDLC: Dashboard Interactivo de Trazabilidad y Calidad") {
   const cytoscapeScript = getCytoscapeScript();
-  const elementsJson = JSON.stringify(graphData.elements);
+  const elementsJson = safeJsonForScript(graphData.elements);
   const now = (/* @__PURE__ */ new Date()).toISOString();
   return `<!DOCTYPE html>
 <html lang="es">
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>${title}</title>
+  <title>${escapeHtml(title)}</title>
   <style>
     :root {
       --bg-dark: #0f172a;
@@ -8170,12 +8329,12 @@ function renderDashboardHtml(graphData, metricsData, title = "AI-SDLC: Dashboard
             ${metricsData.trace.rows.map((r) => {
     const isRowOk = (r.productStatus === "COMPLIANT" || r.productStatus === "CONFORME") && (r.archStatus === "COMPLIANT" || r.archStatus === "CONFORME") && (r.testStatus === "COMPLIANT" || r.testStatus === "CONFORME");
     return `
-              <tr onclick="focusNode('${r.id}')" onmouseenter="startRowTooltip(event, '${r.id}')" onmouseleave="cancelRowTooltip()" onmousemove="updateRowTooltipPos(event)" style="cursor: pointer;">
-                <td><strong><code>${r.id}</code></strong></td>
-                <td>${r.title}</td>
-                <td><code>${r.productTraces}</code></td>
-                <td><code>${r.archTraces}</code></td>
-                <td><code>${r.testTraces}</code></td>
+              <tr onclick="focusNode('${escapeHtml(String(r.id || ""))}')" onmouseenter="startRowTooltip(event, '${escapeHtml(String(r.id || ""))}')" onmouseleave="cancelRowTooltip()" onmousemove="updateRowTooltipPos(event)" style="cursor: pointer;">
+                <td><strong><code>${escapeHtml(String(r.id || ""))}</code></strong></td>
+                <td>${escapeHtml(String(r.title || ""))}</td>
+                <td><code>${escapeHtml(String(r.productTraces || ""))}</code></td>
+                <td><code>${escapeHtml(String(r.archTraces || ""))}</code></td>
+                <td><code>${escapeHtml(String(r.testTraces || ""))}</code></td>
                 <td><span class="badge ${isRowOk ? "badge-green" : "badge-amber"}">${isRowOk ? "COMPLIANT" : "ORPHAN"}</span></td>
               </tr>
             `;
@@ -8388,7 +8547,7 @@ function renderDashboardHtml(graphData, metricsData, title = "AI-SDLC: Dashboard
   </script>
   <script>
     var elements = ${elementsJson};
-    var govTasks = ${JSON.stringify(metricsData.gov.tasks || [])};
+    var govTasks = ${safeJsonForScript(metricsData.gov.tasks || [])};
     var cy = null;
 
     var reqHoverTimer = null;
@@ -9021,9 +9180,10 @@ function renderDashboardHtml(graphData, metricsData, title = "AI-SDLC: Dashboard
 
     function switchTab(name) {
       hideTooltip();
-      document.querySelectorAll('.tab-btn').forEach(function(b) { b.classList.remove('active'); });
+      document.querySelectorAll('.tab-btn').forEach(function(b) {
+        b.classList.toggle('active', b.getAttribute('onclick') === "switchTab('" + name + "')");
+      });
       document.querySelectorAll('.tab-panel').forEach(function(p) { p.classList.remove('active'); });
-      event.target?.classList?.add('active');
       var p = document.getElementById('tab-' + name);
       if (p) p.classList.add('active');
       if (name === 'graph' && cy) {
@@ -9285,6 +9445,7 @@ var SPECIALIZED_AGENT_TEMPLATES = [
 
 ## Operational Directives & Guardrails
 - Decompose the system into building blocks \`CMP-*\` ensuring each component declares which use cases \`UC-*\` it implements and which requirements (\`FR-*\`, \`QR-*\`, \`SEC-REQ-*\`) it fulfills under \`satisfies-requirements\`.
+- **Contract-First Full-Stack Integration**: Whenever a feature or change spans Frontend (UI) and Backend (API/services), define an explicit shared typed contract (Zod schemas, shared TypeScript DTOs, or OpenAPI specification) in \`design.md\` before implementation so both layers compile against a single source of truth.
 - Generate interaction and sequence diagrams in native Mermaid syntax.
 - Document critical technological decisions using immutable \`ADR-*\` records conforming to \`schemas/architecture/adr.schema.json\`.
 - Validate that architectural choices comply with legal constraints in \`license-policy.yaml\`.
@@ -9307,6 +9468,7 @@ var SPECIALIZED_AGENT_TEMPLATES = [
   2. **Boundary Cases** (\`Scenario Outline\` + \`Examples\` table): values at the extremes of the accepted range.
   3. **Out-of-Range / Invalid Cases** (\`Scenario Outline\` + \`Examples\` table): null, empty, wrong types, values exceeding bounds.
 - Apply conditional categories when applicable: Security (\`@security @mitigation\`), Performance (\`@performance\`), Idempotency (\`@idempotence\`), Postconditions, and Interface Contracts.
+- **Zero-Mock Integration Rule**: When an \`FR-*\` spans UI and Backend, unit tests mocking \`fetch\`/HTTP in isolation are insufficient; include integration/contract or E2E test scenarios verifying real request/response wiring and UI state transitions (\`Loading\`, \`Empty\`, \`Error\`, \`Nominal\`).
 - Tag all scenarios with \`@<FR-ID> @automated @regression\`.
 - **STRICTLY FORBIDDEN**: Including production code, suggesting implementation, or anticipating technical solutions.
 - Run \`pnpm run verify:testing\` before emitting handoff.
@@ -9325,6 +9487,9 @@ var SPECIALIZED_AGENT_TEMPLATES = [
 - Respect the autonomy mode assigned to each task in \`tasks.md\` (\`AUTONOMOUS\`, \`HUMAN_REVIEW_PLAN\`, \`AMBIGUOUS\`, \`HIGH_RISK_MANUAL\`).
 - Apply Test-Driven Development (TDD): make failing tests delivered by \`agent-qa-engineer\` pass green without altering tests to accommodate buggy code.
 - Cite implemented \`FR-*\` or \`SEC-REQ-*\` IDs in test header comments to maintain 360\xB0 reverse traceability.
+- **Zero Fake-Wiring Guardrail**: Strictly forbidden from marking a task \`COMPLETED\` with hardcoded \`mockData\` arrays in production views, \`setTimeout\` simulating network calls, or empty UI event handlers (\`onClick={() => {}}\`, \`onSubmit={() => {}}\`). Frontend components must wire directly to the shared contract and real Backend endpoints.
+- **Mandatory 4 UI States Matrix**: Every data-driven UI component or screen must explicitly implement all 4 usability states: \`Loading\` (spinner/skeleton + disabled submit), \`Empty\` (clear message + CTA), \`Error\` (visible error recovery banner, never silent failure), and \`Nominal/Success\` (accessible semantic DOM + keyboard navigation).
+- **Live Runtime Smoke Verification**: For tasks touching UI or UI-to-Backend integration, unit tests alone are insufficient. Before emitting handoff, boot the real Backend and Frontend servers and verify (via Playwright E2E or Chrome DevTools MCP) that browser \`console.error\` and \`pageerror\` counts are \`0\` and API calls return real \`2xx\` responses without CORS or schema mismatches.
 - Before adding any external dependency, verify its SPDX license is permitted in \`license-policy.yaml\`.
 - Respect non-negotiable \`quality-policy.yaml\` thresholds: Cyclomatic Complexity $\\le 10$, Cognitive Complexity $\\le 15$, Maintainability Index $\\ge 50$, Function Length $\\le 40$ lines.
 - Run unified pre-flight with auto-fix (\`pnpm run check:fix\`) and full verification (\`pnpm run verify:all\`).
@@ -9373,9 +9538,9 @@ var SPECIALIZED_AGENT_TEMPLATES = [
 ## Operational Directives & Guardrails
 - Operate under bimodal discipline depending on the lifecycle phase:
   1. **Design Mode (Upstream)**: Adopt the primary actor persona under real-world field conditions (stress, latency, constrained viewports). Separate strict Minimum Viable Product (MVP) core from future roadmap ideas using \`templates/product/user-design-feedback.template.md\`.
-  2. **Functional Validation Mode (Downstream / Pre-PR / Post-Development Functional Validation)**: Inspect \`agent-developer\` deliverables once unit tests pass green. Contrast actual UI, CLI, and API behavior against approved \`UC-*\` and \`FR-*\` criteria.
+  2. **Functional Validation Mode (Downstream / Pre-PR / Post-Development Functional Validation)**: Inspect \`agent-developer\` deliverables once unit tests pass green by executing the real application (via Playwright or Chrome DevTools MCP when UI is present). Contrast actual UI, CLI, and API behavior against approved \`UC-*\` and \`FR-*\` criteria, verifying real Backend connectivity, the 4 UI usability states (\`Loading\`, \`Empty\`, \`Error\`, \`Nominal\`), keyboard/ARIA accessibility, and \`0\` browser \`console.error\` / network failures.
 - Formulate decisive questions under \`open-questions\` for the human Product Owner.
-- Emit handoff block suggesting the Pre-Merge Audit Triad (\`agent-code-reviewer\`, \`agent-security-auditor\`, \`agent-compliance-checker\`) if compliant, or return to \`agent-developer\` on functional drift.`
+- Emit handoff block suggesting the Pre-Merge Audit Triad (\`agent-code-reviewer\`, \`agent-security-auditor\`, \`agent-compliance-checker\`) if compliant, or return to \`agent-developer\` on functional drift or fake-wiring.`
   },
   {
     id: "agent-code-reviewer",
@@ -9390,6 +9555,7 @@ var SPECIALIZED_AGENT_TEMPLATES = [
 - Analyze code diffs against \`quality-policy.yaml\` standards: Cyclomatic Complexity $\\le 10$, Cognitive Complexity $\\le 15$, Maintainability Index $\\ge 50$, Lines per Function $\\le 40$.
 - Detect improper coupling, code smells, magic numbers, ambiguous identifiers, and encapsulation breaches.
 - Flag premature abstractions and speculative code violating YAGNI.
+- **Block Fake-Wiring & Disconnected UI**: Flag as \`[BLOCKING]\` any production UI component containing hardcoded mock data (\`mockData\`), empty event handlers (\`onClick={() => {}}\`), missing error/loading state handling, or API calls bypassing shared contracts.
 - Coordinate Pre-Merge Audit Triad with \`agent-security-auditor\` and \`agent-compliance-checker\`.
 - Categorize findings into: \`[BLOCKING]\` (quality violation or broken pattern), \`[CLEAN_CODE_SUGGESTION]\` (non-blocking improvement), and \`[COMPLIANT]\`.
 - If autonomy is $\\ge$ \`HUMAN_REVIEW_PLAN\`, conclude by emitting the Workflow Handoff block (\`templates/workflow/agent-handoff.template.md\`) to the human Tech Lead for final approval and merge, opening the Human Action Window. In \`AUTONOMOUS\` mode, omit interactive handoff.`