@wordpress/data 7.2.1-next.4d3b314fd5.0 → 7.4.0

package/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+## 7.4.0 (2022-10-19)
+
+## 7.3.0 (2022-10-05)
+
 ## 7.2.0 (2022-09-21)
 
 ## 7.1.0 (2022-09-13)

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/data",
-	"version": "7.2.1-next.4d3b314fd5.0",
+	"version": "7.4.0",
 	"description": "Data module for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -29,12 +29,12 @@
 	"sideEffects": false,
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/compose": "^5.16.1-next.4d3b314fd5.0",
-		"@wordpress/deprecated": "^3.18.1-next.4d3b314fd5.0",
-		"@wordpress/element": "^4.16.1-next.4d3b314fd5.0",
-		"@wordpress/is-shallow-equal": "^4.18.1-next.4d3b314fd5.0",
-		"@wordpress/priority-queue": "^2.18.1-next.4d3b314fd5.0",
-		"@wordpress/redux-routine": "^4.18.1-next.4d3b314fd5.0",
+		"@wordpress/compose": "^5.18.0",
+		"@wordpress/deprecated": "^3.20.0",
+		"@wordpress/element": "^4.18.0",
+		"@wordpress/is-shallow-equal": "^4.20.0",
+		"@wordpress/priority-queue": "^2.20.0",
+		"@wordpress/redux-routine": "^4.20.0",
 		"equivalent-key-map": "^0.2.2",
 		"is-plain-object": "^5.0.0",
 		"is-promise": "^4.0.0",
@@ -49,5 +49,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "25054766423cb49d959eb656c2533530073ff5c2"
+	"gitHead": "a2ff0e6471c88436dad0287beb88d1729aa6f5dd"
 }

package/src/components/use-dispatch/test/use-dispatch.js

@@ -1,7 +1,8 @@
 /**
  * External dependencies
  */
