Merge pull request #29616 from woocommerce/e2e/e2e-shopper-calculate-shipping

Add new e2e test shopper cart calculate shipping

tests/e2e/core-tests/CHANGELOG.md

@@ -15,6 +15,7 @@
 
 - Shopper Checkout Login Account
 - Shopper My Account Create Account
+- Shopper Cart Calculate Shipping
 - Shopper Cart Redirection
 
 ## Fixed

tests/e2e/core-tests/README.md

@@ -85,6 +85,7 @@ The functions to access the core tests are:
   - `runCheckoutCreateAccountTest` - Shopper can create an account during checkout
   - `runCheckoutLoginAccountTest` - Shopper can login to an account during checkout
   - `runMyAccountCreateAccountTest` - Shopper can create an account via my account page
+  - `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
 

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

@@ -21,6 +21,7 @@ const runSingleProductPageTest = require( './shopper/front-end-single-product.te
 const runVariableProductUpdateTest = require( './shopper/front-end-variable-product-updates.test' );
 const runCheckoutCreateAccountTest = require( './shopper/front-end-checkout-create-account.test' );
 const runCheckoutLoginAccountTest = require( './shopper/front-end-checkout-login-account.test' );
+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' );
 
@@ -71,7 +72,8 @@ const runShopperTests = () => {
 	runVariableProductUpdateTest();
 	runCheckoutCreateAccountTest();
 	runCheckoutLoginAccountTest();
-	runCartRedirectionTest();
+	runCartCalculateShippingTest();
+  runCartRedirectionTest();
 	runOrderEmailReceivingTest();
 };
 
@@ -148,6 +150,7 @@ module.exports = {
 	runCheckoutCreateAccountTest,
 	runImportProductsTest,
 	runCheckoutLoginAccountTest,
+	runCartCalculateShippingTest,
 	runCartRedirectionTest,
 	runMyAccountCreateAccountTest,
 	runOrderEmailReceivingTest,

tests/e2e/core-tests/specs/merchant/wp-admin-settings-shipping-zones.test.js

@@ -10,10 +10,18 @@ const {
 	addShippingZoneAndMethod,
 	clearAndFillInput,
 	selectOptionInSelect2,
-	evalAndClick,
-	uiUnblocked,
+	deleteAllShippingZones,
 } = require( '@woocommerce/e2e-utils' );
 
+/**
+ * External dependencies
+ */
+const {
+	it,
+	describe,
+	beforeAll,
+} = require( '@jest/globals' );
+
 const config = require( 'config' );
 const simpleProductPrice = config.has( 'products.simple.price' ) ? config.get( 'products.simple.price' ) : '9.99';
 const simpleProductName = config.get( 'products.simple.name' );
@@ -28,27 +36,7 @@ const runAddNewShippingZoneTest = () => {
 		beforeAll(async () => {
 			await merchant.login();
 			await createSimpleProduct();
-			await merchant.openSettings('shipping');
-
-			// Delete existing shipping zones.
-			try {
-				let zone = await page.$( '.wc-shipping-zone-delete' );
-				if ( zone ) {
-					// WP action links aren't clickable because they are hidden with a left=-9999 style.
-					await page.evaluate(() => {
-						document.querySelector('.wc-shipping-zone-name .row-actions')
-							.style
-							.left = '0';
-					});
-					while ( zone ) {
-						await evalAndClick( '.wc-shipping-zone-delete' );
-						await uiUnblocked();
-						zone = await page.$( '.wc-shipping-zone-delete' );
-					}
-				}
-			} catch (error) {
-				// Prevent an error here causing the test to fail.
-			}
+			await deleteAllShippingZones();
 		});
 
 		it('add shipping zone for San Francisco with free Local pickup', async () => {

tests/e2e/core-tests/specs/shopper/front-end-cart-calculate-shipping.test.js

@@ -0,0 +1,134 @@
+/* eslint-disable jest/no-export, jest/no-disabled-tests, jest/expect-expect */
+
+/**
+ * Internal dependencies
+ */
+const {
+	shopper,
+	merchant,
+	createSimpleProduct,
+	addShippingZoneAndMethod,
+	clearAndFillInput,
+	uiUnblocked,
+	selectOptionInSelect2,
+} = require( '@woocommerce/e2e-utils' );
+
+/**
+ * External dependencies
+ */
+const {
+	it,
+	describe,
+	beforeAll,
+} = require( '@jest/globals' );
+
+const config = require( 'config' );
+const firstProductPrice = config.has( 'products.simple.price' ) ? config.get( 'products.simple.price' ) : '9.99';
+const secondProductPrice = '4.99';
+const fourProductPrice = firstProductPrice * 4;
+var twoProductsPrice = (+firstProductPrice) + (+secondProductPrice);
+var firstProductPriceWithFlatRate = (+firstProductPrice) + (+5);
+var fourProductPriceWithFlatRate = (+fourProductPrice) + (+5);
+var twoProductsPriceWithFlatRate = (+twoProductsPrice) + (+5);
+const firstProductName = 'First Product';
+const secondProductName = 'Second Product';
+const shippingZoneNameDE = 'Germany Free Shipping';
+const shippingCountryDE = 'country:DE';
+const shippingZoneNameFR = 'France Flat Local';
+const shippingCountryFR = 'country:FR';
+
+const runCartCalculateShippingTest = () => {
+	describe('Cart Calculate Shipping', () => {
+		beforeAll(async () => {
+			await merchant.login();
+			await createSimpleProduct(firstProductName);
+			await createSimpleProduct(secondProductName, secondProductPrice);
+			await merchant.openNewShipping();
+
+			// Add a new shipping zone Germany with Free shipping
+			await addShippingZoneAndMethod(shippingZoneNameDE, shippingCountryDE, ' ', 'free_shipping');
+
+			// Add a new shipping zone for France with Flat rate & Local pickup
+			await addShippingZoneAndMethod(shippingZoneNameFR, shippingCountryFR, ' ', 'flat_rate');
+			await page.waitFor(1000); // to avoid flakiness in headless
+			await page.click('a.wc-shipping-zone-method-settings', {text: 'Flat rate'});
+			await clearAndFillInput('#woocommerce_flat_rate_cost', '5');
+			await page.click('.wc-backbone-modal-main button#btn-ok');
+			// Add additional method Local pickup for the same location
+			await page.waitFor(1000); // to avoid flakiness in headless
+			await page.click('button.wc-shipping-zone-add-method', {text:'Add shipping method'});
+			await page.waitForSelector('.wc-shipping-zone-method-selector');
+			await page.select('select[name="add_method_id"]', 'local_pickup');
+			await page.click('button#btn-ok');
+			await page.waitForSelector('#zone_locations');
+		});
+
+		it('allows customer to calculate Free Shipping if in Germany', async () => {
+			await shopper.goToShop();
+			await shopper.addToCartFromShopPage(firstProductName);
+			await shopper.goToCart();
+
+			// Set shipping country to Germany
+			await expect(page).toClick('a.shipping-calculator-button');
+			await expect(page).toClick('#select2-calc_shipping_country-container');
+			await selectOptionInSelect2('Germany');
+			await expect(page).toClick('button[name="calc_shipping"]');
+
+			// Verify shipping costs
+			await page.waitForSelector('.order-total');
+			await expect(page).toMatchElement('.shipping ul#shipping_method > li', {text: 'Free shipping'});
+			await expect(page).toMatchElement('.order-total .amount', {text: `$${firstProductPrice}`});
+		});
+
+		it('allows customer to calculate Flat rate and Local pickup if in France', async () => {
+			await page.reload();
+
+			// Set shipping country to France
+			await expect(page).toClick('a.shipping-calculator-button');
+			await expect(page).toClick('#select2-calc_shipping_country-container');
+			await selectOptionInSelect2('France');
+			await expect(page).toClick('button[name="calc_shipping"]');
+
+			// Verify shipping costs
+			await page.waitForSelector('.order-total');
+			await expect(page).toMatchElement('.shipping .amount', {text: '$5.00'});
+			await expect(page).toMatchElement('.order-total .amount', {text: `$${firstProductPriceWithFlatRate}`});
+		});
+
+		it('should show correct total cart price after updating quantity', async () => {
+			await shopper.setCartQuantity(firstProductName, 4);
+			await expect(page).toClick('button', {text: 'Update cart'});
+			await uiUnblocked();
+			await expect(page).toMatchElement('.order-total .amount', {text: `$${fourProductPriceWithFlatRate}`});
+		});
+
+		it('should show correct total cart price with 2 products and flat rate', async () => {
+			await shopper.goToShop();
+			await shopper.addToCartFromShopPage(secondProductName);
+			await shopper.goToCart();
+
+			await shopper.setCartQuantity(firstProductName, 1);
+			await expect(page).toClick('button', {text: 'Update cart'});
+			await uiUnblocked();
+			await page.waitForSelector('.order-total');
+			await expect(page).toMatchElement('.shipping .amount', {text: '$5.00'});
+			await expect(page).toMatchElement('.order-total .amount', {text: `$${twoProductsPriceWithFlatRate}`});
+		});
+
+		it('should show correct total cart price with 2 products without flat rate', async () => {
+			await page.reload();
+
+			// Set shipping country to Spain
+			await expect(page).toClick('a.shipping-calculator-button');
+			await expect(page).toClick('#select2-calc_shipping_country-container');
+			await selectOptionInSelect2('Spain');
+			await expect(page).toClick('button[name="calc_shipping"]');
+
+			// Verify shipping costs
+			await page.waitForSelector('.order-total');
+			await expect(page).toMatchElement('.order-total .amount', {text: `$${twoProductsPrice}`});
+		});
+	});
+};
+
+module.exports = runCartCalculateShippingTest;

tests/e2e/specs/front-end/test-cart-calculate-shipping.js

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

tests/e2e/utils/CHANGELOG.md

@@ -3,6 +3,7 @@
 ## Added
 
 - `emptyCart()` Shopper flow helper that empties the cart
+- `deleteAllShippingZones` Delete all the existing shipping zones
 - constants
   - `WP_ADMIN_POST_TYPE`
   - `WP_ADMIN_NEW_POST_TYPE`

tests/e2e/utils/README.md

@@ -180,6 +180,7 @@ This package provides support for enabling retries in tests:
 | `removeCoupon` | | helper method that removes a single coupon within cart or checkout |
 | `selectOrderAction` | `action` | Helper method to select an order action in the `Order Actions` postbox |
 | `clickUpdateOrder` | `noticeText`, `waitForSave` | Helper method to click the Update button on the order details page |
+| `deleteAllShippingZones` | | Delete all the existing shipping zones |
 
 ### Test Utilities
 

tests/e2e/utils/src/components.js

@@ -13,6 +13,7 @@ import {
 	selectOptionInSelect2,
 	setCheckbox,
 	unsetCheckbox,
+	evalAndClick,
 	clearAndFillInput,
 } from './page-utils';
 import factories from './factories';
@@ -540,6 +541,33 @@ const deleteAllEmailLogs = async () => {
 	}
 };
 
+/**
+ * Delete all the existing shipping zones.
+ */
+const deleteAllShippingZones = async () => {
+	await merchant.openSettings('shipping');
+
+	// Delete existing shipping zones.
+	try {
+		let zone = await page.$( '.wc-shipping-zone-delete' );
+		if ( zone ) {
+			// WP action links aren't clickable because they are hidden with a left=-9999 style.
+			await page.evaluate(() => {
+				document.querySelector('.wc-shipping-zone-name .row-actions')
+					.style
+					.left = '0';
+			});
+			while ( zone ) {
+				await evalAndClick( '.wc-shipping-zone-delete' );
+				await uiUnblocked();
+				zone = await page.$( '.wc-shipping-zone-delete' );
+			};
+		};
+	} catch (error) {
+		// Prevent an error here causing the test to fail.
+	};
+};
+
 export {
 	completeOnboardingWizard,
 	createSimpleProduct,
@@ -553,4 +581,5 @@ export {
 	createSimpleProductWithCategory,
 	clickUpdateOrder,
 	deleteAllEmailLogs,
+	deleteAllShippingZones,
 };