Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Shopper → Checkout → Can have different shipping and billing addresses (https://github.com/woocommerce/woocommerce-blocks/pull/5860) 

* Shopper can have different shipping and billing addresses

* Shopper can have different shipping and billing addresses

* Shopper can have different shipping and billing addresses

* Correct billing field IDs

* Remove unused variable

* Remove unused timeout

* Remove unused commands

* Activate company field using setCheckbox

* Deactivate company field using unsetCheckbox

* Remove obsolete command

* Empty cart before and after each test

* Remove obsolete import

* Check billing and shipping company

* Remove manual code with unsetCheckbox

* Fill company if field exist

* Get checkbox ID from label

* Remove duplicate company field toFill method

Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
Co-authored-by: Saad Tarhi <saad.tarhi@automattic.com>
This commit is contained in:
Niels Lange 2022-03-31 13:10:50 +02:00 committed by GitHub
parent 77990a5c1b
commit 8943629a86
6 changed files with 192 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
plugins/woocommerce-blocks/tests/e2e/config/default.json
View File

@ -39,8 +39,8 @@
"lastname": "Doe",
"company": "Automattic",
"country": "United States (US)",
"addressfirstline": "addr 1",
"addresssecondline": "addr 2",
"addressfirstline": "123 Main Road",
"addresssecondline": "Unit 23",
"city": "San Francisco",
"state": "CA",
"postcode": "94107",
@ -48,15 +48,16 @@
"email": "john.doe@example.com"
},
"shipping": {
"firstname": "John",
"firstname": "Jane",
"lastname": "Doe",
"company": "Automattic",
"company": "WooCommerce",
"country": "United States (US)",
"addressfirstline": "addr 1",
"addresssecondline": "addr 2",
"city": "San Francisco",
"addressfirstline": "123 Main Avenue",
"addresssecondline": "Unit 42",
"city": "Los Angeles",
"state": "CA",
"postcode": "94107"
"postcode": "90010",
"phone": "987654321"
}
}
}

83
plugins/woocommerce-blocks/tests/e2e/specs/shopper/checkout-different-addresses.test.js Normal file
View File

@ -0,0 +1,83 @@
/**
* External dependencies
*/
import {
merchant,
openDocumentSettingsSidebar,
setCheckbox,
unsetCheckbox,
} from '@woocommerce/e2e-utils';
import {
visitBlockPage,
selectBlockByName,
saveOrPublish,
} from '@woocommerce/blocks-test-utils';
/**
* Internal dependencies
*/
import {
shopper,
preventCompatibilityNotice,
reactivateCompatibilityNotice,
} from '../../../utils';
import { BILLING_DETAILS, SHIPPING_DETAILS } from '../../../utils/constants';
const SIMPLE_PRODUCT_NAME = '128GB USB Stick';
if ( process.env.WOOCOMMERCE_BLOCKS_PHASE < 2 )
// eslint-disable-next-line jest/no-focused-tests
test.only( 'Skipping Checkout tests', () => {} );
let companyCheckboxId = null;
describe( 'Shopper → Checkout → Can have different shipping and billing addresses', () => {
beforeAll( async () => {
await preventCompatibilityNotice();
await merchant.login();
await visitBlockPage( 'Checkout Block' );
await openDocumentSettingsSidebar();
await selectBlockByName(
'woocommerce/checkout-shipping-address-block'
);
// This checkbox ID is unstable, so, we're getting its value from "for" attribute of the label
const [ companyCheckboxLabel ] = await page.$x(
`//label[contains(text(), "Company") and contains(@class, "components-toggle-control__label")]`
);
companyCheckboxId = await page.evaluate(
( label ) => `#${ label.getAttribute( 'for' ) }`,
companyCheckboxLabel
);
await setCheckbox( companyCheckboxId );
await saveOrPublish();
await shopper.block.emptyCart();
} );
afterAll( async () => {
await shopper.block.emptyCart();
await visitBlockPage( 'Checkout Block' );
await openDocumentSettingsSidebar();
await selectBlockByName(
'woocommerce/checkout-shipping-address-block'
);
await unsetCheckbox( companyCheckboxId );
await saveOrPublish();
await merchant.logout();
await reactivateCompatibilityNotice();
} );
it( 'allows customer to have different shipping and billing addresses', async () => {
await shopper.goToShop();
await shopper.addToCartFromShopPage( SIMPLE_PRODUCT_NAME );
await shopper.block.goToCheckout();
await unsetCheckbox( '#checkbox-control-0' );
await shopper.block.fillShippingDetails( SHIPPING_DETAILS );
await shopper.block.fillBillingDetails( BILLING_DETAILS );
await shopper.block.placeOrder();
await shopper.block.verifyShippingDetails( SHIPPING_DETAILS );
await shopper.block.verifyBillingDetails( BILLING_DETAILS );
} );
} );

