CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-jest-diff

Display differences clearly so people can review changes confidently

Pending
Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

SecuritybySnyk

Pending

The risk profile of this skill

Overview
Eval results
Files

line-comparison.mddocs/

Line Comparison

Line-by-line comparison for arrays of strings with multiple output formats including unified diff, raw operations, and dual display/comparison modes.

Capabilities

Unified Line Diff

Compares arrays of strings line-by-line and returns formatted unified diff output.

/**
 * Compare two arrays of strings line-by-line and format as comparison lines
 * @param aLines - First array of strings to compare
 * @param bLines - Second array of strings to compare  
 * @param options - Optional formatting configuration
 * @returns Formatted unified diff string
 */
function diffLinesUnified(
  aLines: Array<string>, 
  bLines: Array<string>, 
  options?: DiffOptions
): string;

Features:

  • Empty String Handling: Properly handles arrays with single empty strings
  • Control Character Escaping: Automatically escapes control characters for visibility
  • Context Lines: Shows configurable number of unchanged lines around changes
  • Annotation Headers: Includes Expected/Received headers with optional change counts

Usage Examples:

import { diffLinesUnified } from "jest-diff";

// Basic line comparison
const lines1 = ["line 1", "line 2", "line 3"];
const lines2 = ["line 1", "modified line 2", "line 3", "new line 4"];
const result = diffLinesUnified(lines1, lines2);
console.log(result);

// With custom options
const result2 = diffLinesUnified(lines1, lines2, {
  contextLines: 1,
  includeChangeCounts: true,
  aAnnotation: "Original",
  bAnnotation: "Modified"
});
console.log(result2);

// Empty arrays
const result3 = diffLinesUnified([], ["new line"]);
console.log(result3);

Dual Mode Line Diff

Compares using separate arrays for display and comparison, allowing different content for visual output vs comparison logic.

/**
 * Compare two pairs of arrays: one pair for comparison logic, another for display
 * @param aLinesDisplay - Lines to display for first value
 * @param bLinesDisplay - Lines to display for second value
 * @param aLinesCompare - Lines to use for comparison logic for first value  
 * @param bLinesCompare - Lines to use for comparison logic for second value
 * @param options - Optional formatting configuration
 * @returns Formatted unified diff string using display lines
 */
function diffLinesUnified2(
  aLinesDisplay: Array<string>,
  bLinesDisplay: Array<string>, 
  aLinesCompare: Array<string>,
  bLinesCompare: Array<string>,
  options?: DiffOptions
): string;

Use Cases:

  • Pretty Formatting: Compare simplified versions but display formatted versions
  • Normalized Comparison: Compare normalized data while showing original formatting
  • Fallback Behavior: Falls back to standard diffLinesUnified if array lengths don't match

Usage Examples:

import { diffLinesUnified2 } from "jest-diff";

// Different display vs comparison content
const displayA = ["  formatted line 1  ", "  formatted line 2  "];
const displayB = ["  formatted line 1  ", "  NEW formatted line 2  "];
const compareA = ["formatted line 1", "formatted line 2"];
const compareB = ["formatted line 1", "NEW formatted line 2"];

const result = diffLinesUnified2(displayA, displayB, compareA, compareB);
console.log(result);

Raw Line Diff

Compares arrays of strings line-by-line and returns raw diff operations array.

/**
 * Compare two arrays of strings line-by-line and return raw diff operations
 * @param aLines - First array of strings to compare
 * @param bLines - Second array of strings to compare
 * @returns Array of Diff objects representing line-level operations
 */
function diffLinesRaw(
  aLines: Array<string>, 
  bLines: Array<string>
): Array<Diff>;

Algorithm:

  • Longest Common Subsequence: Uses efficient diff-sequences algorithm to find optimal diff
  • Line-level Operations: Each Diff represents insertion, deletion, or equality of entire lines
  • Sequential Processing: Processes lines in order with optimal performance

Usage Examples:

import { diffLinesRaw, DIFF_DELETE, DIFF_INSERT, DIFF_EQUAL } from "jest-diff";

const lines1 = ["keep", "delete", "keep"];
const lines2 = ["keep", "insert", "keep"];
const diffs = diffLinesRaw(lines1, lines2);

diffs.forEach(diff => {
  const [op, line] = [diff[0], diff[1]];
  switch (op) {
    case DIFF_DELETE:
      console.log(`- ${line}`);
      break;
    case DIFF_INSERT:
      console.log(`+ ${line}`);
      break;
    case DIFF_EQUAL:
      console.log(`  ${line}`);
      break;
  }
});

Formatting Options

interface DiffOptions {
  // Annotation customization
  aAnnotation?: string; // Default: "Expected"
  bAnnotation?: string; // Default: "Received"
  omitAnnotationLines?: boolean; // Default: false
  
  // Visual indicators  
  aIndicator?: string; // Default: "-"
  bIndicator?: string; // Default: "+"
  commonIndicator?: string; // Default: " "
  
  // Color functions
  aColor?: DiffOptionsColor; // Default: chalk.green
  bColor?: DiffOptionsColor; // Default: chalk.red
  commonColor?: DiffOptionsColor; // Default: chalk.dim
  changeColor?: DiffOptionsColor; // Default: chalk.inverse
  patchColor?: DiffOptionsColor; // Default: chalk.yellow
  
  // Context and expansion
  contextLines?: number; // Default: 5
  expand?: boolean; // Default: true
  
  // Additional features
  includeChangeCounts?: boolean; // Default: false
  emptyFirstOrLastLinePlaceholder?: string; // Default: ""
}

type DiffOptionsColor = (arg: string) => string;

docs

index.md

line-comparison.md

string-comparison.md

value-comparison.md

tile.json