-import TestRenderer, { act } from 'react-test-renderer';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 
 /**
  * Internal dependencies
@@ -11,165 +12,121 @@ import createReduxStore from '../../../redux-store';
 import { createRegistry } from '../../../registry';
 import { RegistryProvider } from '../../registry-provider';
 
+jest.useRealTimers();
+
 describe( 'useDispatch', () => {
-	let registry;
-	beforeEach( () => {
-		registry = createRegistry();
-	} );
+	const counterStore = {
+		reducer: ( state = 0, action ) => {
+			if ( action.type === 'INC' ) {
+				return state + 1;
+			}
+
+			return state;
+		},
+		actions: {
+			inc: () => ( { type: 'INC' } ),
+		},
+		selectors: {
+			get: ( state ) => state,
+		},
+	};
+
+	it( 'returns dispatch function from store with no store name provided', async () => {
+		const user = userEvent.setup();
+		const registry = createRegistry();
+		registry.registerStore( 'demo', counterStore );
 
-	it( 'returns dispatch function from store with no store name provided', () => {
-		registry.registerStore( 'demoStore', {
-			reducer: ( state ) => state,
-			actions: {
-				foo: () => 'bar',
-			},
-		} );
 		const TestComponent = () => {
-			return <div></div>;
-		};
-		const Component = () => {
 			const dispatch = useDispatch();
-			return <TestComponent dispatch={ dispatch } />;
+			return <button onClick={ () => dispatch( 'demo' ).inc() } />;
 		};
 
-		let testRenderer;
-		act( () => {
-			testRenderer = TestRenderer.create(
-				<RegistryProvider value={ registry }>
-					<Component />
-				</RegistryProvider>
-			);
-		} );
+		render(
+			<RegistryProvider value={ registry }>
+				<TestComponent />
+			</RegistryProvider>
+		);
 
-		const testInstance = testRenderer.root;
+		await user.click( screen.getByRole( 'button' ) );
 
-		expect( testInstance.findByType( TestComponent ).props.dispatch ).toBe(
-			registry.dispatch
-		);
+		expect( registry.select( 'demo' ).get() ).toBe( 1 );
 	} );
-	it( 'returns expected action creators from store for given storeName', () => {
-		const noop = () => ( { type: '__INERT__' } );
-		const testAction = jest.fn().mockImplementation( noop );
-		const store = createReduxStore( 'demoStore', {
-			reducer: ( state ) => state,
-			actions: {
-				foo: testAction,
-			},
-		} );
+
+	it( 'returns expected action creators from store for given store descriptor', async () => {
+		const user = userEvent.setup();
+		const store = createReduxStore( 'demoStore', counterStore );
+		const registry = createRegistry();
 		registry.register( store );
 
 		const TestComponent = () => {
-			const { foo } = useDispatch( store );
-			return <button onClick={ foo } />;
+			const { inc } = useDispatch( store );
+			return <button onClick={ inc } />;
 		};
 
-		let testRenderer;
-
-		act( () => {
-			testRenderer = TestRenderer.create(
-				<RegistryProvider value={ registry }>
-					<TestComponent />
-				</RegistryProvider>
-			);
-		} );
-
-		const testInstance = testRenderer.root;
+		render(
+			<RegistryProvider value={ registry }>
+				<TestComponent />
+			</RegistryProvider>
+		);
 
-		act( () => {
-			testInstance.findByType( 'button' ).props.onClick();
-		} );
+		await user.click( screen.getByRole( 'button' ) );
 
-		expect( testAction ).toHaveBeenCalledTimes( 1 );
+		expect( registry.select( store ).get() ).toBe( 1 );
 	} );
 
-	it( 'returns expected action creators from store for given store descriptor', () => {
-		const noop = () => ( { type: '__INERT__' } );
-		const testAction = jest.fn().mockImplementation( noop );
-		registry.registerStore( 'demoStore', {
-			reducer: ( state ) => state,
-			actions: {
-				foo: testAction,
-			},
-		} );
+	it( 'returns expected action creators from store for given storeName', async () => {
+		const user = userEvent.setup();
+		const registry = createRegistry();
+		registry.registerStore( 'demoStore', counterStore );
 		const TestComponent = () => {
-			const { foo } = useDispatch( 'demoStore' );
-			return <button onClick={ foo } />;
+			const { inc } = useDispatch( 'demoStore' );
+			return <button onClick={ inc } />;
 		};
 
-		let testRenderer;
-
-		act( () => {
-			testRenderer = TestRenderer.create(
-				<RegistryProvider value={ registry }>
-					<TestComponent />
-				</RegistryProvider>
-			);
-		} );
-
-		const testInstance = testRenderer.root;
+		render(
+			<RegistryProvider value={ registry }>
+				<TestComponent />
+			</RegistryProvider>
+		);
 
-		act( () => {
-			testInstance.findByType( 'button' ).props.onClick();
-		} );
+		await user.click( screen.getByRole( 'button' ) );
 
-		expect( testAction ).toHaveBeenCalledTimes( 1 );
+		expect( registry.select( 'demoStore' ).get() ).toBe( 1 );
 	} );
 
-	it( 'returns dispatch from correct registry if registries change', () => {
-		const reducer = ( state ) => state;
-		const noop = () => ( { type: '__INERT__' } );
-		const firstRegistryAction = jest.fn().mockImplementation( noop );
-		const secondRegistryAction = jest.fn().mockImplementation( noop );
+	it( 'returns dispatch from correct registry if registries change', async () => {
+		const user = userEvent.setup();
 
-		const firstRegistry = registry;
-		firstRegistry.registerStore( 'demo', {
-			reducer,
-			actions: {
-				noop: firstRegistryAction,
-			},
-		} );
+		const firstRegistry = createRegistry();
+		firstRegistry.registerStore( 'demo', counterStore );
+
+		const secondRegistry = createRegistry();
+		secondRegistry.registerStore( 'demo', counterStore );
 
 		const TestComponent = () => {
 			const dispatch = useDispatch();
-			return <button onClick={ () => dispatch( 'demo' ).noop() } />;
+			return <button onClick={ () => dispatch( 'demo' ).inc() } />;
 		};
 
-		let testRenderer;
-		act( () => {
-			testRenderer = TestRenderer.create(
-				<RegistryProvider value={ firstRegistry }>
-					<TestComponent />
-				</RegistryProvider>
-			);
-		} );
-		const testInstance = testRenderer.root;
+		const { rerender } = render(
+			<RegistryProvider value={ firstRegistry }>
+				<TestComponent />
+			</RegistryProvider>
+		);
 
-		act( () => {
-			testInstance.findByType( 'button' ).props.onClick();
-		} );
+		await user.click( screen.getByRole( 'button' ) );
 
-		expect( firstRegistryAction ).toHaveBeenCalledTimes( 1 );
-		expect( secondRegistryAction ).toHaveBeenCalledTimes( 0 );
+		expect( firstRegistry.select( 'demo' ).get() ).toBe( 1 );
+		expect( secondRegistry.select( 'demo' ).get() ).toBe( 0 );
 
-		const secondRegistry = createRegistry();
-		secondRegistry.registerStore( 'demo', {
-			reducer,
-			actions: {
-				noop: secondRegistryAction,
-			},
-		} );
-
-		act( () => {
-			testRenderer.update(
-				<RegistryProvider value={ secondRegistry }>
-					<TestComponent />
-				</RegistryProvider>
-			);
-		} );
-		act( () => {
-			testInstance.findByType( 'button' ).props.onClick();
-		} );
-		expect( firstRegistryAction ).toHaveBeenCalledTimes( 1 );
-		expect( secondRegistryAction ).toHaveBeenCalledTimes( 1 );
+		rerender(
+			<RegistryProvider value={ secondRegistry }>
+				<TestComponent />
+			</RegistryProvider>
+		);
+
+		await user.click( screen.getByRole( 'button' ) );
+		expect( firstRegistry.select( 'demo' ).get() ).toBe( 1 );
+		expect( secondRegistry.select( 'demo' ).get() ).toBe( 1 );
 	} );
 } );