18
plugins/woocommerce-blocks/tests/utils/compatibility-notice.js Normal file
View File

@ -0,0 +1,18 @@
/* global localStorage */
/* eslint-disable no-unused-expressions */
export async function preventCompatibilityNotice() {
await page.evaluate( () => {
localStorage.setItem(
'wc-blocks_dismissed_compatibility_notices',
'["checkout"]'
);
} );
}
export async function reactivateCompatibilityNotice() {
await page.evaluate( () => {
localStorage.removeItem( 'wc-blocks_dismissed_compatibility_notices' );
} );
}
4;

1
plugins/woocommerce-blocks/tests/utils/constants.js
View File

@ -10,5 +10,6 @@ const config = require( 'config' );
*/
export const SIMPLE_PRODUCT_NAME = 'Woo Single #1';
export const BILLING_DETAILS = config.get( 'addresses.customer.billing' );
export const SHIPPING_DETAILS = config.get( 'addresses.customer.shipping' );
export const CUSTOMER_USERNAME = config.get( 'users.customer.username' );
export const CUSTOMER_PASSWORD = config.get( 'users.customer.password' );

4
plugins/woocommerce-blocks/tests/utils/index.js
View File

@ -4,5 +4,9 @@ export { visitBlockPage, visitPostOfType } from './visit-block-page';
export { getBlockPagePermalink } from './get-block-page-permalink';
export { getNormalPagePermalink } from './get-normal-page-permalink';
export { saveOrPublish } from './save-or-publish';
export {
preventCompatibilityNotice,
reactivateCompatibilityNotice,
} from './compatibility-notice';
export { shopper } from './shopper';
export { selectBlockByName } from './select-block-by-name';

149
plugins/woocommerce-blocks/tests/utils/shopper.js
View File

