or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

index.mdline-comparison.mdstring-comparison.mdvalue-comparison.md
tile.json

tessl/npm-jest-diff

Display differences clearly so people can review changes confidently

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/jest-diff@30.1.x

To install, run

npx @tessl/cli install tessl/npm-jest-diff@30.1.0

index.mddocs/

jest-diff

Jest-diff is a comprehensive TypeScript library for displaying differences between values with multiple comparison methods. It provides functions for comparing strings character-by-character, arrays line-by-line, and JavaScript objects with serialization. The library offers colorized output using chalk for easy change visualization and supports configurable formatting options.

Package Information

  • Package Name: jest-diff
  • Package Type: npm
  • Language: TypeScript
  • Installation: npm install jest-diff

Core Imports

import { diff, diffStringsUnified, diffLinesUnified, DiffOptions } from "jest-diff";

For CommonJS:

const { diff, diffStringsUnified, diffLinesUnified } = require("jest-diff");

Basic Usage

import { diff, diffStringsUnified, diffLinesUnified } from "jest-diff";

// Compare any two JavaScript values
const a = ['delete', 'common', 'changed from'];
const b = ['common', 'changed to', 'insert'];
const result = diff(a, b);
console.log(result);

// Compare strings character-by-character
const stringDiff = diffStringsUnified('Hello world', 'Hello Jest');
console.log(stringDiff);

// Compare arrays of strings line-by-line
const lines1 = ['line 1', 'line 2', 'line 3'];
const lines2 = ['line 1', 'modified line 2', 'line 3'];
const lineDiff = diffLinesUnified(lines1, lines2);
console.log(lineDiff);

Architecture

Jest-diff is built around several key components:

  • Main diff function: Handles any JavaScript values by detecting types and routing to appropriate comparison methods
  • String comparison: Character-by-character diffing with semantic cleanup for readable output
  • Line comparison: Line-by-line diffing for arrays of strings with unified diff formatting
  • Pretty formatting: Integration with pretty-format for consistent object serialization
  • Colorization system: Configurable chalk-based coloring for clear visual distinction
  • Options normalization: Comprehensive default handling and validation for formatting options

Capabilities

Value Comparison

Main comparison function that handles any JavaScript values including primitives, objects, arrays, Maps, and Sets.

function diff(a: any, b: any, options?: DiffOptions): string | null;

Value Comparison

String Comparison

Character-by-character string comparison with unified diff output and semantic cleanup.

function diffStringsUnified(a: string, b: string, options?: DiffOptions): string;
function diffStringsRaw(a: string, b: string, cleanup: boolean): Array<Diff>;

String Comparison

Line Comparison

Line-by-line comparison for arrays of strings with multiple output formats.

function diffLinesUnified(
  aLines: Array<string>, 
  bLines: Array<string>, 
  options?: DiffOptions
): string;

function diffLinesUnified2(
  aLinesDisplay: Array<string>,
  bLinesDisplay: Array<string>, 
  aLinesCompare: Array<string>,
  bLinesCompare: Array<string>,
  options?: DiffOptions
): string;

function diffLinesRaw(
  aLines: Array<string>, 
  bLines: Array<string>
): Array<Diff>;

Line Comparison

Configuration

interface DiffOptions {
  aAnnotation?: string;
  aColor?: DiffOptionsColor;
  aIndicator?: string;
  bAnnotation?: string;
  bColor?: DiffOptionsColor;
  bIndicator?: string;
  changeColor?: DiffOptionsColor;
  changeLineTrailingSpaceColor?: DiffOptionsColor;
  commonColor?: DiffOptionsColor;
  commonIndicator?: string;
  commonLineTrailingSpaceColor?: DiffOptionsColor;
  contextLines?: number;
  emptyFirstOrLastLinePlaceholder?: string;
  expand?: boolean;
  includeChangeCounts?: boolean;
  omitAnnotationLines?: boolean;
  patchColor?: DiffOptionsColor;
  compareKeys?: CompareKeys;
}

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

// From pretty-format package
type CompareKeys = ((a: string, b: string) => number) | undefined;

Data Structures

class Diff {
  0: number; // Operation type: DIFF_DELETE (-1), DIFF_INSERT (1), or DIFF_EQUAL (0)
  1: string; // Text content
  constructor(op: number, text: string);
}

const DIFF_DELETE = -1;
const DIFF_INSERT = 1; 
const DIFF_EQUAL = 0;