Remove deprecated data controls in favour of those from the `@wordpress/data` package (https://github.com/woocommerce/woocommerce-blocks/pull/5574)

* Remove expected warnings from test suite

* Switch dispatch and select usage to `controls`, from `@wordpress/data`

* Wrap render with act

* resolveSelect to wait for resolution

* resolveSelect
This commit is contained in:
Mike Jolley 2022-03-10 13:22:05 +00:00 committed by GitHub
parent 28d647d02c
commit 5165611e45
10 changed files with 64 additions and 43 deletions

View File

@ -208,9 +208,6 @@ describe( 'Testing Payment Method Data Context Provider', () => {
);
expect( activePaymentMethod ).not.toBeNull();
} );
// ["`select` control in `@wordpress/data-controls` is deprecated. Please use built-in `resolveSelect` control in `@wordpress/data` instead."]
expect( console ).toHaveWarned();
} );
} );

View File

@ -83,22 +83,24 @@ describe( 'Testing cart', () => {
} );
it( 'renders cart if there are items in the cart', async () => {
render( <CartBlock /> );
act( () => {
render( <CartBlock /> );
} );
await waitFor( () => expect( fetchMock ).toHaveBeenCalled() );
expect(
screen.getByText( /Proceed to Checkout/i )
).toBeInTheDocument();
expect( fetchMock ).toHaveBeenCalledTimes( 1 );
// ["`select` control in `@wordpress/data-controls` is deprecated. Please use built-in `resolveSelect` control in `@wordpress/data` instead."]
expect( console ).toHaveWarned();
} );
it( 'Contains a Taxes section if Core options are set to show it', async () => {
allSettings.displayCartPricesIncludingTax = false;
// The criteria for showing the Taxes section is:
// Display prices during basket and checkout: 'Excluding tax'.
render( <CartBlock /> );
act( () => {
render( <CartBlock /> );
} );
await waitFor( () => expect( fetchMock ).toHaveBeenCalled() );
expect( screen.getByText( /Tax/i ) ).toBeInTheDocument();
@ -110,7 +112,9 @@ describe( 'Testing cart', () => {
// The criteria for showing the lines in the Taxes section is:
// Display prices during basket and checkout: 'Excluding tax'.
// Display tax totals: 'Itemized';
render( <CartBlock /> );
act( () => {
render( <CartBlock /> );
} );
await waitFor( () => expect( fetchMock ).toHaveBeenCalled() );
expect( screen.getByText( /Sales tax/i ) ).toBeInTheDocument();
} );
@ -133,15 +137,19 @@ describe( 'Testing cart', () => {
} );
it( 'renders empty cart if there are no items in the cart', async () => {
fetchMock.mockResponse( ( req ) => {
if ( req.url.match( /wc\/store\/v1\/cart/ ) ) {
return Promise.resolve(
JSON.stringify( defaultCartState.cartData )
);
}
return Promise.resolve( '' );
act( () => {
fetchMock.mockResponse( ( req ) => {
if ( req.url.match( /wc\/store\/v1\/cart/ ) ) {
return Promise.resolve(
JSON.stringify( defaultCartState.cartData )
);
}
return Promise.resolve( '' );
} );
} );
act( () => {
render( <CartBlock /> );
} );
render( <CartBlock /> );
await waitFor( () => expect( fetchMock ).toHaveBeenCalled() );
expect( screen.getByText( /Empty Cart/i ) ).toBeInTheDocument();
@ -173,7 +181,9 @@ describe( 'Testing cart', () => {
return Promise.resolve( JSON.stringify( cart ) );
}
} );
render( <CartBlock /> );
act( () => {
render( <CartBlock /> );
} );
await waitFor( () => expect( fetchMock ).toHaveBeenCalled() );
expect( screen.getAllByRole( 'cell' )[ 1 ] ).toHaveTextContent( '16€' );
@ -191,7 +201,9 @@ describe( 'Testing cart', () => {
],
};
const itemName = cart.items[ 0 ].name;
render( <CartBlock /> );
act( () => {
render( <CartBlock /> );
} );
await waitFor( () => expect( fetchMock ).toHaveBeenCalled() );
const quantityInput = screen.getByLabelText(

View File

@ -72,8 +72,6 @@ describe( 'Testing Mini Cart', () => {
} );
expect( fetchMock ).toHaveBeenCalledTimes( 1 );
// ["`select` control in `@wordpress/data-controls` is deprecated. Please use built-in `resolveSelect` control in `@wordpress/data` instead."]
expect( console ).toHaveWarned();
} );
it( 'renders empty cart if there are no items in the cart', async () => {

View File

@ -99,8 +99,6 @@ describe( 'PaymentMethods', () => {
// creates an extra `div` with the notice contents used for a11y.
expect( noPaymentMethods.length ).toBeGreaterThanOrEqual( 1 );
} );
// ["`select` control in `@wordpress/data-controls` is deprecated. Please use built-in `resolveSelect` control in `@wordpress/data` instead."]
expect( console ).toHaveWarned();
} );
test( 'selecting new payment method', async () => {

View File

@ -1,7 +1,6 @@
/**
* External dependencies
*/
import { select } from '@wordpress/data-controls';
import type {
Cart,
CartResponse,
@ -12,6 +11,7 @@ import type {
import { camelCase, mapKeys } from 'lodash';
import type { AddToCartEventDetail } from '@woocommerce/type-defs/events';
import { BillingAddress, ShippingAddress } from '@woocommerce/settings';
import { controls } from '@wordpress/data';
/**
* Internal dependencies
@ -416,7 +416,11 @@ export function* changeCartItemQuantity(
quantity: number
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- unclear how to represent multiple different yields as type
): Generator< unknown, void, any > {
const cartItem = yield select( CART_STORE_KEY, 'getCartItem', cartItemKey );
const cartItem = yield controls.resolveSelect(
CART_STORE_KEY,
'getCartItem',
cartItemKey
);
if ( cartItem?.quantity === quantity ) {
return;
}

View File

@ -1,7 +1,8 @@
/**
* External dependencies
*/
import { select, apiFetch } from '@wordpress/data-controls';
import { apiFetch } from '@wordpress/data-controls';
import { controls } from '@wordpress/data';
import { CartResponse, Cart } from '@woocommerce/types';
/**
@ -32,5 +33,5 @@ export function* getCartData(): Generator< unknown, void, CartResponse > {
* Resolver for retrieving cart totals.
*/
export function* getCartTotals(): Generator< unknown, void, Cart > {
yield select( STORE_KEY, 'getCartData' );
yield controls.resolveSelect( STORE_KEY, 'getCartData' );
}

View File

@ -1,7 +1,7 @@
/**
* External dependencies
*/
import { select, dispatch } from '@wordpress/data-controls';
import { controls } from '@wordpress/data';
import { addQueryArgs } from '@wordpress/url';
/**
@ -18,13 +18,16 @@ import { apiFetchWithHeaders } from '../shared-controls';
* @param {number} timestamp Last update timestamp.
*/
function* invalidateModifiedCollection( timestamp ) {
const lastModified = yield select( STORE_KEY, 'getCollectionLastModified' );
const lastModified = yield controls.resolveSelect(
STORE_KEY,
'getCollectionLastModified'
);
if ( ! lastModified ) {
yield dispatch( STORE_KEY, 'receiveLastModified', timestamp );
yield controls.dispatch( STORE_KEY, 'receiveLastModified', timestamp );
} else if ( timestamp > lastModified ) {
yield dispatch( STORE_KEY, 'invalidateResolutionForStore' );
yield dispatch( STORE_KEY, 'receiveLastModified', timestamp );
yield controls.dispatch( STORE_KEY, 'invalidateResolutionForStore' );
yield controls.dispatch( STORE_KEY, 'receiveLastModified', timestamp );
}
}
@ -37,7 +40,7 @@ function* invalidateModifiedCollection( timestamp ) {
* @param {Array} ids
*/
export function* getCollection( namespace, resourceName, query, ids ) {
const route = yield select(
const route = yield controls.resolveSelect(
SCHEMA_STORE_KEY,
'getRoute',
namespace,
@ -104,6 +107,6 @@ export function* getCollectionHeader(
const args = [ namespace, resourceName, query, ids ].filter(
( arg ) => typeof arg !== 'undefined'
);
//we call this simply to do any resolution of the collection if necessary.
yield select( STORE_KEY, 'getCollection', ...args );
// we call this simply to do any resolution of the collection if necessary.
yield controls.resolveSelect( STORE_KEY, 'getCollection', ...args );
}

View File

@ -1,7 +1,7 @@
/**
* External dependencies
*/
import { select } from '@wordpress/data-controls';
import { controls } from '@wordpress/data';
/**
* Internal dependencies
@ -12,7 +12,7 @@ import { STORE_KEY as SCHEMA_STORE_KEY } from '../../schema/constants';
import { STORE_KEY } from '../constants';
import { apiFetchWithHeaders } from '../../shared-controls';
jest.mock( '@wordpress/data-controls' );
jest.mock( '@wordpress/data' );
describe( 'getCollection', () => {
describe( 'yields with expected responses', () => {
@ -27,7 +27,7 @@ describe( 'getCollection', () => {
test( 'with getRoute call invoked to retrieve route', () => {
rewind();
fulfillment.next();
expect( select ).toHaveBeenCalledWith(
expect( controls.resolveSelect ).toHaveBeenCalledWith(
SCHEMA_STORE_KEY,
'getRoute',
testArgs[ 0 ],
@ -133,7 +133,12 @@ describe( 'getCollectionHeader', () => {
rewind( 'x-wp-total', '/wc/blocks', 'products' );
const { value } = fulfillment.next();
expect( value ).toEqual(
select( STORE_KEY, 'getCollection', '/wc/blocks', 'products' )
controls.resolveSelect(
STORE_KEY,
'getCollection',
'/wc/blocks',
'products'
)
);
} );
it( 'yields expected select control when called with all args', () => {
@ -147,7 +152,7 @@ describe( 'getCollectionHeader', () => {
rewind( ...args );
const { value } = fulfillment.next();
expect( value ).toEqual(
select(
controls.resolveSelect(
STORE_KEY,
'/wc/blocks',
'products/attributes',

View File

@ -1,7 +1,8 @@
/**
* External dependencies
*/
import { select, apiFetch } from '@wordpress/data-controls';
import { apiFetch } from '@wordpress/data-controls';
import { controls } from '@wordpress/data';
/**
* Internal dependencies
@ -20,7 +21,7 @@ import { STORE_KEY } from './constants';
export function* getRoute( namespace ) {
// we call this simply to do any resolution of all endpoints if necessary.
// allows for jit population of routes for a given namespace.
yield select( STORE_KEY, 'getRoutes', namespace );
yield controls.resolveSelect( STORE_KEY, 'getRoutes', namespace );
}
/**

View File

@ -1,7 +1,8 @@
/**
* External dependencies
*/
import { select, apiFetch } from '@wordpress/data-controls';
import { apiFetch } from '@wordpress/data-controls';
import { controls } from '@wordpress/data';
/**
* Internal dependencies
@ -11,12 +12,13 @@ import { receiveRoutes } from '../actions';
import { STORE_KEY } from '../constants';
jest.mock( '@wordpress/data-controls' );
jest.mock( '@wordpress/data' );
describe( 'getRoute', () => {
it( 'yields select control response', () => {
const fulfillment = getRoute( 'wc/blocks' );
fulfillment.next();
expect( select ).toHaveBeenCalledWith(
expect( controls.resolveSelect ).toHaveBeenCalledWith(
STORE_KEY,
'getRoutes',
'wc/blocks'