@ -188,85 +188,90 @@ export const shopper = {
);
},
// prettier-ignore
fillInCheckoutAddress: async (
address,
shippingOrBilling = 'shipping'
) => {
await expect( page ).toFill(
`#${ shippingOrBilling }-first_name`,
address.first_name
);
await expect( page ).toFill(
`#${ shippingOrBilling }-first_name`,
address.first_name
);
await expect( page ).toFill(
`#${ shippingOrBilling }-last_name`,
address.last_name
);
await expect( page ).toFill(
`#${ shippingOrBilling }-address_1`,
address.shipping_address_1
);
await expect( page ).toFill(
`#${ shippingOrBilling }-country input`,
address.country
);
await expect( page ).toFill(
`#${ shippingOrBilling }-city`,
address.city
);
await expect( page ).toFill(
`#${ shippingOrBilling }-state input`,
address.state
);
await expect( page ).toFill(
`#${ shippingOrBilling }-postcode`,
address.postcode
);
await expect( page ).toFill( `#${ shippingOrBilling }-first_name`, address.first_name );
await expect( page ).toFill( `#${ shippingOrBilling }-first_name`, address.first_name );
await expect( page ).toFill( `#${ shippingOrBilling }-last_name`, address.last_name );
await expect( page ).toFill( `#${ shippingOrBilling }-address_1`, address.shipping_address_1 );
await expect( page ).toFill( `#${ shippingOrBilling }-country input`, address.country );
await expect( page ).toFill( `#${ shippingOrBilling }-city`, address.city );
await expect( page ).toFill( `#${ shippingOrBilling }-state input`, address.state );
await expect( page ).toFill( `#${ shippingOrBilling }-postcode`, address.postcode );
},
// prettier-ignore
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
);
const companyInputField = await page.$( '#billing-company' );
if ( companyInputField ) {
await expect( page ).toFill( '#billing-company', customerBillingDetails.company );
}
await expect( page ).toFill( '#billing-first_name', customerBillingDetails.firstname );
await expect( page ).toFill( '#billing-last_name', customerBillingDetails.lastname );
await expect( page ).toFill( '#billing-country input', 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( '#billing-state input', customerBillingDetails.state );
await expect( page ).toFill( '#billing-postcode', customerBillingDetails.postcode );
await expect( page ).toFill( '#phone', customerBillingDetails.phone );
await expect( page ).toFill( '#email', customerBillingDetails.email );
},
// prettier-ignore
fillShippingDetails: async ( customerShippingDetails ) => {
const companyInputField = await page.$( '#shipping-company' );
if ( companyInputField ) {
await expect( page ).toFill( '#shipping-company', customerShippingDetails.company );
}
await expect( page ).toFill( '#shipping-first_name', customerShippingDetails.firstname );
await expect( page ).toFill( '#shipping-last_name', customerShippingDetails.lastname );
await expect( page ).toFill( '#shipping-country input', customerShippingDetails.country );
await expect( page ).toFill( '#shipping-address_1', customerShippingDetails.addressfirstline );
await expect( page ).toFill( '#shipping-address_2', customerShippingDetails.addresssecondline );
await expect( page ).toFill( '#shipping-city', customerShippingDetails.city );
await expect( page ).toFill( '#shipping-state input', customerShippingDetails.state );
await expect( page ).toFill( '#shipping-postcode', customerShippingDetails.postcode );
await expect( page ).toFill( '#shipping-phone', customerShippingDetails.phone );
},
// prettier-ignore
verifyBillingDetails: async ( customerBillingDetails ) => {
await Promise.all( [
expect( page ).toMatch( customerBillingDetails.firstname ),
expect( page ).toMatch( customerBillingDetails.lastname ),
expect( page ).toMatch( customerBillingDetails.company ),
expect( page ).toMatch( customerBillingDetails.addressfirstline ),
expect( page ).toMatch( customerBillingDetails.addresssecondline ),
// expect( page ).toMatch( customerBillingDetails.country ),
expect( page ).toMatch( customerBillingDetails.city ),
expect( page ).toMatch( customerBillingDetails.state ),
expect( page ).toMatch( customerBillingDetails.postcode ),
expect( page ).toMatch( customerBillingDetails.phone ),
] );
},
// prettier-ignore
verifyShippingDetails: async ( customerShippingDetails ) => {
await Promise.all( [
expect( page ).toMatch( customerShippingDetails.firstname ),
expect( page ).toMatch( customerShippingDetails.lastname ),
expect( page ).toMatch( customerShippingDetails.company ),
expect( page ).toMatch( customerShippingDetails.addressfirstline ),
expect( page ).toMatch( customerShippingDetails.addresssecondline ),
// expect( page ).toMatch( customerShippingDetails.country ),
expect( page ).toMatch( customerShippingDetails.city ),
expect( page ).toMatch( customerShippingDetails.state ),
expect( page ).toMatch( customerShippingDetails.postcode ),
expect( page ).toMatch( customerShippingDetails.phone ),
] );
},
/**