diff --git a/plugins/woocommerce-blocks/package-lock.json b/plugins/woocommerce-blocks/package-lock.json index 8e880a5ce7a..d3f6f5a5a02 100644 --- a/plugins/woocommerce-blocks/package-lock.json +++ b/plugins/woocommerce-blocks/package-lock.json @@ -71,7 +71,7 @@ "@typescript-eslint/eslint-plugin": "4.14.1", "@typescript-eslint/parser": "4.14.1", "@woocommerce/api": "0.2.0", - "@woocommerce/e2e-utils": "0.1.6", + "@woocommerce/e2e-utils": "^0.2.0", "@woocommerce/eslint-plugin": "1.2.0", "@woocommerce/woocommerce-rest-api": "1.0.1", "@wordpress/api-fetch": "5.2.6", @@ -9013,12 +9013,12 @@ "dev": true }, "node_modules/@woocommerce/e2e-utils": { - "version": "0.1.6", - "resolved": "https://registry.npmjs.org/@woocommerce/e2e-utils/-/e2e-utils-0.1.6.tgz", - "integrity": "sha512-gWSEgFIjMqaqiiIyrpa1epIHkmBBAfk6WfRojva1f5ZmffSJCc0VbX2jQQRdFm1BuEYr8KGCCYo+q8NIjlMZ7g==", + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/@woocommerce/e2e-utils/-/e2e-utils-0.2.0.tgz", + "integrity": "sha512-bEHzAdGSJhWksDJDPi5vxpbOM2sItQqzn0jDWthrYgchP489mBbRMSVnatYm3vAgWT9DVuvPbTrzzgETiTT1Jg==", "dev": true, "dependencies": { - "@wordpress/deprecated": "^2.10.0", + "@wordpress/deprecated": "^3.2.3", "@wordpress/e2e-test-utils": "^4.16.1", "config": "3.3.3", "faker": "^5.1.0", @@ -9028,16 +9028,6 @@ "@woocommerce/api": "^0.2.0" } }, - "node_modules/@woocommerce/e2e-utils/node_modules/@wordpress/deprecated": { - "version": "2.12.3", - "resolved": "https://registry.npmjs.org/@wordpress/deprecated/-/deprecated-2.12.3.tgz", - "integrity": "sha512-qr+yDfTQfI3M4h6oY6IeHWwoHr4jxbILjSlV+Ht6Jjto9Owap6OuzSqR13Ev4xqIoG4C7b5B3gZXVfwVDae1zg==", - "dev": true, - "dependencies": { - "@babel/runtime": "^7.13.10", - "@wordpress/hooks": "^2.12.3" - } - }, "node_modules/@woocommerce/e2e-utils/node_modules/@wordpress/e2e-test-utils": { "version": "4.16.1", "resolved": "https://registry.npmjs.org/@wordpress/e2e-test-utils/-/e2e-test-utils-4.16.1.tgz", @@ -49194,28 +49184,18 @@ } }, "@woocommerce/e2e-utils": { - "version": "0.1.6", - "resolved": "https://registry.npmjs.org/@woocommerce/e2e-utils/-/e2e-utils-0.1.6.tgz", - "integrity": "sha512-gWSEgFIjMqaqiiIyrpa1epIHkmBBAfk6WfRojva1f5ZmffSJCc0VbX2jQQRdFm1BuEYr8KGCCYo+q8NIjlMZ7g==", + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/@woocommerce/e2e-utils/-/e2e-utils-0.2.0.tgz", + "integrity": "sha512-bEHzAdGSJhWksDJDPi5vxpbOM2sItQqzn0jDWthrYgchP489mBbRMSVnatYm3vAgWT9DVuvPbTrzzgETiTT1Jg==", "dev": true, "requires": { - "@wordpress/deprecated": "^2.10.0", + "@wordpress/deprecated": "^3.2.3", "@wordpress/e2e-test-utils": "^4.16.1", "config": "3.3.3", "faker": "^5.1.0", "fishery": "^1.2.0" }, "dependencies": { - "@wordpress/deprecated": { - "version": "2.12.3", - "resolved": "https://registry.npmjs.org/@wordpress/deprecated/-/deprecated-2.12.3.tgz", - "integrity": "sha512-qr+yDfTQfI3M4h6oY6IeHWwoHr4jxbILjSlV+Ht6Jjto9Owap6OuzSqR13Ev4xqIoG4C7b5B3gZXVfwVDae1zg==", - "dev": true, - "requires": { - "@babel/runtime": "^7.13.10", - "@wordpress/hooks": "^2.12.3" - } - }, "@wordpress/e2e-test-utils": { "version": "4.16.1", "resolved": "https://registry.npmjs.org/@wordpress/e2e-test-utils/-/e2e-test-utils-4.16.1.tgz", diff --git a/plugins/woocommerce-blocks/package.json b/plugins/woocommerce-blocks/package.json index 8a534917e12..7284479b5a3 100644 --- a/plugins/woocommerce-blocks/package.json +++ b/plugins/woocommerce-blocks/package.json @@ -119,7 +119,7 @@ "@typescript-eslint/eslint-plugin": "4.14.1", "@typescript-eslint/parser": "4.14.1", "@woocommerce/api": "0.2.0", - "@woocommerce/e2e-utils": "0.1.6", + "@woocommerce/e2e-utils": "^0.2.0", "@woocommerce/eslint-plugin": "1.2.0", "@woocommerce/woocommerce-rest-api": "1.0.1", "@wordpress/api-fetch": "5.2.6", diff --git a/plugins/woocommerce-blocks/tests/e2e/fixtures/fixture-loaders.js b/plugins/woocommerce-blocks/tests/e2e/fixtures/fixture-loaders.js index c4953896fd8..b09ff043818 100644 --- a/plugins/woocommerce-blocks/tests/e2e/fixtures/fixture-loaders.js +++ b/plugins/woocommerce-blocks/tests/e2e/fixtures/fixture-loaders.js @@ -255,6 +255,21 @@ const createReviews = ( id, fixture = fixtures.ReviewsInProduct( id ) ) => create: fixture, } ); +/** + * Enable Cash on delivery payments. + * + * This is not called directly but is called within enablePaymentGateways. + * + * @return {Promise} a promise that resolves to an server response data, or + * rejects if the request failed. + */ +const enableCashOnDelivery = () => + WooCommerce.post( 'payment_gateways/cod', { + description: 'Cash on delivery', + enabled: true, + settings: { instructions: 'Cash on delivery' }, + } ); + /** * Enable Cheque payments. * @@ -276,7 +291,8 @@ const enableCheque = () => * @return {Promise} a promise that resolves to an array of server response * data, or rejects if the request failed. */ -const enablePaymentGateways = () => Promise.all( [ enableCheque() ] ); +const enablePaymentGateways = () => + Promise.all( [ enableCashOnDelivery(), enableCheque() ] ); /** * Create shipping zones. diff --git a/plugins/woocommerce-blocks/tests/e2e/specs/shopper/checkout-place-order-as-guest.test.js b/plugins/woocommerce-blocks/tests/e2e/specs/shopper/checkout-place-order-as-guest.test.js new file mode 100644 index 00000000000..cd18f0cc51c --- /dev/null +++ b/plugins/woocommerce-blocks/tests/e2e/specs/shopper/checkout-place-order-as-guest.test.js @@ -0,0 +1,55 @@ +/** + * External dependencies + */ +import { verifyCheckboxIsSet } from '@woocommerce/e2e-utils'; + +/** + * Internal dependencies + */ +import { shopper } from '../../../utils'; +import { SIMPLE_PRODUCT_NAME, BILLING_DETAILS } from '../../../utils/constants'; + +const block = { + name: 'Checkout', +}; + +if ( process.env.WOOCOMMERCE_BLOCKS_PHASE < 2 ) + // eslint-disable-next-line jest/no-focused-tests + test.only( `skipping ${ block.name } tests`, () => {} ); + +describe( 'Shopper → Checkout → Can place an order as guest', () => { + beforeAll( async () => { + await shopper.block.emptyCart(); + } ); + + afterAll( async () => { + await shopper.block.emptyCart(); + } ); + + it( 'allows customer to place an order as guest', async () => { + await shopper.logout(); + await shopper.goToShop(); + await shopper.addToCartFromShopPage( SIMPLE_PRODUCT_NAME ); + await shopper.block.goToCheckout(); + await shopper.block.fillBillingDetails( BILLING_DETAILS ); + + // Select the "Cash on delivery" payment method & verify it was set + await expect( page ).toClick( + '.wc-block-components-payment-method-label', + { + text: 'Cash on delivery', + } + ); + await verifyCheckboxIsSet( + '#radio-control-wc-payment-method-options-cod' + ); + + // Click on the "Place Order" button + await shopper.block.placeOrder(); + + // Verify that the order was successful + await expect( page ).toMatch( + 'Thank you. Your order has been received.' + ); + } ); +} ); diff --git a/plugins/woocommerce-blocks/tests/utils/constants.js b/plugins/woocommerce-blocks/tests/utils/constants.js index c2e6b2a2eb4..d1ff1c5510b 100644 --- a/plugins/woocommerce-blocks/tests/utils/constants.js +++ b/plugins/woocommerce-blocks/tests/utils/constants.js @@ -12,3 +12,4 @@ const baseUrl = config.get( 'url' ); export const SHOP_CART_BLOCK_PAGE = baseUrl + 'cart-block'; export const SHOP_CHECKOUT_BLOCK_PAGE = baseUrl + 'checkout-block'; export const SIMPLE_PRODUCT_NAME = 'Woo Single #1'; +export const BILLING_DETAILS = config.get( 'addresses.customer.billing' ); diff --git a/plugins/woocommerce-blocks/tests/utils/shopper.js b/plugins/woocommerce-blocks/tests/utils/shopper.js index b5c817ff595..01c47f96d9a 100644 --- a/plugins/woocommerce-blocks/tests/utils/shopper.js +++ b/plugins/woocommerce-blocks/tests/utils/shopper.js @@ -68,6 +68,12 @@ export const shopper = { } ); }, + goToCheckout: async () => { + await page.goto( SHOP_CHECKOUT_BLOCK_PAGE, { + waitUntil: 'networkidle0', + } ); + }, + /** * For some reason "wcShopper.emptyCart" sometimes result in an error, but using the same * implementation here fixes the problem. @@ -99,5 +105,59 @@ export const shopper = { text: 'Your cart is currently empty.', } ); }, + + placeOrder: async () => { + await Promise.all( [ + page.waitForNavigation( { + waitUntil: 'networkidle0', + } ), + expect( page ).toClick( '.wc-block-components-button__text', { + text: 'Place Order', + } ), + ] ); + }, + + fillBillingDetails: async ( customerBillingDetails ) => { + await expect( page ).toFill( + '#billing-first_name', + customerBillingDetails.firstname + ); + await expect( page ).toFill( + '#billing-last_name', + customerBillingDetails.lastname + ); + await expect( page ).toFill( + '#components-form-token-input-0', + customerBillingDetails.country + ); + await expect( page ).toFill( + '#billing-address_1', + customerBillingDetails.addressfirstline + ); + await expect( page ).toFill( + '#billing-address_2', + customerBillingDetails.addresssecondline + ); + await expect( page ).toFill( + '#billing-city', + customerBillingDetails.city + ); + await expect( page ).toFill( + '#components-form-token-input-2', + customerBillingDetails.state + ); + await expect( page ).toFill( + '#billing-postcode', + customerBillingDetails.postcode + ); + await expect( page ).toFill( + '#phone', + customerBillingDetails.phone + ); + await expect( page ).toFill( + '#email', + customerBillingDetails.email + ); + }, }, };