react-code-smell-detector 1.1.1 → 1.2.0

package/README.md

@@ -7,7 +7,11 @@ A CLI tool that analyzes React projects and detects common code smells, providin
 - 🔍 **Detect Code Smells**: Identifies common React anti-patterns
 - 📊 **Technical Debt Score**: Grades your codebase from A to F
 - 💡 **Refactoring Suggestions**: Actionable recommendations for each issue
-- 📝 **Multiple Output Formats**: Console (colored), JSON, and Markdown
+- 📝 **Multiple Output Formats**: Console (colored), JSON, Markdown, and HTML
+- 🔒 **Security Scanning**: Detects XSS vulnerabilities, eval usage, exposed secrets
+- ♿ **Accessibility Checks**: Missing alt text, labels, ARIA attributes
+- 🐛 **Debug Cleanup**: console.log, debugger, TODO/FIXME detection
+- 🤖 **CI/CD Ready**: Exit codes and flags for pipeline integration
 
 ### Detected Code Smells
 
@@ -18,6 +22,10 @@ A CLI tool that analyzes React projects and detects common code smells, providin
 | **Large Components** | Components over 300 lines, deep JSX nesting |
 | **Unmemoized Calculations** | `.map()`, `.filter()`, `.reduce()`, `JSON.parse()` without `useMemo` |
 | **Inline Functions** | Callbacks defined inline in JSX props |
+| **Security Issues** | dangerouslySetInnerHTML, eval(), innerHTML, exposed API keys |
+| **Accessibility** | Missing alt text, form labels, keyboard handlers, semantic HTML |
+| **Debug Statements** | console.log, debugger statements, TODO/FIXME comments |
+| **Framework-Specific** | Next.js, React Native, Node.js, TypeScript issues |
 
 ## Installation
 
@@ -56,6 +64,9 @@ react-smell ./src -f json
 
 # Markdown (for documentation)
 react-smell ./src -f markdown -o report.md
+
+# HTML (beautiful visual report)
+react-smell ./src -f html -o report.html
 ```
 
 ### Configuration
@@ -81,9 +92,11 @@ Or create manually:
 
 | Option | Description | Default |
 |--------|-------------|---------|
-| `-f, --format <format>` | Output format: console, json, markdown | `console` |
+| `-f, --format <format>` | Output format: console, json, markdown, html | `console` |
 | `-s, --snippets` | Show code snippets in output | `false` |
 | `-c, --config <file>` | Path to config file | `.smellrc.json` |
+| `--ci` | CI mode: exit with code 1 if any issues | `false` |
+| `--fail-on <severity>` | Exit code 1 threshold: error, warning, info | `error` |
 | `--max-effects <number>` | Max useEffects per component | `3` |
 | `--max-props <number>` | Max props before warning | `7` |
 | `--max-lines <number>` | Max lines per component | `300` |
@@ -143,17 +156,62 @@ const report = reportResults(result, {
 
 ## CI/CD Integration
 
-Use the JSON output format for CI pipelines:
+The tool provides flexible exit codes for CI/CD pipelines:
+
+```bash
+# Fail on any issues (strict mode)
+react-smell ./src --ci
+
+# Fail on warnings and errors (default: errors only)
+react-smell ./src --fail-on warning
+
+# Generate HTML report and fail on errors
+react-smell ./src -f html -o report.html --fail-on error
+```
+
+### GitHub Actions Example
 
 ```yaml
-# GitHub Actions example
-- name: Check code smells
-  run: |
-    npx react-smell ./src -f json > smell-report.json
-    if [ $(jq '.summary.smellsBySeverity.error' smell-report.json) -gt 0 ]; then
-      echo "Code smell errors found!"
-      exit 1
-    fi
+name: Code Quality
+
+on: [push, pull_request]
+
+jobs:
+  code-smells:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+      
+      - name: Install dependencies
+        run: npm ci
+      
+      - name: Check code smells
+        run: npx react-smell ./src -f html -o smell-report.html --fail-on warning
+      
+      - name: Upload report
+        uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: code-smell-report
+          path: smell-report.html
+```
+
+## Ignoring Issues
+
+Use `@smell-ignore` comments to suppress specific issues:
+
+```tsx
+// @smell-ignore
+console.log('This debug statement is ignored');
+
+// @smell-ignore debug-statement
+console.log('Only ignores debug-statement type');
+
+// @smell-ignore *
+const risky = eval('1+1'); // All issues on next line ignored
 ```
 
 ## Technical Debt Score

package/dist/analyzer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"analyzer.d.ts","sourceRoot":"","sources":["../src/analyzer.ts"],"names":[],"mappings":"AAqBA,OAAO,EACL,cAAc,EAMd,cAAc,EAIf,MAAM,kBAAkB,CAAC;AAE1B,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CAClC;AAED,wBAAsB,cAAc,CAAC,OAAO,EAAE,eAAe,GAAG,OAAO,CAAC,cAAc,CAAC,CA0CtF;AAyLD,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"analyzer.d.ts","sourceRoot":"","sources":["../src/analyzer.ts"],"names":[],"mappings":"AAwBA,OAAO,EACL,cAAc,EAMd,cAAc,EAIf,MAAM,kBAAkB,CAAC;AAE1B,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CAClC;AAED,wBAAsB,cAAc,CAAC,OAAO,EAAE,eAAe,GAAG,OAAO,CAAC,cAAc,CAAC,CA0CtF;AA6OD,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/analyzer.js

@@ -1,7 +1,7 @@
 import fg from 'fast-glob';
 import path from 'path';
 import { parseFile } from './parser/index.js';
-import { detectUseEffectOveruse, detectPropDrilling, analyzePropDrillingDepth, detectLargeComponent, detectUnmemoizedCalculations, detectMissingKeys, detectHooksRulesViolations, detectDependencyArrayIssues, detectNestedTernaries, detectDeadCode, detectMagicValues, detectNextjsIssues, detectReactNativeIssues, detectNodejsIssues, detectJavascriptIssues, detectTypescriptIssues, } from './detectors/index.js';
+import { detectUseEffectOveruse, detectPropDrilling, analyzePropDrillingDepth, detectLargeComponent, detectUnmemoizedCalculations, detectMissingKeys, detectHooksRulesViolations, detectDependencyArrayIssues, detectNestedTernaries, detectDeadCode, detectMagicValues, detectNextjsIssues, detectReactNativeIssues, detectNodejsIssues, detectJavascriptIssues, detectTypescriptIssues, detectDebugStatements, detectSecurityIssues, detectAccessibilityIssues, } from './detectors/index.js';
 import { DEFAULT_CONFIG, } from './types/index.js';
 export async function analyzeProject(options) {
     const { rootDir, include = ['**/*.tsx', '**/*.jsx'], exclude = ['**/node_modules/**', '**/dist/**', '**/build/**', '**/*.test.*', '**/*.spec.*'], config: userConfig = {}, } = options;
@@ -74,16 +74,49 @@ function analyzeFile(parseResult, filePath, config) {
         smells.push(...detectNodejsIssues(component, filePath, sourceCode, config, imports));
         smells.push(...detectJavascriptIssues(component, filePath, sourceCode, config));
         smells.push(...detectTypescriptIssues(component, filePath, sourceCode, config));
+        // Debug, Security, Accessibility
+        smells.push(...detectDebugStatements(component, filePath, sourceCode, config));
+        smells.push(...detectSecurityIssues(component, filePath, sourceCode, config));
+        smells.push(...detectAccessibilityIssues(component, filePath, sourceCode, config));
     });
     // Run cross-component analysis
     smells.push(...analyzePropDrillingDepth(components, filePath, sourceCode, config));
+    // Filter out smells with @smell-ignore comments
+    const filteredSmells = filterIgnoredSmells(smells, sourceCode);
     return {
         file: filePath,
         components: componentInfos,
-        smells,
+        smells: filteredSmells,
         imports,
     };
 }
+/**
+ * Filter out smells that have @smell-ignore comment on the preceding line
+ * Supports: // @smell-ignore, block comments with @smell-ignore, @smell-ignore [type]
+ */
+function filterIgnoredSmells(smells, sourceCode) {
+    const lines = sourceCode.split('\n');
+    return smells.filter(smell => {
+        if (smell.line <= 1)
+            return true;
+        // Check the line before and the same line for ignore comments
+        const lineIndex = smell.line - 1; // Convert to 0-indexed
+        const prevLine = lines[lineIndex - 1]?.trim() || '';
+        const currentLine = lines[lineIndex]?.trim() || '';
+        // Check for @smell-ignore patterns
+        const ignorePatterns = [
+            /@smell-ignore\s*$/, // @smell-ignore (ignore all)
+            /@smell-ignore\s+\*/, // @smell-ignore * (ignore all)
+            new RegExp(`@smell-ignore\\s+${smell.type}`), // @smell-ignore [specific-type]
+        ];
+        for (const pattern of ignorePatterns) {
+            if (pattern.test(prevLine) || pattern.test(currentLine)) {
+                return false; // Filter out this smell
+            }
+        }
+        return true; // Keep this smell
+    });
+}
 function calculateSummary(files) {
     const smellsByType = {
         'useEffect-overuse': 0,
@@ -124,6 +157,19 @@ function calculateSummary(files) {
         'ts-missing-return-type': 0,
         'ts-non-null-assertion': 0,
         'ts-type-assertion': 0,
+        // Debug statements
+        'debug-statement': 0,
+        'todo-comment': 0,
+        // Security
+        'security-xss': 0,
+        'security-eval': 0,
+        'security-secrets': 0,
+        // Accessibility
+        'a11y-missing-alt': 0,
+        'a11y-missing-label': 0,
+        'a11y-interactive-role': 0,
+        'a11y-keyboard': 0,
+        'a11y-semantic': 0,
     };
     const smellsBySeverity = {
         error: 0,

package/dist/cli.js

@@ -5,16 +5,19 @@ import ora from 'ora';
 import path from 'path';
 import { analyzeProject, DEFAULT_CONFIG } from './analyzer.js';
 import { reportResults } from './reporter.js';
+import { generateHTMLReport } from './htmlReporter.js';
 import fs from 'fs/promises';
 const program = new Command();
 program
     .name('react-smell')
     .description('Detect code smells in React projects')
-    .version('1.0.0')
+    .version('1.2.0')
     .argument('[directory]', 'Directory to analyze', '.')
-    .option('-f, --format <format>', 'Output format: console, json, markdown', 'console')
+    .option('-f, --format <format>', 'Output format: console, json, markdown, html', 'console')
     .option('-s, --snippets', 'Show code snippets in output', false)
     .option('-c, --config <file>', 'Path to config file')
+    .option('--ci', 'CI mode: exit with code 1 if any issues found')
+    .option('--fail-on <severity>', 'Exit with code 1 if issues of this severity or higher (error, warning, info)', 'error')
     .option('--max-effects <number>', 'Max useEffects per component', parseInt)
     .option('--max-props <number>', 'Max props before warning', parseInt)
     .option('--max-lines <number>', 'Max lines per component', parseInt)
@@ -63,11 +66,21 @@ program
             config,
         });
         spinner.stop();
-        const output = reportResults(result, {
-            format: options.format,
-            showCodeSnippets: options.snippets,
-            rootDir,
-        });
+        let output;
+        if (options.format === 'html') {
+            output = generateHTMLReport(result, rootDir);
+            // Auto-set output file for HTML if not specified
+            if (!options.output) {
+                options.output = 'code-smell-report.html';
+            }
+        }
+        else {
+            output = reportResults(result, {
+                format: options.format,
+                showCodeSnippets: options.snippets,
+                rootDir,
+            });
+        }
         if (options.output) {
             const outputPath = path.resolve(process.cwd(), options.output);
             await fs.writeFile(outputPath, output, 'utf-8');
@@ -76,8 +89,29 @@ program
         else {
             console.log(output);
         }
-        // Exit with error code if there are errors
-        if (result.summary.smellsBySeverity.error > 0) {
+        // CI/CD exit code handling
+        const { smellsBySeverity } = result.summary;
+        let shouldFail = false;
+        if (options.ci) {
+            // CI mode: fail on any issues
+            shouldFail = result.summary.totalSmells > 0;
+        }
+        else {
+            // Check fail-on threshold
+            switch (options.failOn) {
+                case 'info':
+                    shouldFail = smellsBySeverity.info > 0 || smellsBySeverity.warning > 0 || smellsBySeverity.error > 0;
+                    break;
+                case 'warning':
+                    shouldFail = smellsBySeverity.warning > 0 || smellsBySeverity.error > 0;
+                    break;
+                case 'error':
+                default:
+                    shouldFail = smellsBySeverity.error > 0;
+                    break;
+            }
+        }
+        if (shouldFail) {
             process.exit(1);
         }
     }

package/dist/detectors/accessibility.d.ts

@@ -0,0 +1,12 @@
+import { ParsedComponent } from '../parser/index.js';
+import { CodeSmell, DetectorConfig } from '../types/index.js';
+/**
+ * Detects accessibility (a11y) issues:
+ * - Images without alt text
+ * - Form inputs without labels
+ * - Missing ARIA attributes on interactive elements
+ * - Click handlers without keyboard support
+ * - Improper heading hierarchy
+ */
+export declare function detectAccessibilityIssues(component: ParsedComponent, filePath: string, sourceCode: string, config?: DetectorConfig): CodeSmell[];
+//# sourceMappingURL=accessibility.d.ts.map

package/dist/detectors/accessibility.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accessibility.d.ts","sourceRoot":"","sources":["../../src/detectors/accessibility.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAkB,MAAM,oBAAoB,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,cAAc,EAAkB,MAAM,mBAAmB,CAAC;AAE9E;;;;;;;GAOG;AACH,wBAAgB,yBAAyB,CACvC,SAAS,EAAE,eAAe,EAC1B,QAAQ,EAAE,MAAM,EAChB,UAAU,EAAE,MAAM,EAClB,MAAM,GAAE,cAA+B,GACtC,SAAS,EAAE,CAkMb"}

package/dist/detectors/accessibility.js

@@ -0,0 +1,191 @@
+import * as t from '@babel/types';
+import { getCodeSnippet } from '../parser/index.js';
+import { DEFAULT_CONFIG } from '../types/index.js';
+/**
+ * Detects accessibility (a11y) issues:
+ * - Images without alt text
+ * - Form inputs without labels
+ * - Missing ARIA attributes on interactive elements
+ * - Click handlers without keyboard support
+ * - Improper heading hierarchy
+ */
+export function detectAccessibilityIssues(component, filePath, sourceCode, config = DEFAULT_CONFIG) {
+    if (!config.checkAccessibility)
+        return [];
+    const smells = [];
+    component.path.traverse({
+        JSXOpeningElement(path) {
+            if (!t.isJSXIdentifier(path.node.name))
+                return;
+            const elementName = path.node.name.name;
+            const attributes = path.node.attributes;
+            const loc = path.node.loc;
+            const line = loc?.start.line || 0;
+            // Helper to check if attribute exists
+            const hasAttr = (name) => {
+                return attributes.some(attr => {
+                    if (t.isJSXAttribute(attr) && t.isJSXIdentifier(attr.name)) {
+                        return attr.name.name === name;
+                    }
+                    // Handle spread attributes - assume they might contain the attribute
+                    return t.isJSXSpreadAttribute(attr);
+                });
+            };
+            // Helper to get attribute value
+            const getAttrValue = (name) => {
+                for (const attr of attributes) {
+                    if (t.isJSXAttribute(attr) && t.isJSXIdentifier(attr.name) && attr.name.name === name) {
+                        if (t.isStringLiteral(attr.value)) {
+                            return attr.value.value;
+                        }
+                    }
+                }
+                return null;
+            };
+            // Check for images without alt text
+            if (elementName === 'img') {
+                if (!hasAttr('alt')) {
+                    smells.push({
+                        type: 'a11y-missing-alt',
+                        severity: 'error',
+                        message: `<img> missing alt attribute in "${component.name}"`,
+                        file: filePath,
+                        line,
+                        column: loc?.start.column || 0,
+                        suggestion: 'Add alt="description" for content images, or alt="" for decorative images',
+                        codeSnippet: getCodeSnippet(sourceCode, line),
+                    });
+                }
+                else {
+                    const altValue = getAttrValue('alt');
+                    if (altValue !== null && altValue.toLowerCase().includes('image')) {
+                        smells.push({
+                            type: 'a11y-missing-alt',
+                            severity: 'info',
+                            message: `<img> alt text shouldn't contain "image" - it's redundant`,
+                            file: filePath,
+                            line,
+                            column: loc?.start.column || 0,
+                            suggestion: 'Describe what the image shows, not that it is an image',
+                            codeSnippet: getCodeSnippet(sourceCode, line),
+                        });
+                    }
+                }
+            }
+            // Check for form inputs without associated labels
+            if (elementName === 'input' || elementName === 'textarea' || elementName === 'select') {
+                const inputType = getAttrValue('type') || 'text';
+                // Skip hidden inputs
+                if (inputType === 'hidden')
+                    return;
+                const hasLabel = hasAttr('aria-label') ||
+                    hasAttr('aria-labelledby') ||
+                    hasAttr('id'); // Assume id might be linked to a label
+                if (!hasLabel) {
+                    smells.push({
+                        type: 'a11y-missing-label',
+                        severity: 'warning',
+                        message: `<${elementName}> without accessible label in "${component.name}"`,
+                        file: filePath,
+                        line,
+                        column: loc?.start.column || 0,
+                        suggestion: 'Add aria-label, aria-labelledby, or associate with a <label> element',
+                        codeSnippet: getCodeSnippet(sourceCode, line),
+                    });
+                }
+            }
+            // Check for interactive divs/spans without proper role and keyboard support
+            if (elementName === 'div' || elementName === 'span') {
+                const hasOnClick = hasAttr('onClick');
+                const hasRole = hasAttr('role');
+                const hasTabIndex = hasAttr('tabIndex');
+                const hasKeyboardHandler = hasAttr('onKeyDown') || hasAttr('onKeyUp') || hasAttr('onKeyPress');
+                if (hasOnClick) {
+                    if (!hasRole) {
+                        smells.push({
+                            type: 'a11y-interactive-role',
+                            severity: 'warning',
+                            message: `Clickable <${elementName}> without role attribute in "${component.name}"`,
+                            file: filePath,
+                            line,
+                            column: loc?.start.column || 0,
+                            suggestion: 'Add role="button" or use a <button> element instead',
+                            codeSnippet: getCodeSnippet(sourceCode, line),
+                        });
+                    }
+                    if (!hasTabIndex) {
+                        smells.push({
+                            type: 'a11y-interactive-role',
+                            severity: 'warning',
+                            message: `Clickable <${elementName}> not focusable in "${component.name}"`,
+                            file: filePath,
+                            line,
+                            column: loc?.start.column || 0,
+                            suggestion: 'Add tabIndex={0} to make the element focusable',
+                            codeSnippet: getCodeSnippet(sourceCode, line),
+                        });
+                    }
+                    if (!hasKeyboardHandler) {
+                        smells.push({
+                            type: 'a11y-keyboard',
+                            severity: 'info',
+                            message: `Clickable <${elementName}> without keyboard handler in "${component.name}"`,
+                            file: filePath,
+                            line,
+                            column: loc?.start.column || 0,
+                            suggestion: 'Add onKeyDown to handle Enter/Space for keyboard users',
+                            codeSnippet: getCodeSnippet(sourceCode, line),
+                        });
+                    }
+                }
+            }
+            // Check for anchor tags without href (should be buttons)
+            if (elementName === 'a') {
+                if (!hasAttr('href')) {
+                    smells.push({
+                        type: 'a11y-semantic',
+                        severity: 'warning',
+                        message: `<a> without href should be a <button> in "${component.name}"`,
+                        file: filePath,
+                        line,
+                        column: loc?.start.column || 0,
+                        suggestion: 'Use <button> for actions and <a href="..."> for navigation',
+                        codeSnippet: getCodeSnippet(sourceCode, line),
+                    });
+                }
+            }
+            // Check for proper button usage
+            if (elementName === 'button') {
+                if (!hasAttr('type')) {
+                    smells.push({
+                        type: 'a11y-semantic',
+                        severity: 'info',
+                        message: `<button> should have explicit type attribute`,
+                        file: filePath,
+                        line,
+                        column: loc?.start.column || 0,
+                        suggestion: 'Add type="button" or type="submit" to clarify button behavior',
+                        codeSnippet: getCodeSnippet(sourceCode, line),
+                    });
+                }
+            }
+            // Check for icons that might need labels
+            if (elementName === 'svg' || elementName === 'Icon' || elementName.endsWith('Icon')) {
+                const hasAriaLabel = hasAttr('aria-label') || hasAttr('aria-hidden') || hasAttr('title');
+                if (!hasAriaLabel) {
+                    smells.push({
+                        type: 'a11y-missing-label',
+                        severity: 'info',
+                        message: `Icon/SVG may need aria-label or aria-hidden in "${component.name}"`,
+                        file: filePath,
+                        line,
+                        column: loc?.start.column || 0,
+                        suggestion: 'Add aria-label for meaningful icons, or aria-hidden="true" for decorative ones',
+                        codeSnippet: getCodeSnippet(sourceCode, line),
+                    });
+                }
+            }
+        },
+    });
+    return smells;
+}

package/dist/detectors/debug.d.ts

@@ -0,0 +1,10 @@
+import { ParsedComponent } from '../parser/index.js';
+import { CodeSmell, DetectorConfig } from '../types/index.js';
+/**
+ * Detects debug statements that should be removed:
+ * - console.log/warn/error/debug
+ * - debugger statements
+ * - TODO/FIXME/HACK comments (detected via source code)
+ */
+export declare function detectDebugStatements(component: ParsedComponent, filePath: string, sourceCode: string, config?: DetectorConfig): CodeSmell[];
+//# sourceMappingURL=debug.d.ts.map

package/dist/detectors/debug.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"debug.d.ts","sourceRoot":"","sources":["../../src/detectors/debug.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAkB,MAAM,oBAAoB,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,cAAc,EAAkB,MAAM,mBAAmB,CAAC;AAE9E;;;;;GAKG;AACH,wBAAgB,qBAAqB,CACnC,SAAS,EAAE,eAAe,EAC1B,QAAQ,EAAE,MAAM,EAChB,UAAU,EAAE,MAAM,EAClB,MAAM,GAAE,cAA+B,GACtC,SAAS,EAAE,CAuFb"}

package/dist/detectors/debug.js

@@ -0,0 +1,87 @@
+import * as t from '@babel/types';
+import { getCodeSnippet } from '../parser/index.js';
+import { DEFAULT_CONFIG } from '../types/index.js';
+/**
+ * Detects debug statements that should be removed:
+ * - console.log/warn/error/debug
+ * - debugger statements
+ * - TODO/FIXME/HACK comments (detected via source code)
+ */
+export function detectDebugStatements(component, filePath, sourceCode, config = DEFAULT_CONFIG) {
+    if (!config.checkDebugStatements)
+        return [];
+    const smells = [];
+    const reportedLines = new Set();
+    // Detect console.* calls
+    component.path.traverse({
+        CallExpression(path) {
+            const { callee } = path.node;
+            if (t.isMemberExpression(callee) &&
+                t.isIdentifier(callee.object) &&
+                callee.object.name === 'console') {
+                const method = t.isIdentifier(callee.property) ? callee.property.name : '';
+                const debugMethods = ['log', 'warn', 'error', 'debug', 'info', 'trace', 'dir', 'table'];
+                if (debugMethods.includes(method)) {
+                    const loc = path.node.loc;
+                    const line = loc?.start.line || 0;
+                    if (!reportedLines.has(line)) {
+                        reportedLines.add(line);
+                        smells.push({
+                            type: 'debug-statement',
+                            severity: 'warning',
+                            message: `console.${method}() should be removed before production`,
+                            file: filePath,
+                            line,
+                            column: loc?.start.column || 0,
+                            suggestion: 'Remove console statement or use a logging library with environment-based filtering',
+                            codeSnippet: getCodeSnippet(sourceCode, line),
+                        });
+                    }
+                }
+            }
+        },
+        // Detect debugger statements
+        DebuggerStatement(path) {
+            const loc = path.node.loc;
+            smells.push({
+                type: 'debug-statement',
+                severity: 'error',
+                message: 'debugger statement must be removed before production',
+                file: filePath,
+                line: loc?.start.line || 0,
+                column: loc?.start.column || 0,
+                suggestion: 'Remove the debugger statement',
+                codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
+            });
+        },
+    });
+    // Detect TODO/FIXME/HACK comments in source
+    const todoPatterns = [
+        { pattern: /\/\/\s*(TODO|FIXME|HACK|XXX|BUG)[:.\s]/gi, type: 'todo-comment' },
+        { pattern: /\/\*\s*(TODO|FIXME|HACK|XXX|BUG)[:.\s]/gi, type: 'todo-comment' },
+    ];
+    const lines = sourceCode.split('\n');
+    lines.forEach((line, index) => {
+        const lineNum = index + 1;
+        // Only check within component bounds
+        if (lineNum < component.startLine || lineNum > component.endLine)
+            return;
+        todoPatterns.forEach(({ pattern }) => {
+            const match = line.match(pattern);
+            if (match) {
+                const tag = match[0].replace(/[/\*\s:]/g, '').toUpperCase();
+                smells.push({
+                    type: 'todo-comment',
+                    severity: 'info',
+                    message: `${tag} comment found in "${component.name}"`,
+                    file: filePath,
+                    line: lineNum,
+                    column: 0,
+                    suggestion: `Address the ${tag} or create a ticket to track it`,
+                    codeSnippet: getCodeSnippet(sourceCode, lineNum),
+                });
+            }
+        });
+    });
+    return smells;
+}

package/dist/detectors/index.d.ts

@@ -13,4 +13,7 @@ export { detectReactNativeIssues } from './reactNative.js';
 export { detectNodejsIssues } from './nodejs.js';
 export { detectJavascriptIssues } from './javascript.js';
 export { detectTypescriptIssues } from './typescript.js';
+export { detectDebugStatements } from './debug.js';
+export { detectSecurityIssues } from './security.js';
+export { detectAccessibilityIssues } from './accessibility.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/detectors/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/detectors/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AACjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,4BAA4B,EAAE,MAAM,kBAAkB,CAAC;AAChE,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,0BAA0B,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,2BAA2B,EAAE,MAAM,sBAAsB,CAAC;AACnE,OAAO,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AACpE,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,uBAAuB,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/detectors/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AACjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,4BAA4B,EAAE,MAAM,kBAAkB,CAAC;AAChE,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,0BAA0B,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,2BAA2B,EAAE,MAAM,sBAAsB,CAAC;AACnE,OAAO,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AACpE,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,uBAAuB,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAEzD,OAAO,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AACnD,OAAO,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/detectors/index.js

@@ -14,3 +14,7 @@ export { detectReactNativeIssues } from './reactNative.js';
 export { detectNodejsIssues } from './nodejs.js';
 export { detectJavascriptIssues } from './javascript.js';
 export { detectTypescriptIssues } from './typescript.js';
+// Debug, Security, Accessibility
+export { detectDebugStatements } from './debug.js';
+export { detectSecurityIssues } from './security.js';
+export { detectAccessibilityIssues } from './accessibility.js';

package/dist/detectors/security.d.ts

@@ -0,0 +1,12 @@
+import { ParsedComponent } from '../parser/index.js';
+import { CodeSmell, DetectorConfig } from '../types/index.js';
+/**
+ * Detects security vulnerabilities:
+ * - dangerouslySetInnerHTML usage
+ * - eval() and Function() constructor
+ * - innerHTML assignments
+ * - Unsafe URLs (javascript:, data:)
+ * - Exposed secrets/API keys
+ */
+export declare function detectSecurityIssues(component: ParsedComponent, filePath: string, sourceCode: string, config?: DetectorConfig): CodeSmell[];
+//# sourceMappingURL=security.d.ts.map

package/dist/detectors/security.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"security.d.ts","sourceRoot":"","sources":["../../src/detectors/security.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAkB,MAAM,oBAAoB,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,cAAc,EAAkB,MAAM,mBAAmB,CAAC;AAE9E;;;;;;;GAOG;AACH,wBAAgB,oBAAoB,CAClC,SAAS,EAAE,eAAe,EAC1B,QAAQ,EAAE,MAAM,EAChB,UAAU,EAAE,MAAM,EAClB,MAAM,GAAE,cAA+B,GACtC,SAAS,EAAE,CAiKb"}