packages/babel-code-frame/src/common.ts - main - githubmirror/babel

packages/babel-code-frame/src/common.ts
208 строк5 KB
Nehemiya Wickramasinghe
breaking(code-frame): use 0-based columns to match Babel AST locations (#1… (#17849)
11 май 2026, 16:38
11 май 2026, 16:38e77fa07
import type { Defs } from "./defs";

type Location = {
  column: number;
  line: number;
};

export type NodeLocation = {
  end?: Location;
  start: Location;
};

export interface Options {
  /** Syntax highlight the code as JavaScript for terminals. default: false */
  highlightCode?: boolean;
  /**  The number of lines to show above the error. default: 2 */
  linesAbove?: number;
  /**  The number of lines to show below the error. default: 3 */
  linesBelow?: number;

  startLine?: number;
  /**
   * Forcibly syntax highlight the code as JavaScript (for non-terminals);
   * overrides highlightCode.
   * default: false
   */
  forceColor?: boolean;
  /**
   * Pass in a string to be displayed inline (if possible) next to the
   * highlighted location in the code. If it can't be positioned inline,
   * it will be placed above the code frame.
   * default: nothing
   */
  message?: string;
}

/**
 * RegExp to test for newlines in terminal.
 */

export const NEWLINE = /\r\n|[\n\r\u2028\u2029]/;

/**
 * Extract what lines should be marked and highlighted.
 */

type MarkerLines = Record<number, true | [number, number]>;

export function getMarkerLines(
  loc: NodeLocation,
  source: string[],
  opts: Options,
  startLineBaseZero: number,
): {
  start: number;
  end: number;
  markerLines: MarkerLines;
} {
  const startLoc: Location = {
    // @ts-expect-error default value
    column: null,
    // @ts-expect-error default value
    line: -1,
    ...loc.start,
  };
  const endLoc: Location = {
    ...startLoc,
    ...loc.end,
  };
  const { linesAbove = 2, linesBelow = 3 } = opts || {};
  const startLine = startLoc.line - startLineBaseZero;
  const startColumn = startLoc.column;
  const endLine = endLoc.line - startLineBaseZero;
  const endColumn = endLoc.column;

  let start = Math.max(startLine - (linesAbove + 1), 0);
  let end = Math.min(source.length, endLine + linesBelow);

  if (startLine === -1) {
    start = 0;
  }

  if (endLine === -1) {
    end = source.length;
  }

  const lineDiff = endLine - startLine;
  const markerLines: MarkerLines = {};

  if (lineDiff) {
    for (let i = 0; i <= lineDiff; i++) {
      const lineNumber = i + startLine;

      if (startColumn == null) {
        markerLines[lineNumber] = true;
      } else if (i === 0) {
        const sourceLength = source[lineNumber - 1].length;

        markerLines[lineNumber] = [startColumn, sourceLength - startColumn];
      } else if (i === lineDiff) {
        markerLines[lineNumber] = [0, endColumn];
      } else {
        const sourceLength = source[lineNumber - 1].length;

        markerLines[lineNumber] = [0, sourceLength];
      }
    }
  } else {
    if (startColumn === endColumn) {
      if (startColumn != null) {
        markerLines[startLine] = [startColumn, 0];
      } else {
        markerLines[startLine] = true;
      }
    } else {
      // Defensive: if either column is missing, normalize to avoid NaN.
      const safeStart = startColumn ?? 0;
      const safeEnd = endColumn ?? safeStart;
      markerLines[startLine] = [safeStart, safeEnd - safeStart];
    }
  }

  return { start, end, markerLines };
}

export function _codeFrameColumns(
  rawLines: string,
  loc: NodeLocation,
  opts: Options = {},
  colorOpts?: {
    defs: Pick<Defs, "gutter" | "marker" | "message" | "reset">;
    highlight: (code: string) => string;
  },
): string {
  const { defs, highlight } = colorOpts || {
    defs: {
      gutter: String,
      marker: String,
      message: String,
      reset: String,
    },
    highlight: String,
  };

  const startLineBaseZero = (opts.startLine || 1) - 1;

  const lines = rawLines.split(NEWLINE);
  const { start, end, markerLines } = getMarkerLines(
    loc,
    lines,
    opts,
    startLineBaseZero,
  );
  const hasColumns = loc.start && typeof loc.start.column === "number";

  const numberMaxWidth = String(end + startLineBaseZero).length;

  const highlightedLines = highlight(rawLines);

  let frame = highlightedLines
    .split(NEWLINE, end)
    .slice(start, end)
    .map((line, index) => {
      const number = start + 1 + index;
      const paddedNumber = ` ${number + startLineBaseZero}`.slice(
        -numberMaxWidth,
      );
      const gutter = ` ${paddedNumber} |`;
      const hasMarker = markerLines[number];
      const lastMarkerLine = !markerLines[number + 1];
      if (hasMarker) {
        let markerLine = "";
        if (Array.isArray(hasMarker)) {
          const markerSpacing = line
            .slice(0, hasMarker[0])
            .replace(/[^\t]/g, " ");
          const numberOfMarkers = hasMarker[1] || 1;

          markerLine = [
            "\n ",
            defs.gutter(gutter.replace(/\d/g, " ")),
            " ",
            markerSpacing,
            defs.marker("^").repeat(numberOfMarkers),
          ].join("");

          if (lastMarkerLine && opts.message) {
            markerLine += " " + defs.message(opts.message);
          }
        }
        return [
          defs.marker(">"),
          defs.gutter(gutter),
          line.length > 0 ? ` ${line}` : "",
          markerLine,
        ].join("");
      } else {
        return ` ${defs.gutter(gutter)}${line.length > 0 ? ` ${line}` : ""}`;
      }
    })
    .join("\n");

  if (opts.message && !hasColumns) {
    frame = `${" ".repeat(numberMaxWidth + 1)}${opts.message}\n${frame}`;
  }

  return defs.reset(frame);
}