jest-config-enzyme

jest-config-enzyme

MOXY's Jest configuration enhancer for web projects that use Enzyme framework.

Installation

$ npm install --save-dev jest @moxy/jest-config-base @moxy/jest-config-enzyme

This package should be used in conjunction with @moxy/jest-config-base. There are two enhancers available:

• withEnzymeWeb
• withEnzymeReactNative

withEnzymeWeb

An enhancer for web projects tested with Enzyme.

What's included?

• Automatic adapter setup: Setups the enzyme adapter automatically based on the desired one.
• Wrapper snapshotting: Ability to snapshot Enzyme wrappers by using enzyme-to-json.
• Extended matchers: Make assertions easier and clearer by using jest-enzyme matchers.

Usage

To use this enhancer, use the compose function that comes with @moxy/jest-config-base. Keep in mind, the first item should always be the base configuration!

'use strict';

const { compose, baseConfig } = require('@moxy/jest-config-base');
const { withEnzymeWeb } = require('@moxy/jest-config-enzyme');

module.exports = compose(
    baseConfig(),
    withEnzymeWeb('enzyme-adapter-react-16'),
);

⚠️ Note that you must install the Enzyme adapter yourself. In the example above, you would have to install enzyme-adapter-react-16:

⚠️ Make sure withEnzymeWeb is composed only after withWeb from @moxy/jest-config-web.

$ npm install --save-dev enzyme-adapter-react-16

withEnzymeReactNative

An enhancer for React Native projects tested with Enzyme.

What's included?

• Automatic adapter setup: Setups the enzyme adapter automatically based on the desired one.
• Wrapper snapshotting: Ability to snapshot Enzyme wrappers by using enzyme-to-json.
• Ignore certain warnings and errors: Ignore warnings and errors produced by React due to the fact that we are using JSDOM in React Native, as prescribed by Enzyme.
• Extended matchers: Make assertions easier and clearer by using jest-enzyme matchers. Only React Native-compatible matchers are installed:
  • toBeDisabled()
  • toBeEmptyRender()
  • toExist()
  • toContainMatchingElement()
  • toContainMatchingElements()
  • toContainExactlyOneMatchingElement()
  • toContainReact()
  • toHaveDisplayName()
  • toHaveProp()
  • toHaveRef()
  • toHaveState()
  • toIncludeText()
  • toMatchElement()
  • toMatchSelector()

Usage

To use this enhancer, use the compose function that comes with @moxy/jest-config-base. Keep in mind, the first item should always be the base configuration!

'use strict';

const { compose, baseConfig } = require('@moxy/jest-config-base');
const { withEnzymeReactNative } = require('@moxy/jest-config-enzyme');

module.exports = compose(
    baseConfig(),
    withEnzymeReactNative('enzyme-adapter-react-16', options),
);

⚠️ Note that you must install the Enzyme adapter yourself. In the example above, you would have to install enzyme-adapter-react-16:

⚠️ Make sure withEnzymeReactNative is composed only after withReactNative from @moxy/jest-config-react-native.

options

ignoreExtraMessagePatterns

Type: Array
Default: []

An array of regexp pattern strings that are matched against errors or warnings emitted by React and filtered out. There are several messages which already ignored by default. This option allows to exclude additional messages if necessary.

$ npm install --save-dev enzyme-adapter-react-16