@herb-tools/linter 0.6.0 → 0.7.0

package/src/cli/formatters/github-actions-formatter.ts

@@ -1,10 +1,24 @@
+import { Highlighter } from "@herb-tools/highlighter"
+
 import { BaseFormatter } from "./base-formatter.js"
+import { name, version } from "../../../package.json"
 
 import type { Diagnostic } from "@herb-tools/core"
 import type { ProcessedFile } from "../file-processor.js"
 
 // https://docs.github.com/en/actions/reference/workflows-and-actions/workflow-commands
 export class GitHubActionsFormatter extends BaseFormatter {
+  private highlighter: Highlighter
+  private wrapLines: boolean
+  private truncateLines: boolean
+
+  constructor(wrapLines: boolean = true, truncateLines: boolean = false) {
+    super()
+    this.wrapLines = wrapLines
+    this.truncateLines = truncateLines
+    this.highlighter = new Highlighter()
+  }
+
   private static readonly MESSAGE_ESCAPE_MAP: Record<string, string> = {
     '%': '%25',
     '\n': '%0A',
@@ -19,13 +33,39 @@ export class GitHubActionsFormatter extends BaseFormatter {
     ',': '%2C'
   }
 
-  async format(allDiagnostics: ProcessedFile[]): Promise<void> {
-    for (const { filename, offense } of allDiagnostics) {
-      this.formatDiagnostic(filename, offense)
+  async format(allDiagnostics: ProcessedFile[], _isSingleFile: boolean = false): Promise<void> {
+    await this.formatAnnotations(allDiagnostics)
+  }
+
+  async formatAnnotations(allDiagnostics: ProcessedFile[]): Promise<void> {
+    if (allDiagnostics.length === 0) return
+
+    if (!this.highlighter.initialized) {
+      await this.highlighter.initialize()
     }
 
-    if (allDiagnostics.length > 0) {
-      console.log()
+    for (const { filename, offense, content } of allDiagnostics) {
+      const originalNoColor = process.env.NO_COLOR
+      process.env.NO_COLOR = "1"
+
+      let plainCodePreview = ""
+      try {
+        const formatted = this.highlighter.highlightDiagnostic(filename, offense, content, {
+          contextLines: 2,
+          wrapLines: this.wrapLines,
+          truncateLines: this.truncateLines
+        })
+
+        plainCodePreview = formatted.split('\n').slice(1).join('\n')
+      } finally {
+        if (originalNoColor === undefined) {
+          delete process.env.NO_COLOR
+        } else {
+          process.env.NO_COLOR = originalNoColor
+        }
+      }
+
+      this.formatDiagnostic(filename, offense, plainCodePreview)
     }
   }
 
@@ -36,22 +76,35 @@ export class GitHubActionsFormatter extends BaseFormatter {
   }
 
   // GitHub Actions annotation format:
-  // ::{level} file={file},line={line},col={col}::{message}
+  // ::{level} file={file},line={line},col={col},title={title}::{message}
   //
-  private formatDiagnostic(filename: string, diagnostic: Diagnostic): void {
+  private formatDiagnostic(filename: string, diagnostic: Diagnostic, codePreview: string = ""): void {
     const level = diagnostic.severity === "error" ? "error" : "warning"
     const { line, column } = diagnostic.location.start
 
     const escapedFilename = this.escapeParam(filename)
-    const message = this.escapeMessage(diagnostic.message)
+    let message = diagnostic.message
+
+    if (diagnostic.code) {
+      message += ` [${diagnostic.code}]`
+    }
 
-    let fullMessage = message
+    if (codePreview) {
+      message += "\n\n" + codePreview
+    }
+
+    const escapedMessage = this.escapeMessage(message)
+
+    let annotations = `file=${escapedFilename},line=${line},col=${column}`
 
     if (diagnostic.code) {
-      fullMessage += ` [${diagnostic.code}]`
+      const title = `${diagnostic.code} • ${name}@${version}`
+      const escapedTitle = this.escapeParam(title)
+
+      annotations += `,title=${escapedTitle}`
     }
 
-    console.log(`\n::${level} file=${escapedFilename},line=${line},col=${column}::${fullMessage}`)
+    console.log(`\n::${level} ${annotations}::${escapedMessage}`)
   }
 
   private escapeMessage(string: string): string {

package/src/cli/index.ts

@@ -1,4 +1,6 @@
 export { ArgumentParser } from "./argument-parser.js"
 export { FileProcessor } from "./file-processor.js"
 export { SummaryReporter } from "./summary-reporter.js"
+export { OutputManager } from "./output-manager.js"
+
 export * from "./formatters/index.js"

package/src/cli/output-manager.ts

@@ -11,6 +11,7 @@ interface OutputOptions {
   wrapLines: boolean
   truncateLines: boolean
   showTiming: boolean
+  useGitHubActions: boolean
   startTime: number
   startDate: Date
 }
@@ -28,9 +29,30 @@ export class OutputManager {
   async outputResults(results: LintResults, options: OutputOptions): Promise<void> {
     const { allOffenses, files, totalErrors, totalWarnings, filesWithOffenses, ruleCount, ruleOffenses } = results
 
-    if (options.formatOption === "github") {
-      const formatter = new GitHubActionsFormatter()
-      await formatter.format(allOffenses)
+    if (options.useGitHubActions) {
+      const githubFormatter = new GitHubActionsFormatter(options.wrapLines, options.truncateLines)
+      await githubFormatter.formatAnnotations(allOffenses)
+
+      if (options.formatOption !== "json") {
+        const regularFormatter = options.formatOption === "simple"
+          ? new SimpleFormatter()
+          : new DetailedFormatter(options.theme, options.wrapLines, options.truncateLines)
+
+        await regularFormatter.format(allOffenses, files.length === 1)
+
+        this.summaryReporter.displayMostViolatedRules(ruleOffenses)
+        this.summaryReporter.displaySummary({
+          files,
+          totalErrors,
+          totalWarnings,
+          filesWithOffenses,
+          ruleCount,
+          startTime: options.startTime,
+          startDate: options.startDate,
+          showTiming: options.showTiming,
+          ruleOffenses
+        })
+      }
     } else if (options.formatOption === "json") {
       const output: JSONOutput = {
         offenses: allOffenses.map(({ filename, offense }) => ({
@@ -88,7 +110,7 @@ export class OutputManager {
    * Output informational message (like "no files found")
    */
   outputInfo(message: string, options: OutputOptions): void {
-    if (options.formatOption === "github") {
+    if (options.useGitHubActions) {
       // GitHub Actions format doesn't output anything for info messages
     } else if (options.formatOption === "json") {
       const output: JSONOutput = {
@@ -123,7 +145,7 @@ export class OutputManager {
    * Output error message
    */
   outputError(message: string, options: OutputOptions): void {
-    if (options.formatOption === "github") {
+    if (options.useGitHubActions) {
       console.log(`::error::${message}`)
     } else if (options.formatOption === "json") {
       const output: JSONOutput = {

package/src/cli/summary-reporter.ts

@@ -23,14 +23,11 @@ export class SummaryReporter {
     console.log("\n")
     console.log(` ${colorize("Summary:", "bold")}`)
 
-    // Calculate padding for alignment
-    const labelWidth = 12 // Width for the longest label "Offenses"
+    const labelWidth = 12
     const pad = (label: string) => label.padEnd(labelWidth)
 
-    // Checked summary
     console.log(`  ${colorize(pad("Checked"), "gray")} ${colorize(`${files.length} ${this.pluralize(files.length, "file")}`, "cyan")}`)
 
-    // Files summary (for multiple files)
     if (files.length > 1) {
       const filesChecked = files.length
       const filesClean = filesChecked - filesWithOffenses
@@ -52,11 +49,9 @@ export class SummaryReporter {
       }
     }
 
-    // Offenses summary with file count
     let offensesSummary = ""
     const parts = []
 
-    // Build the main part with errors and warnings
     if (totalErrors > 0) {
       parts.push(colorize(colorize(`${totalErrors} ${this.pluralize(totalErrors, "error")}`, "brightRed"), "bold"))
     }
@@ -64,7 +59,6 @@ export class SummaryReporter {
     if (totalWarnings > 0) {
       parts.push(colorize(colorize(`${totalWarnings} ${this.pluralize(totalWarnings, "warning")}`, "brightYellow"), "bold"))
     } else if (totalErrors > 0) {
-      // Show 0 warnings when there are errors but no warnings
       parts.push(colorize(colorize(`${totalWarnings} ${this.pluralize(totalWarnings, "warning")}`, "green"), "bold"))
     }
 
@@ -72,7 +66,7 @@ export class SummaryReporter {
       offensesSummary = colorize(colorize("0 offenses", "green"), "bold")
     } else {
       offensesSummary = parts.join(" | ")
-      // Add total count and file count
+
       let detailText = ""
 
       const totalOffenses = totalErrors + totalWarnings
@@ -86,16 +80,14 @@ export class SummaryReporter {
 
     console.log(`  ${colorize(pad("Offenses"), "gray")} ${offensesSummary}`)
 
-    // Timing information (if enabled)
     if (showTiming) {
       const duration = Date.now() - startTime
-      const timeString = startDate.toTimeString().split(' ')[0] // HH:MM:SS format
+      const timeString = startDate.toTimeString().split(' ')[0]
 
       console.log(`  ${colorize(pad("Start at"), "gray")} ${colorize(timeString, "cyan")}`)
       console.log(`  ${colorize(pad("Duration"), "gray")} ${colorize(`${duration}ms`, "cyan")} ${colorize(colorize(`(${ruleCount} ${this.pluralize(ruleCount, "rule")})`, "gray"), "dim")}`)
     }
 
-    // Success message for all files clean
     if (filesWithOffenses === 0 && files.length > 1) {
       console.log("")
       console.log(` ${colorize("✓", "brightGreen")} ${colorize("All files are clean!", "green")}`)

package/src/cli.ts

@@ -1,47 +1,145 @@
 import { glob } from "glob"
 import { Herb } from "@herb-tools/node-wasm"
+import { existsSync, statSync } from "fs"
+import { dirname, resolve, relative } from "path"
+
 import { ArgumentParser, type FormatOption } from "./cli/argument-parser.js"
 import { FileProcessor } from "./cli/file-processor.js"
 import { OutputManager } from "./cli/output-manager.js"
 
+export * from "./cli/index.js"
+
 export class CLI {
-  private argumentParser = new ArgumentParser()
-  private fileProcessor = new FileProcessor()
-  private outputManager = new OutputManager()
-
-  private exitWithError(message: string, formatOption: FormatOption, exitCode: number = 1) {
-    this.outputManager.outputError(message, { 
-      formatOption, 
-      theme: 'auto', 
-      wrapLines: false, 
-      truncateLines: false, 
-      showTiming: false, 
-      startTime: 0, 
-      startDate: new Date() 
+  protected argumentParser = new ArgumentParser()
+  protected fileProcessor = new FileProcessor()
+  protected outputManager = new OutputManager()
+  protected projectPath: string = process.cwd()
+
+  getProjectPath(): string {
+    return this.projectPath
+  }
+
+  protected findProjectRoot(startPath: string): string {
+    let currentPath = resolve(startPath)
+
+    if (existsSync(currentPath) && statSync(currentPath).isFile()) {
+      currentPath = dirname(currentPath)
+    }
+
+    const projectIndicators = [
+      'package.json',
+      'Gemfile',
+      '.git',
+      'tsconfig.json',
+      'composer.json',
+      'pyproject.toml',
+      'requirements.txt',
+      '.herb.yml'
+    ]
+
+    while (currentPath !== '/') {
+      for (const indicator of projectIndicators) {
+        if (existsSync(resolve(currentPath, indicator))) {
+          return currentPath
+        }
+      }
+
+      const parentPath = dirname(currentPath)
+      if (parentPath === currentPath) {
+        break
+      }
+
+      currentPath = parentPath
+    }
+
+    return existsSync(startPath) && statSync(startPath).isDirectory()
+      ? startPath
+      : dirname(startPath)
+  }
+
+  protected exitWithError(message: string, formatOption: FormatOption, exitCode: number = 1) {
+    this.outputManager.outputError(message, {
+      formatOption,
+      theme: 'auto',
+      wrapLines: false,
+      truncateLines: false,
+      showTiming: false,
+      useGitHubActions: false,
+      startTime: 0,
+      startDate: new Date()
     })
     process.exit(exitCode)
   }
 
-  private exitWithInfo(message: string, formatOption: FormatOption, exitCode: number = 0, timingData?: { startTime: number, startDate: Date, showTiming: boolean }) {
+  protected exitWithInfo(message: string, formatOption: FormatOption, exitCode: number = 0, timingData?: { startTime: number, startDate: Date, showTiming: boolean }) {
     const outputOptions = {
       formatOption,
       theme: 'auto' as const,
       wrapLines: false,
       truncateLines: false,
       showTiming: timingData?.showTiming ?? false,
+      useGitHubActions: false,
       startTime: timingData?.startTime ?? Date.now(),
       startDate: timingData?.startDate ?? new Date()
     }
-    
+
     this.outputManager.outputInfo(message, outputOptions)
     process.exit(exitCode)
   }
 
+  protected determineProjectPath(pattern: string | undefined): void {
+    if (pattern) {
+      const resolvedPattern = resolve(pattern)
+
+      if (existsSync(resolvedPattern)) {
+        const stats = statSync(resolvedPattern)
+
+        if (stats.isDirectory()) {
+          this.projectPath = resolvedPattern
+        } else {
+          this.projectPath = this.findProjectRoot(resolvedPattern)
+        }
+      }
+    }
+  }
+
+  protected adjustPattern(pattern: string | undefined): string {
+    if (!pattern) {
+      return '**/*.html.erb'
+    }
+
+    const resolvedPattern = resolve(pattern)
+
+    if (existsSync(resolvedPattern)) {
+      const stats = statSync(resolvedPattern)
+
+      if (stats.isDirectory()) {
+        return '**/*.html.erb'
+      } else if (stats.isFile()) {
+        return relative(this.projectPath, resolvedPattern)
+      }
+    }
+
+    return pattern
+  }
+
+  protected async beforeProcess(): Promise<void> {
+    await Herb.load()
+  }
+
+  protected async afterProcess(_results: any, _outputOptions: any): Promise<void> {
+    // Hook for subclasses to add custom output after processing
+  }
+
   async run() {
     const startTime = Date.now()
     const startDate = new Date()
 
-    const { pattern, formatOption, showTiming, theme, wrapLines, truncateLines } = this.argumentParser.parse(process.argv)
+    let { pattern, formatOption, showTiming, theme, wrapLines, truncateLines, useGitHubActions } = this.argumentParser.parse(process.argv)
+
+    this.determineProjectPath(pattern)
+
+    pattern = this.adjustPattern(pattern)
 
     const outputOptions = {
       formatOption,
@@ -49,22 +147,29 @@ export class CLI {
       wrapLines,
       truncateLines,
       showTiming,
+      useGitHubActions,
       startTime,
       startDate
     }
 
     try {
-      await Herb.load()
+      await this.beforeProcess()
 
-      const files = await glob(pattern)
+      const files = await glob(pattern, { cwd: this.projectPath })
 
       if (files.length === 0) {
         this.exitWithInfo(`No files found matching pattern: ${pattern}`, formatOption, 0, { startTime, startDate, showTiming })
       }
 
-      const results = await this.fileProcessor.processFiles(files, formatOption)
-      
+      const context = {
+        projectPath: this.projectPath,
+        pattern: pattern
+      }
+
+      const results = await this.fileProcessor.processFiles(files, formatOption, context)
+
       await this.outputManager.outputResults({ ...results, files }, outputOptions)
+      await this.afterProcess(results, outputOptions)
 
       if (results.totalErrors > 0) {
         process.exit(1)

package/src/default-rules.ts

@@ -19,19 +19,21 @@ import { HTMLAvoidBothDisabledAndAriaDisabledRule } from "./rules/html-avoid-bot
 import { HTMLBooleanAttributesNoValueRule } from "./rules/html-boolean-attributes-no-value.js"
 import { HTMLIframeHasTitleRule } from "./rules/html-iframe-has-title.js"
 import { HTMLImgRequireAltRule } from "./rules/html-img-require-alt.js"
-import { HTMLNavigationHasLabelRule } from "./rules/html-navigation-has-label.js"
+// import { HTMLNavigationHasLabelRule } from "./rules/html-navigation-has-label.js"
 import { HTMLNoAriaHiddenOnFocusableRule } from "./rules/html-no-aria-hidden-on-focusable.js"
 // import { HTMLNoBlockInsideInlineRule } from "./rules/html-no-block-inside-inline.js"
 import { HTMLNoDuplicateAttributesRule } from "./rules/html-no-duplicate-attributes.js"
 import { HTMLNoDuplicateIdsRule } from "./rules/html-no-duplicate-ids.js"
+import { HTMLNoEmptyAttributesRule } from "./rules/html-no-empty-attributes.js"
 import { HTMLNoEmptyHeadingsRule } from "./rules/html-no-empty-headings.js"
 import { HTMLNoNestedLinksRule } from "./rules/html-no-nested-links.js"
 import { HTMLNoPositiveTabIndexRule } from "./rules/html-no-positive-tab-index.js"
 import { HTMLNoSelfClosingRule } from "./rules/html-no-self-closing.js"
-import { HTMLNoTitleAttributeRule } from "./rules/html-no-title-attribute.js"
+// import { HTMLNoTitleAttributeRule } from "./rules/html-no-title-attribute.js"
 import { HTMLTagNameLowercaseRule } from "./rules/html-tag-name-lowercase.js"
 import { ParserNoErrorsRule } from "./rules/parser-no-errors.js"
 import { SVGTagNameCapitalizationRule } from "./rules/svg-tag-name-capitalization.js"
+import { HTMLNoUnderscoresInAttributeNamesRule } from "./rules/html-no-underscores-in-attribute-names.js"
 
 export const defaultRules: RuleClass[] = [
   ERBNoEmptyTagsRule,
@@ -53,17 +55,19 @@ export const defaultRules: RuleClass[] = [
   HTMLBooleanAttributesNoValueRule,
   HTMLIframeHasTitleRule,
   HTMLImgRequireAltRule,
-  HTMLNavigationHasLabelRule,
+  // HTMLNavigationHasLabelRule,
   HTMLNoAriaHiddenOnFocusableRule,
   // HTMLNoBlockInsideInlineRule,
   HTMLNoDuplicateAttributesRule,
   HTMLNoDuplicateIdsRule,
+  HTMLNoEmptyAttributesRule,
   HTMLNoEmptyHeadingsRule,
   HTMLNoNestedLinksRule,
   HTMLNoPositiveTabIndexRule,
   HTMLNoSelfClosingRule,
-  HTMLNoTitleAttributeRule,
+  // HTMLNoTitleAttributeRule,
   HTMLTagNameLowercaseRule,
   ParserNoErrorsRule,
   SVGTagNameCapitalizationRule,
+  HTMLNoUnderscoresInAttributeNamesRule,
 ]

package/src/linter.ts

@@ -4,9 +4,9 @@ import type { RuleClass, Rule, ParserRule, LexerRule, SourceRule, LintResult, Li
 import type { HerbBackend } from "@herb-tools/core"
 
 export class Linter {
-  private rules: RuleClass[]
-  private herb: HerbBackend
-  private offenses: LintOffense[]
+  protected rules: RuleClass[]
+  protected herb: HerbBackend
+  protected offenses: LintOffense[]
 
   /**
    * Creates a new Linter instance.
@@ -23,7 +23,7 @@ export class Linter {
    * Returns the default set of rule classes used by the linter.
    * @returns Array of rule classes
    */
-  private getDefaultRules(): RuleClass[] {
+  protected getDefaultRules(): RuleClass[] {
     return defaultRules
   }
 
@@ -34,14 +34,14 @@ export class Linter {
   /**
    * Type guard to check if a rule is a LexerRule
    */
-  private isLexerRule(rule: Rule): rule is LexerRule {
+  protected isLexerRule(rule: Rule): rule is LexerRule {
     return (rule.constructor as any).type === "lexer"
   }
 
   /**
    * Type guard to check if a rule is a SourceRule
    */
-  private isSourceRule(rule: Rule): rule is SourceRule {
+  protected isSourceRule(rule: Rule): rule is SourceRule {
     return (rule.constructor as any).type === "source"
   }
 

package/src/rules/erb-no-silent-tag-in-attribute-name.ts

@@ -23,7 +23,7 @@ class ERBNoSilentTagInAttributeNameVisitor extends BaseRuleVisitor {
   private isSilentERBTag(node: ERBContentNode): boolean {
     const silentTags = ["<%", "<%-", "<%#"]
 
-    return silentTags.includes(node.tag_opening?.value || "")
+    return silentTags.includes(node.tag_opening?.value || "")
   }
 }