@vibecodeqa/cli 0.15.0 → 0.17.0

package/dist/runners/accessibility.js

@@ -0,0 +1,85 @@
+/** Accessibility check — detects common a11y violations in JSX/TSX code. */
+import { existsSync, readFileSync } from "node:fs";
+import { join } from "node:path";
+import { gradeFromScore } from "../types.js";
+import { getProductionFiles } from "../fs-utils.js";
+export function runAccessibility(cwd) {
+    const start = Date.now();
+    const files = getProductionFiles(cwd).filter((f) => f.ext === ".tsx" || f.ext === ".jsx");
+    if (files.length === 0) {
+        return { name: "accessibility", score: 100, grade: "A", details: { skipped: true, reason: "no JSX/TSX files" }, issues: [], duration: Date.now() - start };
+    }
+    const issues = [];
+    let missingAlt = 0;
+    let clickDiv = 0;
+    let missingLabel = 0;
+    let missingLang = 0;
+    let autofocus = 0;
+    let positiveTabindex = 0;
+    for (const f of files) {
+        const lines = f.content.split("\n");
+        for (let i = 0; i < lines.length; i++) {
+            const line = lines[i];
+            const trimmed = line.trim();
+            if (trimmed.startsWith("//") || trimmed.startsWith("*"))
+                continue;
+            // 1. <img> without alt
+            if (/<img\b/.test(trimmed) && !/alt=/.test(trimmed)) {
+                const block = lines.slice(i, Math.min(i + 5, lines.length)).join(" ");
+                if (/<img\b/.test(block) && !/alt=/.test(block)) {
+                    missingAlt++;
+                    issues.push({ severity: "error", message: "<img> missing alt attribute", file: f.path, line: i + 1, rule: "img-alt" });
+                }
+            }
+            // 2. Click handler on non-interactive element without role/keyboard
+            if (/onClick=/.test(trimmed) && /<(?:div|span|p|li|section|article|header|footer)\b/.test(trimmed)) {
+                const block = lines.slice(i, Math.min(i + 3, lines.length)).join(" ");
+                if (!(/role=/.test(block) && /(?:onKeyDown|onKeyUp|onKeyPress|tabIndex)/.test(block))) {
+                    clickDiv++;
+                    issues.push({ severity: "warning", message: "Click handler on non-interactive element without role + keyboard handler", file: f.path, line: i + 1, rule: "click-events" });
+                }
+            }
+            // 3. <input>/<select>/<textarea> without associated label
+            if (/<(?:input|select|textarea)\b/.test(trimmed) && !/type=["'](?:hidden|submit|button|reset)["']/.test(trimmed)) {
+                const block = lines.slice(Math.max(0, i - 3), Math.min(i + 3, lines.length)).join(" ");
+                if (!/aria-label=/.test(block) && !/aria-labelledby=/.test(block) && !/<label/.test(block) && !/id=/.test(trimmed)) {
+                    missingLabel++;
+                    issues.push({ severity: "warning", message: "Form control without label, aria-label, or aria-labelledby", file: f.path, line: i + 1, rule: "form-label" });
+                }
+            }
+            // 4. autoFocus
+            if (/\bautoFocus\b/.test(trimmed) || /\bautofocus\b/.test(trimmed)) {
+                autofocus++;
+                issues.push({ severity: "warning", message: "autoFocus can disorient screen reader users", file: f.path, line: i + 1, rule: "no-autofocus" });
+            }
+            // 5. Positive tabIndex
+            if (/tabIndex=\{[1-9]/.test(trimmed) || /tabindex=["'][1-9]/.test(trimmed)) {
+                positiveTabindex++;
+                issues.push({ severity: "warning", message: "Positive tabIndex disrupts natural tab order — use 0 or -1", file: f.path, line: i + 1, rule: "tabindex" });
+            }
+        }
+    }
+    // 6. Check for html lang attribute in index.html
+    const htmlPaths = ["index.html", "web/index.html", "public/index.html"];
+    for (const h of htmlPaths) {
+        const full = join(cwd, h);
+        if (!existsSync(full))
+            continue;
+        const content = readFileSync(full, "utf-8");
+        if (/<html\b/.test(content) && !/<html[^>]*lang=/.test(content)) {
+            missingLang++;
+            issues.push({ severity: "warning", message: "<html> missing lang attribute", file: h, rule: "html-lang" });
+        }
+    }
+    const errors = issues.filter((i) => i.severity === "error").length;
+    const warnings = issues.filter((i) => i.severity === "warning").length;
+    const score = Math.max(0, Math.min(100, 100 - errors * 10 - warnings * 4));
+    return {
+        name: "accessibility",
+        score,
+        grade: gradeFromScore(score),
+        details: { jsxFiles: files.length, missingAlt, clickDiv, missingLabel, missingLang, autofocus, positiveTabindex },
+        issues,
+        duration: Date.now() - start,
+    };
+}

package/dist/runners/react.d.ts

@@ -0,0 +1,3 @@
+/** React-specific checks — hooks rules, conditional hooks, missing keys, prop spreading. */
+import type { CheckResult, StackInfo } from "../types.js";
+export declare function runReact(cwd: string, stack: StackInfo): CheckResult;

package/dist/runners/react.js

@@ -0,0 +1,81 @@
+/** React-specific checks — hooks rules, conditional hooks, missing keys, prop spreading. */
+import { gradeFromScore } from "../types.js";
+import { getProductionFiles } from "../fs-utils.js";
+export function runReact(cwd, stack) {
+    const start = Date.now();
+    if (stack.framework !== "react") {
+        return { name: "react", score: 100, grade: "A", details: { skipped: true, reason: "not a React project" }, issues: [], duration: Date.now() - start };
+    }
+    const files = getProductionFiles(cwd).filter((f) => f.ext === ".tsx" || f.ext === ".jsx");
+    if (files.length === 0) {
+        return { name: "react", score: 100, grade: "A", details: { skipped: true, reason: "no JSX/TSX files" }, issues: [], duration: Date.now() - start };
+    }
+    const issues = [];
+    let conditionalHooks = 0;
+    let missingKeys = 0;
+    let propSpreading = 0;
+    let inlineHandlers = 0;
+    let indexKeys = 0;
+    for (const f of files) {
+        const lines = f.content.split("\n");
+        // Track if we're inside a conditional block
+        let condDepth = 0;
+        for (let i = 0; i < lines.length; i++) {
+            const line = lines[i];
+            const trimmed = line.trim();
+            // Skip comments
+            if (trimmed.startsWith("//") || trimmed.startsWith("*"))
+                continue;
+            // Track conditional blocks
+            if (/\b(if|else|switch)\s*\(/.test(trimmed))
+                condDepth++;
+            if (condDepth > 0 && trimmed.includes("{"))
+                condDepth++;
+            if (condDepth > 0 && trimmed.includes("}"))
+                condDepth--;
+            // 1. Hooks called inside conditionals
+            if (condDepth > 0 && /\buse[A-Z]\w*\s*\(/.test(trimmed) && !/\/\//.test(trimmed.split("use")[0])) {
+                conditionalHooks++;
+                issues.push({ severity: "error", message: "Hook called inside conditional — violates Rules of Hooks", file: f.path, line: i + 1, rule: "conditional-hook" });
+            }
+            // 2. Missing key in .map() returning JSX
+            if (/\.map\s*\(/.test(trimmed)) {
+                // Look ahead for JSX return without key
+                const mapBlock = lines.slice(i, Math.min(i + 10, lines.length)).join("\n");
+                if (/<\w/.test(mapBlock) && !mapBlock.includes("key=") && !mapBlock.includes("key:")) {
+                    missingKeys++;
+                    issues.push({ severity: "error", message: "JSX in .map() without key prop", file: f.path, line: i + 1, rule: "missing-key" });
+                }
+            }
+            // 3. index as key
+            if (/key=\{(?:i|idx|index)\}/.test(trimmed) || /key=\{.*(?:, *(?:i|idx|index)\))/.test(trimmed)) {
+                indexKeys++;
+                issues.push({ severity: "warning", message: "Using index as key — can cause rendering bugs with reorderable lists", file: f.path, line: i + 1, rule: "index-key" });
+            }
+            // 4. Prop spreading ({...props} on DOM elements)
+            if (/\{\.\.\.(?!children)\w+\}/.test(trimmed) && /<[a-z]/.test(trimmed)) {
+                propSpreading++;
+                issues.push({ severity: "warning", message: "Spreading props onto DOM element — can pass unexpected attributes", file: f.path, line: i + 1, rule: "prop-spreading" });
+            }
+            // 5. Inline arrow functions in JSX event handlers (performance)
+            if (/on[A-Z]\w*=\{(?:\(\) =>|function)/.test(trimmed)) {
+                inlineHandlers++;
+            }
+        }
+    }
+    // Only warn about inline handlers if there are many
+    if (inlineHandlers > 15) {
+        issues.push({ severity: "warning", message: `${inlineHandlers} inline arrow functions in JSX handlers — extract to named functions for readability`, rule: "inline-handlers" });
+    }
+    const errors = issues.filter((i) => i.severity === "error").length;
+    const warnings = issues.filter((i) => i.severity === "warning").length;
+    const score = Math.max(0, Math.min(100, 100 - errors * 8 - warnings * 3));
+    return {
+        name: "react",
+        score,
+        grade: gradeFromScore(score),
+        details: { jsxFiles: files.length, conditionalHooks, missingKeys, indexKeys, propSpreading, inlineHandlers },
+        issues,
+        duration: Date.now() - start,
+    };
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vibecodeqa/cli",
-  "version": "0.15.0",
-  "description": "Code health scanner for the AI coding era. 15 checks, zero config, full report.",
+  "version": "0.17.0",
+  "description": "Code health scanner for the AI coding era. 18 checks, zero config, full report.",
   "type": "module",
   "bin": {
     "vcqa": "./dist/cli.js",