or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

filename-plugin.mdindex.mdtestname-plugin.md
tile.json

tessl/npm-jest-watch-typeahead

Jest plugin for filtering by filename or test name

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/jest-watch-typeahead@3.0.x

To install, run

npx @tessl/cli install tessl/npm-jest-watch-typeahead@3.0.0

index.mddocs/

Jest Watch Typeahead

Jest Watch Typeahead provides two Jest watch plugins that enable interactive typeahead filtering during test execution. The filename plugin allows filtering test files by typing partial filenames, while the testname plugin allows filtering individual tests by typing partial test names, both providing real-time fuzzy-search-like capabilities.

Package Information

  • Package Name: jest-watch-typeahead
  • Package Type: npm
  • Language: TypeScript
  • Installation: npm install --save-dev jest-watch-typeahead

Core Imports

The package exports two distinct plugins accessed via subpath exports. The main entry point intentionally throws an error directing users to the correct import paths:

// Import filename plugin (for Jest configuration)
import FilenamePlugin from "jest-watch-typeahead/filename";

// Import testname plugin (for Jest configuration)  
import TestnamePlugin from "jest-watch-typeahead/testname";

CommonJS:

const FilenamePlugin = require("jest-watch-typeahead/filename");
const TestnamePlugin = require("jest-watch-typeahead/testname");

Package Exports Structure:

  • "." → "./build/index.js" (throws configuration error)
  • "./filename" → "./build/file_name_plugin/plugin.js"
  • "./testname" → "./build/test_name_plugin/plugin.js"
  • "./package.json" → "./package.json"

Basic Usage

Configure Jest to use the plugins in your package.json:

{
  "jest": {
    "watchPlugins": [
      "jest-watch-typeahead/filename",
      "jest-watch-typeahead/testname"
    ]
  }
}

Or in jest.config.js:

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

Run Jest in watch mode to use the plugins:

npx jest --watch

Advanced Configuration Examples

Custom keys and prompts for better workflow integration:

module.exports = {
  watchPlugins: [
    [
      'jest-watch-typeahead/filename',
      {
        key: 'f',
        prompt: 'filter by file pattern',
      },
    ],
    [
      'jest-watch-typeahead/testname', 
      {
        key: 'n',
        prompt: 'filter by test name pattern',
      },
    ],
  ],
  // Additional Jest configuration
  testMatch: ['**/__tests__/**/*.test.{js,ts}'],
  collectCoverageFrom: ['src/**/*.{js,ts}'],
};

Integration with other Jest watch plugins:

module.exports = {
  watchPlugins: [
    'jest-watch-typeahead/filename',
    'jest-watch-typeahead/testname',
    'jest-watch-suspend',
    'jest-watch-select-projects',
  ],
};

Architecture

Jest Watch Typeahead is built around Jest's plugin architecture with the following key components:

  • Plugin Classes: FileNamePlugin and TestNamePlugin implementing Jest's WatchPlugin interface
  • Pattern Prompts: FileNamePatternPrompt and TestNamePatternPrompt extending Jest's PatternPrompt for user interaction
  • Utility Functions: Text formatting, highlighting, and terminal display utilities
  • Configuration System: Customizable key bindings and prompt text through PluginConfig

Capabilities

Filename Filtering Plugin

Interactive filename-based test filtering with typeahead functionality. Users can type partial filenames to filter which test files run.

export default class FileNamePlugin implements WatchPlugin {
  constructor(options: {
    stdin: NodeJS.ReadStream;
    stdout: NodeJS.WriteStream;
    config?: PluginConfig;
  });
  
  apply(jestHooks: JestHookSubscriber): void;
  onKey(key: string): void;
  run(globalConfig: Config.GlobalConfig, updateConfigAndRun: UpdateConfigCallback): Promise<void>;
  getUsageInfo(): UsageData;
}

Filename Plugin

Test Name Filtering Plugin

Interactive test name-based filtering with typeahead functionality. Users can type partial test names to filter which individual tests run.

export default class TestNamePlugin implements WatchPlugin {
  constructor(options: {
    stdin: NodeJS.ReadStream;
    stdout: NodeJS.WriteStream;
    config?: PluginConfig;
  });
  
  apply(jestHooks: JestHookSubscriber): void;
  onKey(key: string): void;
  run(globalConfig: Config.GlobalConfig, updateConfigAndRun: UpdateConfigCallback): Promise<void>;
  getUsageInfo(): UsageData;
}

Test Name Plugin

Types

interface PluginConfig {
  /** Custom key binding for plugin activation (default: 'p' for filename, 't' for testname) */
  key?: string;
  /** Custom prompt text displayed to user */
  prompt?: string;
}

type SearchSources = Array<{
  config: Config.ProjectConfig;
  testPaths: Array<string>;
}>;

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

Configuration

Custom Key Bindings and Prompts

module.exports = {
  watchPlugins: [
    [
      'jest-watch-typeahead/filename',
      {
        key: 'k',
        prompt: 'filter by custom filename pattern',
      },
    ],
    [
      'jest-watch-typeahead/testname',
      {
        key: 'n',
        prompt: 'filter by custom test name pattern',
      },
    ],
  ],
};

Default configurations:

  • Filename plugin: key="p", prompt="filter by a filename regex pattern"
  • Test name plugin: key="t", prompt="filter by a test name regex pattern"

Main Entry Point

The main package entry point (jest-watch-typeahead) intentionally throws an error to guide users to the correct usage:

// Importing the main entry point throws this error:
throw new Error(`
jest-watch-typeahead includes two watch plugins: The filename plugin and the testname plugin.
Please configure Jest as follows:
"watchPlugins": [
  "jest-watch-typeahead/filename",
  "jest-watch-typeahead/testname"
]
`);

This prevents accidental incorrect usage and ensures users configure the plugins properly via Jest's watchPlugins configuration.