Shopper → Checkout → Can place an order as guest (https://github.com/woocommerce/woocommerce-blocks/pull/6009)
* Add "goToCheckout" method in "shopper.block" Instead of using "shopper.goToCheckoutBlock" method, it will much easier to maintain the following structure "shopper.block.goToCheckout" * Create a constant for billing details * Create "fillBillingDetails" shopper method * Add "placeOrder" method to "shopper" * Enable "Cash on delivery" payment method for our test * Update "@woocommerce/e2e-utils" package Some new useful e2e utility functions weren't avaiable in the previous version * Add E2E test for "Can place an order as guest" * Fix mini-cart failing E2E tests In case this fix woocommerce/woocommerce-blocks#6006 isn't merged yet, this commit can be used to pass all E2E tests Co-authored-by: Saad Tarhi <saad.tarhi@automattic.com>
This commit is contained in:
parent
fc01576a38
commit
1e15672b7b
|
@ -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",
|
||||
|
|
|
@ -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",
|
||||
|
|
|
@ -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.
|
||||
|
|
|
@ -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.'
|
||||
);
|
||||
} );
|
||||
} );
|
|
@ -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' );
|
||||
|
|
|
@ -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
|
||||
);
|
||||
},
|
||||
},
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue