Enzyme Adapter Utilities

1.14.2 · maintenance · verified Sun Apr 19

The `enzyme-adapter-utils` package (version 1.14.2, last published 2 years ago) serves as a foundational utility layer for developing and maintaining official and third-party Enzyme adapters. It provides common functionalities, abstract classes (like `EnzymeAdapter`), and helper methods necessary for an adapter to bridge Enzyme's API with specific versions of React or other UI component libraries (e.g., Preact, Inferno). Unlike the main `enzyme` package, `enzyme-adapter-utils` is not intended for direct use by application developers writing tests. Its primary consumers are the developers of `enzyme-adapter-react-*` packages. As an internal component of the Enzyme ecosystem, its release cadence is tightly coupled with major Enzyme releases and React compatibility updates. It enables the modularity of Enzyme, allowing it to support multiple React versions simultaneously without requiring a monolithic testing library. This package is crucial for ensuring Enzyme's continued compatibility with the evolving React landscape, although the broader Enzyme ecosystem faces challenges with newer React versions.

Common errors

Warnings

Install

Imports

Quickstart

This quickstart demonstrates how a custom Enzyme adapter, designed by a library developer, would extend `EnzymeAdapter` and utilize internal utilities like `RSTreeNode` and `syncWithReactDom` from `enzyme-adapter-utils`. It is not for end-users writing tests.

import EnzymeAdapter, { RSTreeNode, syncWithReactDom } from 'enzyme-adapter-utils';
import { configure } from 'enzyme';

// This is an illustrative example of a custom adapter using enzyme-adapter-utils.
// End-users typically install and configure existing adapters (e.g., enzyme-adapter-react-16).

class CustomEnzymeAdapter extends EnzymeAdapter {
  constructor() {
    super();
    console.log('CustomEnzymeAdapter initialized.');
  }

  // Required methods for a custom adapter (simplified for example):
  createRenderer(options) {
    if (options.mode === 'mount') {
      syncWithReactDom(); // Example utility usage
    }
    console.log(`Creating renderer for mode: ${options.mode}`);
    return {
      render: (node, context) => {
        // In a real adapter, this would perform actual rendering
        console.log('Rendering node:', node);
        // Return a mock RSTreeNode for demonstration
        return new RSTreeNode('div', { className: 'rendered' }, [], null);
      },
      unmount: (node) => console.log('Unmounting node:', node),
      getNode: (node) => new RSTreeNode('span', {}, [], null), // Example utility usage
    };
  }

  // Other required adapter methods would be implemented here
  isValidElement(element) { return true; }
  nodeToElement(node) { return node; }
  nodeToHostNode(node) { return null; }
  displayNameOfNode(node) { return node.type || 'Unknown'; }
  // ... many more methods
}

// To actually use this adapter, you would configure Enzyme with it:
// configure({ adapter: new CustomEnzymeAdapter() });

console.log('This code demonstrates how a custom Enzyme adapter would leverage `enzyme-adapter-utils`.');
console.log('The EnzymeAdapter class, RSTreeNode, and syncWithReactDom are internal utilities for adapter authors.');
console.log('Direct usage by typical test authors is uncommon and not recommended.');

view raw JSON →