Add e2e tests to check shipping costs consistency in cart and checkout (#33208)

* Add e2e tests to check consistency in shipping costs for cart and checkout pages

Goal of these tests it to check if the cart and checkout pages are
consistent in calculuating shipping costs. Three tests added:
- shipping available to country with states
- shipping available to country without states
- no shipping available (fails, see issue #33205)

Reason to add these tests is PR #25916, which reverted PR #25128,
because the original PR worked for the cart page, but not for the
checkout page.

* Update e2e-core-tests changelog

* Skip failing e2e-core-test

packages/js/e2e-core-tests/CHANGELOG.md

@@ -12,6 +12,7 @@
 - A `specs/data` folder to store page element data.
 - Tests to verify that different top-level menus and their associated sub-menus load successfully.
 - Test scaffolding via `npx wc-e2e install @woocommerce/e2e-core-tests`
+- Tests to check shipping cost calculation consistency between cart and checkout pages.
 
 ## Changed
 

packages/js/e2e-core-tests/README.md

@@ -104,6 +104,7 @@ The functions to access the core tests are:
   - `runCartCalculateShippingTest` - Shopper can calculate shipping in the cart
   - `runCartRedirectionTest` - Shopper is redirected to the cart page after adding to cart
   - `runOrderEmailReceivingTest` - Shopper can receive an email for his order
+  - `runCartAndCheckoutConsistentShippingTest` - Shopper gets consistent shipping information on cart and checkout pages
 
 ### REST API
 

packages/js/e2e-core-tests/src/specs/index.js

@@ -27,6 +27,7 @@ const runCheckoutLoginAccountTest = require( './shopper/front-end-checkout-login
 const runCartCalculateShippingTest = require( './shopper/front-end-cart-calculate-shipping.test' );
 const runCartRedirectionTest = require( './shopper/front-end-cart-redirection.test' );
 const runOrderEmailReceivingTest = require( './shopper/front-end-order-email-receiving.test' );
+const runCartAndCheckoutConsistentShippingTest = require( './shopper/front-end-cart-and-checkout-consistent-shipping.test' );
 
 // Merchant tests
 const runAddNewShippingZoneTest = require( './merchant/wp-admin-settings-shipping-zones.test' );
@@ -86,6 +87,7 @@ const runShopperTests = () => {
 	runCartCalculateShippingTest();
 	runCartRedirectionTest();
 	runOrderEmailReceivingTest();
+	runCartAndCheckoutConsistentShippingTest();
 };
 
 const runMerchantTests = () => {
@@ -175,4 +177,5 @@ module.exports = {
 	runInitiateWccomConnectionTest,
 	runTelemetryAPITest,
 	runAdminPageLoadTests,
+	runCartAndCheckoutConsistentShippingTest,
 };

packages/js/e2e-core-tests/src/specs/shopper/front-end-cart-and-checkout-consistent-shipping.test.js

@@ -0,0 +1,180 @@
+/**
+ * Internal dependencies
+ */
+const {
+	shopper,
+	createSimpleProduct,
+	selectOptionInSelect2,
+	withRestApi,
+	uiUnblocked,
+} = require( '@woocommerce/e2e-utils' );
+
+/**
+ * External dependencies
+ */
+const { it, describe, beforeAll } = require( '@jest/globals' );
+
+const shippingZoneNameUS = 'US with Flat rate';
+const shippingCountryUS = 'country:US';
+const shippingRateUS = '10';
+
+const shippingZoneNameMN = 'Mongolia with Flat rate';
+const shippingCountryMN = 'country:MN';
+const shippingRateMN = '5';
+
+const runCartAndCheckoutConsistentShippingTest = () => {
+	describe( 'Shipping calculation is consistent on cart page and checkout page', () => {
+		let productId;
+
+		beforeAll( async () => {
+			productId = await createSimpleProduct();
+			await withRestApi.deleteAllShippingZones( false );
+
+			// Add a new shipping zone for United States with Flat rate
+			await withRestApi.addShippingZoneAndMethod(
+				shippingZoneNameUS,
+				shippingCountryUS,
+				' ',
+				'flat_rate',
+				shippingRateUS,
+				[],
+				false
+			);
+
+			// Add a new shipping zone for Mongolia with Flat rate
+			await withRestApi.addShippingZoneAndMethod(
+				shippingZoneNameMN,
+				shippingCountryMN,
+				' ',
+				'flat_rate',
+				shippingRateMN,
+				[],
+				false
+			);
+		} );
+
+		beforeEach( async () => {
+			await shopper.login();
+		} );
+
+		afterEach( async () => {
+			await shopper.emptyCart();
+			await shopper.logout();
+		} );
+
+		it( 'shows shipping costs on the cart page and checkout page for United States (has states)', async () => {
+			// Add product to cart as a shopper
+			await shopper.goToShop();
+			await shopper.addToCartFromShopPage( productId );
+			await shopper.goToCart();
+
+			// Set shipping country to the United States
+			await expect( page ).toClick( 'a.shipping-calculator-button' );
+			await expect( page ).toClick(
+				'#select2-calc_shipping_country-container'
+			);
+			await selectOptionInSelect2( 'United States (US)' );
+
+			// Set shipping state to New York
+			await expect( page ).toClick(
+				'#select2-calc_shipping_state-container'
+			);
+			await selectOptionInSelect2( 'New York' );
+			await expect( page ).toClick( 'button[name="calc_shipping"]' );
+
+			await uiUnblocked();
+
+			// Verify shipping costs on cart page
+			await page.waitForSelector( '.order-total' );
+			await expect( page ).toMatchElement( '.shipping .amount', {
+				text: '$' + shippingRateUS + '.00',
+			} );
+
+			// Verify shipping costs on checkout page
+			await shopper.goToCheckout();
+			await expect( page ).toMatchElement(
+				'#shipping_method > li > label',
+				{
+					text: 'Flat rate: ',
+				}
+			);
+			await expect( page ).toMatchElement( '#shipping_method .amount', {
+				text: '$' + shippingRateUS + '.00',
+			} );
+		} );
+
+		it( 'shows shipping costs on the cart page and checkout page for Mongolia (has no states)', async () => {
+			// Add product to cart as a shopper
+			await shopper.goToShop();
+			await shopper.addToCartFromShopPage( productId );
+			await shopper.goToCart();
+
+			// Set shipping country to Mongolia
+			await expect( page ).toClick( 'a.shipping-calculator-button' );
+			await expect( page ).toClick(
+				'#select2-calc_shipping_country-container'
+			);
+			await selectOptionInSelect2( 'Mongolia' );
+
+			await expect( page ).toClick( 'button[name="calc_shipping"]' );
+
+			await uiUnblocked();
+
+			// Verify shipping costs on cart page
+			await page.waitForSelector( '.order-total' );
+			await expect( page ).toMatchElement( '.shipping .amount', {
+				text: '$' + shippingRateMN + '.00',
+			} );
+
+			// Verify shipping costs on checkout page
+			await shopper.goToCheckout();
+			await expect( page ).toMatchElement(
+				'#shipping_method > li > label',
+				{
+					text: 'Flat rate: ',
+				}
+			);
+			await expect( page ).toMatchElement( '#shipping_method .amount', {
+				text: '$' + shippingRateMN + '.00',
+			} );
+		} );
+
+		// eslint-disable-next-line jest/no-disabled-tests
+		it.skip( 'shows no shipping available on the cart page and checkout page for Netherlands', async () => {
+			// Add product to cart as a shopper
+			await shopper.goToShop();
+			await shopper.addToCartFromShopPage( productId );
+			await shopper.goToCart();
+
+			// Set shipping country to Netherlands
+			await expect( page ).toClick( 'a.shipping-calculator-button' );
+			await expect( page ).toClick(
+				'#select2-calc_shipping_country-container'
+			);
+			await selectOptionInSelect2( 'Netherlands' );
+			await expect( page ).toClick( 'button[name="calc_shipping"]' );
+
+			await uiUnblocked();
+
+			// Verify shipping costs on cart page
+			await expect( page ).toMatchElement( '.shipping > td', {
+				text: 'No shipping options were found for Netherlands.',
+			} );
+
+			// Verify shipping costs on checkout page
+			await shopper.goToCheckout();
+			await expect( page ).toMatchElement(
+				'.woocommerce-shipping-totals > td',
+				{
+					// Test fails here because actual text is 'Enter your address to view shipping options.'
+					// Logged in GitHub as issue #33205
+					text:
+						'There are no shipping options available. Please ensure that your address has been entered correctly, or contact us if you need any help.',
+				}
+			);
+		} );
+	} );
+};
+
+// eslint-disable-next-line jest/no-export
+module.exports = runCartAndCheckoutConsistentShippingTest;

plugins/woocommerce/tests/e2e/specs/front-end/cart-and-checkout-consistent-shipping.test.js

@@ -0,0 +1,8 @@
+/*
+ * Internal dependencies
+ */
+const {
+	runCartAndCheckoutConsistentShippingTest,
+} = require( '@woocommerce/e2e-core-tests' );
+
+runCartAndCheckoutConsistentShippingTest();