Display address card for virtual products if shopper's address is known (#50127)
* Display address card for virtual products * Remove obsolete dependency * Optimise dependencies * Add changefile(s) from automation for the following project(s): woocommerce-blocks * Adjust core e2e tests --------- Co-authored-by: github-actions <github-actions@github.com>
This commit is contained in:
parent
6e2fbcae52
commit
3dd6a4037b
|
@ -52,6 +52,10 @@ const AddressCard = ( {
|
||||||
address,
|
address,
|
||||||
formatToUse
|
formatToUse
|
||||||
);
|
);
|
||||||
|
const label =
|
||||||
|
target === 'shipping'
|
||||||
|
? __( 'Edit shipping address', 'woocommerce' )
|
||||||
|
: __( 'Edit billing address', 'woocommerce' );
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="wc-block-components-address-card">
|
<div className="wc-block-components-address-card">
|
||||||
|
@ -82,7 +86,7 @@ const AddressCard = ( {
|
||||||
className="wc-block-components-address-card__edit"
|
className="wc-block-components-address-card__edit"
|
||||||
aria-controls={ target }
|
aria-controls={ target }
|
||||||
aria-expanded={ isExpanded }
|
aria-expanded={ isExpanded }
|
||||||
aria-label={ __( 'Edit address', 'woocommerce' ) }
|
aria-label={ label }
|
||||||
onClick={ ( e ) => {
|
onClick={ ( e ) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
onEdit();
|
onEdit();
|
||||||
|
|
|
@ -7,6 +7,7 @@ import {
|
||||||
useCheckoutAddress,
|
useCheckoutAddress,
|
||||||
useEditorContext,
|
useEditorContext,
|
||||||
noticeContexts,
|
noticeContexts,
|
||||||
|
useShippingData,
|
||||||
} from '@woocommerce/base-context';
|
} from '@woocommerce/base-context';
|
||||||
import Noninteractive from '@woocommerce/base-components/noninteractive';
|
import Noninteractive from '@woocommerce/base-components/noninteractive';
|
||||||
import type { ShippingAddress, FormFieldsConfig } from '@woocommerce/settings';
|
import type { ShippingAddress, FormFieldsConfig } from '@woocommerce/settings';
|
||||||
|
@ -42,6 +43,7 @@ const Block = ( {
|
||||||
useBillingAsShipping,
|
useBillingAsShipping,
|
||||||
} = useCheckoutAddress();
|
} = useCheckoutAddress();
|
||||||
const { isEditor } = useEditorContext();
|
const { isEditor } = useEditorContext();
|
||||||
|
const { needsShipping } = useShippingData();
|
||||||
|
|
||||||
// Syncs shipping address with billing address if "Force shipping to the customer billing address" is enabled.
|
// Syncs shipping address with billing address if "Force shipping to the customer billing address" is enabled.
|
||||||
useEffectOnce( () => {
|
useEffectOnce( () => {
|
||||||
|
@ -110,7 +112,7 @@ const Block = ( {
|
||||||
shippingAddress
|
shippingAddress
|
||||||
);
|
);
|
||||||
const defaultEditingAddress =
|
const defaultEditingAddress =
|
||||||
isEditor || ! hasAddress || billingMatchesShipping;
|
isEditor || ! hasAddress || ( needsShipping && billingMatchesShipping );
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
|
@ -98,7 +98,11 @@ const CheckoutBlock = () => {
|
||||||
<Payment />
|
<Payment />
|
||||||
<AdditionalInformation />
|
<AdditionalInformation />
|
||||||
<OrderNote />
|
<OrderNote />
|
||||||
<Terms checkbox={ true } text={ termsCheckboxDefaultText } />
|
<Terms
|
||||||
|
checkbox={ true }
|
||||||
|
showSeparator={ false }
|
||||||
|
text={ termsCheckboxDefaultText }
|
||||||
|
/>
|
||||||
<Actions />
|
<Actions />
|
||||||
</Fields>
|
</Fields>
|
||||||
<Totals>
|
<Totals>
|
||||||
|
@ -148,7 +152,7 @@ describe( 'Testing Checkout', () => {
|
||||||
expect( fetchMock ).toHaveBeenCalledTimes( 1 );
|
expect( fetchMock ).toHaveBeenCalledTimes( 1 );
|
||||||
} );
|
} );
|
||||||
|
|
||||||
it( 'Renders the address card if the address is filled', async () => {
|
it( 'Renders the shipping address card if the address is filled and the cart contains a shippable product', async () => {
|
||||||
act( () => {
|
act( () => {
|
||||||
const cartWithAddress = {
|
const cartWithAddress = {
|
||||||
...previewCart,
|
...previewCart,
|
||||||
|
@ -190,7 +194,7 @@ describe( 'Testing Checkout', () => {
|
||||||
await waitFor( () => expect( fetchMock ).toHaveBeenCalled() );
|
await waitFor( () => expect( fetchMock ).toHaveBeenCalled() );
|
||||||
|
|
||||||
expect(
|
expect(
|
||||||
screen.getByRole( 'button', { name: 'Edit address' } )
|
screen.getByRole( 'button', { name: 'Edit shipping address' } )
|
||||||
).toBeInTheDocument();
|
).toBeInTheDocument();
|
||||||
|
|
||||||
expect(
|
expect(
|
||||||
|
@ -258,6 +262,30 @@ describe( 'Testing Checkout', () => {
|
||||||
expect( fetchMock ).toHaveBeenCalledTimes( 1 );
|
expect( fetchMock ).toHaveBeenCalledTimes( 1 );
|
||||||
} );
|
} );
|
||||||
|
|
||||||
|
it( 'Renders the billing address card if the address is filled and the cart contains a virtual product', async () => {
|
||||||
|
act( () => {
|
||||||
|
const cartWithVirtualProduct = {
|
||||||
|
...previewCart,
|
||||||
|
needs_shipping: false,
|
||||||
|
};
|
||||||
|
fetchMock.mockResponse( ( req ) => {
|
||||||
|
if ( req.url.match( /wc\/store\/v1\/cart/ ) ) {
|
||||||
|
return Promise.resolve(
|
||||||
|
JSON.stringify( cartWithVirtualProduct )
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return Promise.resolve( '' );
|
||||||
|
} );
|
||||||
|
} );
|
||||||
|
render( <CheckoutBlock /> );
|
||||||
|
|
||||||
|
await waitFor( () => expect( fetchMock ).toHaveBeenCalled() );
|
||||||
|
|
||||||
|
expect(
|
||||||
|
screen.getByRole( 'button', { name: 'Edit billing address' } )
|
||||||
|
).toBeInTheDocument();
|
||||||
|
} );
|
||||||
|
|
||||||
it( 'Ensures checkbox labels have unique IDs', async () => {
|
it( 'Ensures checkbox labels have unique IDs', async () => {
|
||||||
await act( async () => {
|
await act( async () => {
|
||||||
// Set required settings
|
// Set required settings
|
||||||
|
|
|
@ -0,0 +1,4 @@
|
||||||
|
Significance: minor
|
||||||
|
Type: fix
|
||||||
|
|
||||||
|
Display address card for virtual products if shopper's address is known
|
|
@ -440,7 +440,7 @@ test.describe(
|
||||||
|
|
||||||
// verify shipping details
|
// verify shipping details
|
||||||
await page
|
await page
|
||||||
.getByLabel( 'Edit address', { exact: true } )
|
.getByLabel( 'Edit shipping address', { exact: true } )
|
||||||
.first()
|
.first()
|
||||||
.click();
|
.click();
|
||||||
await expect(
|
await expect(
|
||||||
|
@ -471,7 +471,7 @@ test.describe(
|
||||||
|
|
||||||
// verify billing details
|
// verify billing details
|
||||||
await page
|
await page
|
||||||
.getByLabel( 'Edit address', { exact: true } )
|
.getByLabel( 'Edit billing address', { exact: true } )
|
||||||
.last()
|
.last()
|
||||||
.click();
|
.click();
|
||||||
await expect(
|
await expect(
|
||||||
|
@ -782,7 +782,7 @@ test.describe(
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|
||||||
await page
|
await page
|
||||||
.getByLabel( 'Edit address', { exact: true } )
|
.getByLabel( 'Edit shipping address', { exact: true } )
|
||||||
.first()
|
.first()
|
||||||
.click();
|
.click();
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue