@wordpress/jest-preset-default 9.1.1-next.4d3b314fd5.0 → 10.1.0

package/README.md

@@ -36,6 +36,64 @@ npm install @wordpress/jest-preset-default --save-dev
 -   `transform` - keeps the default [babel-jest](https://github.com/facebook/jest/tree/HEAD/packages/babel-jest) transformer.
 -   `verbose` - each individual test won't be reported during the run.
 
+#### Using enzyme
+
+Historically, this package used to use `enzyme`, but support was dropped in favor of `@testing-library/react`, primary reason being unblocking the upgrade to React 18.
+
+If you wish to use `enzyme`, you can still use it by manually providing the React 17 adapter, by following the steps below.
+
+To install the enzyme dependency, run:
+
+```bash
+npm install --save enzyme
+```
+
+To install the React 17 adapter dependency, run:
+
+```bash
+npm install --save @wojtekmaj/enzyme-adapter-react-17
+```
+
+To use the React 17 adapter, use this in your [`setupFilesAfterEnv`](https://jestjs.io/docs/configuration#setupfilesafterenv-array) configuration:
+
+```javascript
+// It "mocks" enzyme, so that we can delay loading of
+// the utility functions until enzyme is imported in tests.
+// Props to @gdborton for sharing this technique in his article:
+// https://medium.com/airbnb-engineering/unlocking-test-performance-migrating-from-mocha-to-jest-2796c508ec50.
+let mockEnzymeSetup = false;
+
+jest.mock( 'enzyme', () => {
+	const actualEnzyme = jest.requireActual( 'enzyme' );
+	if ( ! mockEnzymeSetup ) {
+		mockEnzymeSetup = true;
+
+		// Configure enzyme 3 for React, from docs: http://airbnb.io/enzyme/docs/installation/index.html
+		const Adapter = jest.requireActual(
+			'@wojtekmaj/enzyme-adapter-react-17'
+		);
+		actualEnzyme.configure( { adapter: new Adapter() } );
+	}
+	return actualEnzyme;
+} );
+```
+
+If you also use snapshot tests with `enzyme`, you might want to add support for serializing them, through the `enzyme-to-json` package.
+
+To install the dependency, run:
+
+```bash
+npm install --save enzyme-to-json
+```
+
+Finally, you should add `enzyme-to-json/serializer` to the array of [`snapshotSerializers`](https://jestjs.io/docs/configuration#snapshotserializers-arraystring):
+
+```javascript
+{
+	snapshotSerializers: [ 'enzyme-to-json/serializer' ]
+}
+```
+
 ## Contributing to this package
 
 This is an individual package that's part of the Gutenberg project. The project is organized as a monorepo. It's made up of multiple self-contained software packages, each with a specific purpose. The packages in this monorepo are published to [npm](https://www.npmjs.com/) and used by [WordPress](https://make.wordpress.org/core/) as well as other software projects.

package/jest-preset.js

@@ -17,7 +17,6 @@ module.exports = {
 			'@wordpress/jest-preset-default/scripts/setup-test-framework.js'
 		),
 	],
-	snapshotSerializers: [ require.resolve( 'enzyme-to-json/serializer.js' ) ],
 	testEnvironment: 'jsdom',
 	testMatch: [
 		'**/__tests__/**/*.[jt]s?(x)',

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/jest-preset-default",
-	"version": "9.1.1-next.4d3b314fd5.0",
+	"version": "10.1.0",
 	"description": "Default Jest preset for WordPress development.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -9,8 +9,7 @@
 		"gutenberg",
 		"jest",
 		"preset",
-		"react",
-		"enzyme"
+		"react"
 	],
 	"homepage": "https://github.com/WordPress/gutenberg/tree/HEAD/packages/jest-preset-default/README.md",
 	"repository": {
@@ -31,20 +30,17 @@
 	],
 	"main": "index.js",
 	"dependencies": {
-		"@wojtekmaj/enzyme-adapter-react-17": "^0.6.1",
-		"@wordpress/jest-console": "^6.1.1-next.4d3b314fd5.0",
-		"babel-jest": "^27.4.5",
-		"enzyme": "^3.11.0",
-		"enzyme-to-json": "^3.4.4"
+		"@wordpress/jest-console": "^6.3.0",
+		"babel-jest": "^27.4.5"
 	},
 	"peerDependencies": {
 		"@babel/core": ">=7",
 		"jest": ">=27",
-		"react": "^17.0.0",
-		"react-dom": "^17.0.0"
+		"react": ">=17",
+		"react-dom": ">=17"
 	},
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "25054766423cb49d959eb656c2533530073ff5c2"
+	"gitHead": "a2ff0e6471c88436dad0287beb88d1729aa6f5dd"
 }

package/scripts/setup-globals.js

@@ -44,7 +44,9 @@ global.window.cancelIdleCallback = function cancelIdleCallback( handle ) {
 global.window.matchMedia = () => ( {
 	matches: false,
 	addListener: () => {},
+	addEventListener: () => {},
 	removeListener: () => {},
+	removeEventListener: () => {},
 } );
 
 // Setup fake localStorage.

package/scripts/setup-test-framework.js

@@ -1,21 +1 @@
 require( '@wordpress/jest-console' );
-
-// It "mocks" enzyme, so that we can delay loading of
-// the utility functions until enzyme is imported in tests.
-// Props to @gdborton for sharing this technique in his article:
-// https://medium.com/airbnb-engineering/unlocking-test-performance-migrating-from-mocha-to-jest-2796c508ec50.
-let mockEnzymeSetup = false;
-
-jest.mock( 'enzyme', () => {
-	const actualEnzyme = jest.requireActual( 'enzyme' );
-	if ( ! mockEnzymeSetup ) {
-		mockEnzymeSetup = true;
-
-		// Configure enzyme 3 for React, from docs: http://airbnb.io/enzyme/docs/installation/index.html
-		const Adapter = jest.requireActual(
-			'@wojtekmaj/enzyme-adapter-react-17'
-		);
-		actualEnzyme.configure( { adapter: new Adapter() } );
-	}
-	return actualEnzyme;
-} );