diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/shipping-location/index.tsx b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/shipping-location/index.tsx index 15c5d515378..4117c75cd58 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/shipping-location/index.tsx +++ b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/shipping-location/index.tsx @@ -19,7 +19,7 @@ const ShippingLocation = ( { { sprintf( /* translators: %s location. */ - __( 'Shipping to %s', 'woocommerce' ), + __( 'Delivers to %s', 'woocommerce' ), formattedLocation ) + ' ' } diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/index.tsx b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/index.tsx index 8abdfeb8180..f3ab7641790 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/index.tsx +++ b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/index.tsx @@ -78,7 +78,12 @@ export const TotalsShipping = ( { .flatMap( ( rate ) => rate.name ); } ); - const addressComplete = isAddressComplete( shippingAddress ); + const addressComplete = isAddressComplete( shippingAddress, [ + 'state', + 'country', + 'postcode', + 'city', + ] ); const shippingMethodsMissing = areShippingMethodsMissing( hasRates, prefersCollection, @@ -100,7 +105,7 @@ export const TotalsShipping = ( { ) } > diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/shipping-placeholder.tsx b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/shipping-placeholder.tsx index 34e7d83f6cf..0d4274529fd 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/shipping-placeholder.tsx +++ b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/shipping-placeholder.tsx @@ -33,7 +33,10 @@ export const ShippingPlaceholder = ( { return ( diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/style.scss b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/style.scss index 2eed1a8fc2a..aef027ffdd0 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/style.scss +++ b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/style.scss @@ -39,6 +39,7 @@ padding: 0; text-decoration: underline; cursor: pointer; + text-align: left; } .wc-block-components-totals-shipping__change-address-button { @include link-button(); diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/test/index.tsx b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/test/index.tsx index c4315de2c05..209d44a6e50 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/test/index.tsx +++ b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/test/index.tsx @@ -318,7 +318,7 @@ describe( 'TotalsShipping', () => { ); expect( screen.getByText( - 'Shipping to W1T 4JG, London, United Kingdom (UK)' + 'Delivers to W1T 4JG, London, United Kingdom (UK)' ) ).toBeInTheDocument(); expect( screen.getByText( 'Change address' ) ).toBeInTheDocument(); @@ -368,57 +368,9 @@ describe( 'TotalsShipping', () => { screen.queryByText( 'Change address' ) ).not.toBeInTheDocument(); expect( - screen.getByText( 'Add an address for shipping options' ) + screen.getByText( 'Enter address to check delivery options' ) ).toBeInTheDocument(); } ); - it( 'does not show the calculator button when default rates are available and no address has been entered', () => { - baseContextHooks.useStoreCart.mockReturnValue( { - cartItems: mockPreviewCart.items, - cartTotals: [ mockPreviewCart.totals ], - cartCoupons: mockPreviewCart.coupons, - cartFees: mockPreviewCart.fees, - cartNeedsShipping: mockPreviewCart.needs_shipping, - shippingRates: mockPreviewCart.shipping_rates, - shippingAddress: { - ...shippingAddress, - city: '', - country: '', - postcode: '', - }, - billingAddress: mockPreviewCart.billing_address, - cartHasCalculatedShipping: mockPreviewCart.has_calculated_shipping, - isLoadingRates: false, - } ); - render( - - - - ); - expect( - screen.queryByText( 'Change address' ) - ).not.toBeInTheDocument(); - expect( - screen.queryByText( 'Add an address for shipping options' ) - ).not.toBeInTheDocument(); - } ); it( 'does show the calculator button when default rates are available and has formatted address', () => { baseContextHooks.useStoreCart.mockReturnValue( { cartItems: mockPreviewCart.items, @@ -463,7 +415,7 @@ describe( 'TotalsShipping', () => { ); expect( screen.queryByText( 'Change address' ) ).toBeInTheDocument(); expect( - screen.queryByText( 'Add an address for shipping options' ) + screen.queryByText( 'Enter address to check delivery options' ) ).not.toBeInTheDocument(); } ); } ); diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/test/shipping-address.tsx b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/test/shipping-address.tsx index c3be82cf4cd..2466cb1b847 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/test/shipping-address.tsx +++ b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/shipping/test/shipping-address.tsx @@ -48,7 +48,7 @@ describe( 'ShippingAddress', () => { shippingAddress={ testShippingAddress } /> ); - expect( screen.getByText( /Shipping to 94107/ ) ).toBeInTheDocument(); + expect( screen.getByText( /Delivers to 94107/ ) ).toBeInTheDocument(); expect( screen.queryByText( /Collection from/ ) ).not.toBeInTheDocument(); diff --git a/plugins/woocommerce-blocks/assets/js/base/utils/address.ts b/plugins/woocommerce-blocks/assets/js/base/utils/address.ts index a320633d1b3..2a3e88c5d8f 100644 --- a/plugins/woocommerce-blocks/assets/js/base/utils/address.ts +++ b/plugins/woocommerce-blocks/assets/js/base/utils/address.ts @@ -9,7 +9,12 @@ import { type CartResponseShippingAddress, isObject, } from '@woocommerce/types'; -import { ShippingAddress, BillingAddress } from '@woocommerce/settings'; +import { + ShippingAddress, + BillingAddress, + CoreAddress, + KeyedFormField, +} from '@woocommerce/settings'; import { decodeEntities } from '@wordpress/html-entities'; import { SHIPPING_COUNTRIES, @@ -181,9 +186,15 @@ export const formatShippingAddress = ( /** * Checks that all required fields in an address are completed based on the settings in countryLocale. + * + * @param {Object} address The address to check. + * @param {Array} keysToCheck Optional override to include only specific keys for checking. + * If there are other required fields in the address, but not specified in this arg then + * they will be ignored. */ export const isAddressComplete = ( - address: ShippingAddress | BillingAddress + address: ShippingAddress | BillingAddress, + keysToCheck: ( keyof CoreAddress )[] = [] ): boolean => { if ( ! address.country ) { return false; @@ -194,7 +205,17 @@ export const isAddressComplete = ( address.country ); - return addressForm.every( + // Filter the address form so only fields from the keysToCheck arg remain, if that arg is empty, then default to the + // full address form. + const filteredAddressForm = + keysToCheck.length > 0 + ? ( Object.values( addressForm ) as KeyedFormField[] ).filter( + ( { key } ) => + keysToCheck.includes( key as keyof CoreAddress ) + ) + : addressForm; + + return filteredAddressForm.every( ( { key = '', hidden = false, required = false } ) => { if ( hidden || ! required ) { return true; diff --git a/plugins/woocommerce-blocks/assets/js/base/utils/test/address.ts b/plugins/woocommerce-blocks/assets/js/base/utils/test/address.ts index 6b23d5bfd96..df5653a0a73 100644 --- a/plugins/woocommerce-blocks/assets/js/base/utils/test/address.ts +++ b/plugins/woocommerce-blocks/assets/js/base/utils/test/address.ts @@ -106,6 +106,31 @@ describe( 'isAddressComplete', () => { address.state = 'CA'; expect( isAddressComplete( address ) ).toBe( true ); } ); + + it( 'Correctly assesses only fields specified in the keysToCheck arg', () => { + const address = { + first_name: 'John', + last_name: 'Doe', + company: 'Company', + address_1: '409 Main Street', + address_2: 'Apt 1', + city: 'California', + postcode: '90210', + country: 'US', + state: '', + email: 'john.doe@company', + phone: '+1234567890', + }; + // US address requires state, but if we skip it in keysToCheck it should validate. + expect( + isAddressComplete( address, [ + 'first_name', + 'last_name', + 'city', + 'postcode', + ] ) + ).toBe( true ); + } ); } ); describe( 'formatShippingAddress', () => { diff --git a/plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-order-summary-block/test/block.js b/plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-order-summary-block/test/block.js index 14e5a6be2c3..b84834384bd 100644 --- a/plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-order-summary-block/test/block.js +++ b/plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-order-summary-block/test/block.js @@ -517,7 +517,7 @@ describe( 'Checkout Order Summary', () => { await findByText( container, textContentMatcherAcrossSiblings( - 'Shipping $40.00 Free shipping' + 'Delivery $40.00 Free shipping' ) ) ).toBeInTheDocument(); diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/cart/cart-checkout-block-shipping.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/cart/cart-checkout-block-shipping.block_theme.spec.ts index 2d404e92bae..750eb786bed 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/cart/cart-checkout-block-shipping.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/cart/cart-checkout-block-shipping.block_theme.spec.ts @@ -58,7 +58,7 @@ test.describe( 'Shopper → Shipping', () => { await userFrontendUtils.goToCart(); await expect( - userPage.getByLabel( 'Add an address for shipping options' ) + userPage.getByLabel( 'Enter address to check delivery options' ) ).toBeVisible(); } ); diff --git a/plugins/woocommerce-blocks/tests/e2e/tests/cart/cart-checkout-block-translations.shopper.block_theme.spec.ts b/plugins/woocommerce-blocks/tests/e2e/tests/cart/cart-checkout-block-translations.shopper.block_theme.spec.ts index b452173f7ce..ef6b171be69 100644 --- a/plugins/woocommerce-blocks/tests/e2e/tests/cart/cart-checkout-block-translations.shopper.block_theme.spec.ts +++ b/plugins/woocommerce-blocks/tests/e2e/tests/cart/cart-checkout-block-translations.shopper.block_theme.spec.ts @@ -105,7 +105,8 @@ test.describe( 'Shopper → Translations', () => { ).toBeVisible(); await expect( page.getByText( 'Subtotaal' ) ).toBeVisible(); - await expect( page.getByText( 'Verzending' ) ).toBeVisible(); + // TODO: Skipped test for now because translation is not ready. New string will be included with WC 9.4 - https://github.com/woocommerce/woocommerce/issues/51089 + //await expect( page.getByText( 'Verzending' ) ).toBeVisible(); await expect( page.getByText( 'Totaal', { exact: true } ) diff --git a/plugins/woocommerce/changelog/update-shipping-wording b/plugins/woocommerce/changelog/update-shipping-wording new file mode 100644 index 00000000000..915c0d36332 --- /dev/null +++ b/plugins/woocommerce/changelog/update-shipping-wording @@ -0,0 +1,4 @@ +Significance: minor +Type: update + +Updated wording on the Cart/Checkout shipping sidebars diff --git a/plugins/woocommerce/tests/e2e-pw/tests/shopper/cart-block-calculate-shipping.spec.js b/plugins/woocommerce/tests/e2e-pw/tests/shopper/cart-block-calculate-shipping.spec.js index 2b736893759..f7a91ab3c2d 100644 --- a/plugins/woocommerce/tests/e2e-pw/tests/shopper/cart-block-calculate-shipping.spec.js +++ b/plugins/woocommerce/tests/e2e-pw/tests/shopper/cart-block-calculate-shipping.spec.js @@ -140,7 +140,9 @@ test.describe( await page.goto( cartBlockPage.slug ); // Set shipping country to Netherlands - await page.getByLabel( 'Add an address for shipping' ).click(); + await page + .getByLabel( 'Enter address to check delivery options' ) + .click(); await page .getByRole( 'combobox' ) .first() @@ -174,7 +176,9 @@ test.describe( await page.goto( cartBlockPage.slug ); // Set shipping country to Portugal - await page.getByLabel( 'Add an address for shipping' ).click(); + await page + .getByLabel( 'Enter address to check delivery options' ) + .click(); await page .getByRole( 'combobox' ) .first() @@ -188,7 +192,7 @@ test.describe( page.getByRole( 'group' ).getByText( 'Flat rate' ) ).toBeVisible(); await expect( - page.getByText( 'Shipping$5.00Flat' ) + page.getByText( 'Delivery$5.00Flat' ) ).toBeVisible(); await expect( page.getByText( `$${ firstProductWithFlatRate }` ) @@ -202,7 +206,7 @@ test.describe( // Verify updated shipping costs await expect( - page.getByText( 'ShippingFreeLocal' ) + page.getByText( 'DeliveryFreeLocal' ) ).toBeVisible(); await expect( page.getByText( '$' ).nth( 2 ) ).toContainText( firstProductPrice @@ -220,7 +224,9 @@ test.describe( await page.goto( cartBlockPage.slug ); // Set shipping country to Portugal - await page.getByLabel( 'Add an address for shipping' ).click(); + await page + .getByLabel( 'Enter address to check delivery options' ) + .click(); await page .getByRole( 'combobox' ) .first() @@ -254,7 +260,9 @@ test.describe( await page.goto( cartBlockPage.slug ); // Set shipping country to Portugal - await page.getByLabel( 'Add an address for shipping' ).click(); + await page + .getByLabel( 'Enter address to check delivery options' ) + .click(); await page .getByRole( 'combobox' ) .first() @@ -268,7 +276,7 @@ test.describe( page.getByRole( 'group' ).getByText( 'Flat rate' ) ).toBeVisible(); await expect( - page.getByText( 'Shipping$5.00Flat' ) + page.getByText( 'Delivery$5.00Flat' ) ).toBeVisible(); await expect( page.getByText( @@ -288,7 +296,7 @@ test.describe( // Verify updated shipping costs await expect( - page.getByText( 'ShippingFreeLocal' ) + page.getByText( 'DeliveryFreeLocal' ) ).toBeVisible(); await expect( page