CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-jest-watch-typeahead

Jest plugin for filtering by filename or test name

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

testname-plugin.mddocs/

Test Name Plugin

The test name plugin provides interactive test name-based filtering with typeahead functionality. Users can type partial test names to filter which individual tests run during Jest watch mode.

Capabilities

TestNamePlugin Class

Main plugin class implementing Jest's WatchPlugin interface for test name-based filtering.

/**
 * Jest watch plugin for filtering individual tests by test name patterns
 */
export default class TestNamePlugin implements WatchPlugin {
  constructor(options: {
    stdin: NodeJS.ReadStream;
    stdout: NodeJS.WriteStream;
    config?: PluginConfig;
  });
  
  /** Hook into Jest lifecycle events to receive test results */
  apply(jestHooks: JestHookSubscriber): void;
  
  /** Handle keypress events from user input */
  onKey(key: string): void;
  
  /** Execute plugin functionality and update Jest configuration */
  run(
    globalConfig: Config.GlobalConfig,
    updateConfigAndRun: UpdateConfigCallback
  ): Promise<void>;
  
  /** Return plugin usage information for Jest's help display */
  getUsageInfo(): UsageData;
}

Usage Example:

import TestNamePlugin from "jest-watch-typeahead/testname";

// Plugin is typically instantiated by Jest
const plugin = new TestNamePlugin({
  stdin: process.stdin,
  stdout: process.stdout,
  config: {
    key: 'n',
    prompt: 'filter by test name'
  }
});

TestNamePatternPrompt Class

Interactive prompt class for test name pattern input and typeahead display.

/**
 * Pattern prompt for test name-based filtering with typeahead functionality
 */
export default class TestNamePatternPrompt extends PatternPrompt {
  constructor(pipe: NodeJS.WritableStream, prompt: Prompt);
  
  /** Update cached test results from previous test runs */
  updateCachedTestResults(results: Array<TestResult>): void;
  
  /** Handle pattern changes and update display */
  protected _onChange(pattern: string, options: ScrollOptions): void;
  
  /** Display typeahead results for current pattern */
  protected _printTypeahead(pattern: string, options: ScrollOptions): void;
  
  /** Get test names matching the current pattern */
  protected _getMatchedTests(pattern: string): Array<any>;
}

Pattern Matching System

The test name plugin uses regex-based pattern matching to filter individual tests:

  • Case-insensitive matching: Patterns match test names regardless of case
  • Partial matching: Type partial test names to see matching tests
  • Real-time filtering: Results update as you type
  • Highlighting: Matching portions of test names are highlighted in terminal output
  • Multi-line support: Test names with newlines are displayed with ⏎ symbols

Pattern Examples:

# Match tests containing "should"
should

# Match specific test descriptions
user.*authentication

# Match multiple test patterns
(login|signup).*success

# Match tests with specific keywords
error.*handling

Integration with Jest

Plugin Registration

// jest.config.js
module.exports = {
  watchPlugins: [
    'jest-watch-typeahead/testname'
  ]
};

Runtime Behavior

  1. Activation: Press the configured key (default: 't') in Jest watch mode
  2. Pattern Input: Type partial test name patterns to filter tests
  3. Visual Feedback: See matching test names highlighted in real-time
  4. Selection: Press Enter to apply filter and run matching tests
  5. Exit: Press Escape to cancel and return to main watch menu

Hook Integration

The plugin integrates with Jest's hook system:

interface JestHookSubscriber {
  /** Called when test runs complete */
  onTestRunComplete(callback: (data: { testResults: Array<TestResult> }) => void): void;
}

The test name plugin subscribes to onTestRunComplete to cache test results and extract available test names for filtering.

Test Name Processing

Formatting and Display

/**
 * Format test names with pattern highlighting for terminal display
 * @param testName - Original test name string
 * @param pattern - Search pattern to highlight
 * @param width - Terminal display width
 * @returns Formatted test name with highlighting and truncation
 */
function formatTestNameByPattern(
  testName: string,
  pattern: string,
  width: number
): string;

Test Name Processing:

  • Newline Replacement: Multi-line test names are converted to single lines with ⏎ symbols
  • Pattern Highlighting: Matching text is highlighted with ANSI colors
  • Truncation: Long test names are truncated with "..." when they exceed terminal width
  • Smart Truncation: Ensures highlighted portions remain visible when possible

Test Result Integration

interface TestResult {
  /** Test file path */
  testFilePath: string;
  /** Individual test results */
  testResults: Array<{
    title: string;
    fullName: string;
    status: 'passed' | 'failed' | 'pending' | 'skipped';
    duration?: number;
  }>;
}

The plugin extracts test names from TestResult objects to build a searchable index of available tests.

Utility Functions

String Processing

/**
 * Remove leading trimming dots from display strings
 * @param value - Input string that may contain trimming dots
 * @returns String with leading trimming dots removed
 */
function removeTrimmingDots(value: string): string;

Display Helpers

/**
 * Print pattern match summary to terminal
 * @param count - Number of matches found
 * @param entity - Entity type being searched ("tests")
 * @param pipe - Output stream for writing
 * @param extraText - Additional text to append
 */
function printPatternMatches(
  count: number,
  entity: string,
  pipe: NodeJS.WritableStream,
  extraText?: string
): void;

/**
 * Print start typing instruction message
 * @param entity - Entity type being searched ("tests")
 * @param pipe - Output stream for writing
 */
function printStartTyping(
  entity: string,
  pipe: NodeJS.WritableStream
): void;

/**
 * Print indicator for additional hidden matches
 * @param entity - Entity type being searched ("tests")
 * @param pipe - Output stream for writing
 * @param more - Number of additional matches
 */
function printMore(
  entity: string,
  pipe: NodeJS.WritableStream,
  more: number
): void;

/**
 * Print individual typeahead item to terminal
 * @param item - Item text to display
 * @param pipe - Output stream for writing
 */
function printTypeaheadItem(
  item: string,
  pipe: NodeJS.WritableStream
): void;

/**
 * Format typeahead selection items with highlighting for active selection
 * @param item - Item text to format
 * @param index - Current item index
 * @param activeIndex - Index of currently active selection
 * @param prompt - Jest prompt instance for selection tracking
 * @returns Formatted item string with selection highlighting
 */
function formatTypeaheadSelection(
  item: string,
  index: number,
  activeIndex: number,
  prompt: Prompt
): string;

Scrolling and Navigation

/**
 * Calculate scroll positioning for long lists of test names
 * @param size - Total number of items
 * @param options - Scroll configuration with offset and max display items
 * @returns Scroll position information with start, end, and current index
 */
function scroll(
  size: number,
  options: ScrollOptions
): {
  index: number;
  end: number;
  start: number;
};

The test name plugin supports keyboard navigation through long lists of matching tests:

  • Arrow Keys: Navigate up/down through matches
  • Page Up/Down: Scroll through multiple pages of results
  • Home/End: Jump to first/last match

Types

interface UpdateConfigCallback {
  (config: {
    mode: 'watch';
    testNamePattern: string;
  }): void;
}

interface ScrollOptions {
  /** Current scroll offset */
  offset: number;
  /** Maximum displayable items */
  max: number;
}

docs

filename-plugin.md

index.md

testname-plugin.md

tile.json