or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

formatters.mdindex.mdplugin-testing.mdpreset-testing.mdtest-configuration.mdutilities.md
tile.json

formatters.mddocs/

Formatters

Pluggable result formatters for normalizing and prettifying Babel transformation output.

Capabilities

Result Formatter Interface

Generic interface for result formatting functions.

/**
 * Generic result formatter function
 * @param code - The code to format
 * @param options - Formatting options including file context
 * @returns Promise resolving to formatted code
 */
type ResultFormatter<T = any> = (
  code: string,
  options?: {
    /** Current working directory */
    cwd?: string;
    /** Filename for the code (deprecated, use filepath) */
    filename?: string;
    /** File path for the code */
    filepath?: string;
  } & T
) => Promise<string>;

Prettier Formatter

Built-in formatter that uses Prettier to normalize Babel transformation output.

/**
 * Prettier-based formatter for normalizing babel output.
 * Automatically resolves prettier config from filepath or uses defaults.
 */
const prettierFormatter: ResultFormatter<{
  /** Options passed directly to prettier */
  prettierOptions?: PrettierOptions | null;
  /** Deprecated: Use prettierOptions instead */
  config?: PrettierOptions | null;
}>;

Usage Examples:

import pluginTester, { prettierFormatter } from "babel-plugin-tester";

// Using prettier formatter
pluginTester({
  plugin: myPlugin,
  formatResult: prettierFormatter,
  tests: [
    {
      code: `const   a    =     1;`,
      output: `const a = 1;`, // Formatted by prettier
    },
  ],
});

// Custom prettier options
pluginTester({
  plugin: myPlugin,
  formatResult: (code, { filepath = "dummy.js" } = {}) =>
    prettierFormatter(code, {
      filepath,
      prettierOptions: {
        semi: false,
        singleQuote: true,
        tabWidth: 2,
      },
    }),
  tests: [
    {
      code: `const a = "hello";`,
      output: `const a = 'hello'`, // Single quotes, no semicolon
    },
  ],
});

Prettier Options

Type definition for Prettier configuration options.

/** Re-export of Prettier's configuration options */
type PrettierOptions = import('prettier').Options;

Custom Formatters

Creating custom result formatters for specific needs.

Usage Examples:

import pluginTester from "babel-plugin-tester";

// Simple custom formatter
const upperCaseFormatter: ResultFormatter = async (code) => {
  return code.toUpperCase();
};

// Advanced custom formatter
const customFormatter: ResultFormatter<{ 
  removeComments?: boolean;
  indent?: number;
}> = async (code, options = {}) => {
  let result = code;
  
  if (options.removeComments) {
    result = result.replace(/\/\*[\s\S]*?\*\/|\/\/.*$/gm, '');
  }
  
  if (options.indent) {
    const lines = result.split('\n');
    const indentStr = ' '.repeat(options.indent);
    result = lines.map(line => line.trim() ? indentStr + line.trim() : line).join('\n');
  }
  
  return result;
};

pluginTester({
  plugin: myPlugin,
  formatResult: (code, options) => customFormatter(code, {
    ...options,
    removeComments: true,
    indent: 4,
  }),
  tests: [
    {
      code: `
        // This comment will be removed
        const a = 1;
      `,
      output: `
            const a = 1;
      `,
    },
  ],
});

// Async formatter with external dependencies
const asyncFormatter: ResultFormatter = async (code, { filepath }) => {
  const { format } = await import('some-external-formatter');
  return format(code, { filepath });
};

Formatter Configuration

Formatters can be configured globally or per-test.

Usage Examples:

// Global formatter configuration
pluginTester({
  plugin: myPlugin,
  formatResult: prettierFormatter,
  tests: [...],
});

// Per-test formatter override
pluginTester({
  plugin: myPlugin,
  formatResult: prettierFormatter,
  tests: [
    {
      code: `const a = 1;`,
      output: `const a = 1;`,
      // This test uses the global formatter
    },
    {
      code: `const b = 2;`,
      output: `CONST B = 2;`,
      formatResult: upperCaseFormatter,
      // This test uses a custom formatter
    },
  ],
});

Default Formatter Behavior

When no formatter is specified, code is used as-is without transformation.

// No formatter - output compared exactly as written
pluginTester({
  plugin: myPlugin,
  tests: [
    {
      code: `const   a    =     1;`,
      output: `var   a    =     1;`, // Must match exactly including spacing
    },
  ],
});