Merge pull request #32662 from woocommerce/update/refactor-and-improve-tests-payments-task

Refactor and improve tests payments task
This commit is contained in:
Ilyas Foo 2022-04-20 10:38:28 +08:00 committed by GitHub
commit 62de7bae9c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 431 additions and 261 deletions

View File

@ -23,6 +23,9 @@ export class PaymentsSetup extends BasePage {
async possiblyCloseHelpModal(): Promise< void > {
try {
await waitForElementByText( 'div', "We're here for help", {
timeout: 2000,
} );
await this.clickButtonWithText( 'Got it' );
} catch ( e ) {}
}

View File

@ -52,9 +52,8 @@ const testAdminPaymentSetupTask = () => {
await paymentsSetup.isDisplayed();
} );
it.skip( 'Saving valid bank account transfer details enables the payment method', async () => {
it( 'Saving valid bank account transfer details enables the payment method', async () => {
await paymentsSetup.showOtherPaymentMethods();
await waitForTimeout( 500 );
await paymentsSetup.goToPaymentMethodSetup( 'bacs' );
await bankTransferSetup.saveAccountDetails( {
accountNumber: '1234',
@ -68,10 +67,9 @@ const testAdminPaymentSetupTask = () => {
expect( await settings.paymentMethodIsEnabled( 'bacs' ) ).toBe(
true
);
await homeScreen.navigate();
} );
it.skip( 'Enabling cash on delivery enables the payment method', async () => {
it( 'Enabling cash on delivery enables the payment method', async () => {
await settings.cleanPaymentMethods();
await homeScreen.navigate();
await homeScreen.isDisplayed();
@ -80,7 +78,6 @@ const testAdminPaymentSetupTask = () => {
await paymentsSetup.possiblyCloseHelpModal();
await paymentsSetup.isDisplayed();
await paymentsSetup.showOtherPaymentMethods();
await waitForTimeout( 500 );
await paymentsSetup.enableCashOnDelivery();
await waitForTimeout( 1500 );
expect( await settings.paymentMethodIsEnabled( 'cod' ) ).toBe(

View File

@ -25,26 +25,17 @@ import { List, Placeholder as ListPlaceholder } from './components/List';
import { Setup, Placeholder as SetupPlaceholder } from './components/Setup';
import { Toggle } from './components/Toggle/Toggle';
import { WCPaySuggestion } from './components/WCPay';
import { getPluginSlug } from '~/utils';
import { getCountryCode } from '~/dashboard/utils';
import {
getEnrichedPaymentGateways,
getSplitGateways,
getIsWCPayOrOtherCategoryDoneSetup,
getIsGatewayWCPay,
comparePaymentGatewaysByPriority,
} from './utils';
import './plugins/Bacs';
import './payment-gateway-suggestions.scss';
const comparePaymentGatewaysByPriority = ( a, b ) =>
a.recommendation_priority - b.recommendation_priority;
const isGatewayWCPay = ( gateway ) =>
gateway.plugins?.length === 1 &&
gateway.plugins[ 0 ] === 'woocommerce-payments';
const isGatewayOtherCategory = ( gateway, countryCode ) =>
gateway.category_other &&
gateway.category_other.indexOf( countryCode ) !== -1;
const isGatewayAdditionalCategory = ( gateway, countryCode ) =>
gateway.category_additional &&
gateway.category_additional.indexOf( countryCode ) !== -1;
export const PaymentGatewaySuggestions = ( { onComplete, query } ) => {
const { updatePaymentGateway } = useDispatch( PAYMENT_GATEWAYS_STORE_NAME );
const {
@ -73,54 +64,14 @@ export const PaymentGatewaySuggestions = ( { onComplete, query } ) => {
};
}, [] );
const getEnrichedPaymentGateways = () => {
const mappedPaymentGateways = installedPaymentGateways.reduce(
( map, gateway ) => {
map[ gateway.id ] = gateway;
return map;
},
{}
);
return paymentGatewaySuggestions.reduce( ( map, suggestion ) => {
// A colon ':' is used sometimes to have multiple configs for the same gateway ex: woocommerce_payments:us.
const id = getPluginSlug( suggestion.id );
const installedGateway = mappedPaymentGateways[ id ]
? mappedPaymentGateways[ id ]
: {};
const enrichedSuggestion = {
installed: !! mappedPaymentGateways[ id ],
postInstallScripts: installedGateway.post_install_scripts,
hasPlugins: !! (
suggestion.plugins && suggestion.plugins.length
),
enabled: installedGateway.enabled || false,
needsSetup: installedGateway.needs_setup,
settingsUrl: installedGateway.settings_url,
connectionUrl: installedGateway.connection_url,
setupHelpText: installedGateway.setup_help_text,
title: installedGateway.title,
requiredSettings: installedGateway.required_settings_keys
? installedGateway.required_settings_keys
.map(
( settingKey ) =>
installedGateway.settings[ settingKey ]
)
.filter( Boolean )
: [],
...suggestion,
};
map.set( suggestion.id, enrichedSuggestion );
return map;
}, new Map() );
};
const paymentGateways = useMemo( getEnrichedPaymentGateways, [
const paymentGateways = useMemo(
() =>
getEnrichedPaymentGateways(
installedPaymentGateways,
paymentGatewaySuggestions,
] );
paymentGatewaySuggestions
),
[ installedPaymentGateways, paymentGatewaySuggestions ]
);
useEffect( () => {
if ( paymentGateways.size ) {
@ -201,86 +152,30 @@ export const PaymentGatewaySuggestions = ( { onComplete, query } ) => {
return gateway;
}, [ isResolving, query, paymentGateways ] );
const isWCPayOrOtherCategoryDoneSetup = useMemo( () => {
for ( const [ , gateway ] of paymentGateways.entries() ) {
if ( ! gateway.installed || gateway.needsSetup ) {
continue;
}
if ( isGatewayWCPay( gateway ) ) {
return true;
}
if ( isGatewayOtherCategory( gateway, countryCode ) ) {
return true;
}
}
return false;
}, [ countryCode, paymentGateways ] );
const isWCPayOrOtherCategoryDoneSetup = useMemo(
() =>
getIsWCPayOrOtherCategoryDoneSetup( paymentGateways, countryCode ),
[ countryCode, paymentGateways ]
);
const isWCPaySupported =
Array.from( paymentGateways.values() ).findIndex( isGatewayWCPay ) !==
-1;
Array.from( paymentGateways.values() ).findIndex(
getIsGatewayWCPay
) !== -1;
const [ wcPayGateway, offlineGateways, additionalGateways ] = useMemo(
() =>
Array.from( paymentGateways.values() )
.sort( ( a, b ) => {
if ( a.hasPlugins === b.hasPlugins ) {
return comparePaymentGatewaysByPriority( a, b );
}
// hasPlugins payment first
if ( a.hasPlugins ) {
return -1;
}
return 1;
} )
.reduce(
( all, gateway ) => {
const [ wcPay, offline, additional ] = all;
// WCPay is handled separately when not installed and configured
if (
isGatewayWCPay( gateway ) &&
! ( gateway.installed && ! gateway.needsSetup )
) {
wcPay.push( gateway );
} else if ( gateway.is_offline ) {
offline.push( gateway );
} else if ( gateway.enabled ) {
// Enabled gateways should be ignored.
} else if ( isWCPayOrOtherCategoryDoneSetup ) {
// If WCPay or "other" gateway is enabled in an WCPay-eligible country, only
// allow to list "additional" gateways.
if (
isGatewayAdditionalCategory(
gateway,
countryCode
)
) {
additional.push( gateway );
}
} else if ( ! isWCPaySupported ) {
// When WCPay-ineligible, just show all gateways.
additional.push( gateway );
} else if (
isGatewayOtherCategory( gateway, countryCode )
) {
// When nothing is set up and eligible for WCPay, only show "other" gateways.
additional.push( gateway );
}
return all;
},
[ [], [], [] ]
getSplitGateways(
paymentGateways,
countryCode,
isWCPaySupported,
isWCPayOrOtherCategoryDoneSetup
),
[
paymentGateways,
countryCode,
isWCPaySupported,
isWCPayOrOtherCategoryDoneSetup,
paymentGateways,
]
);

View File

@ -0,0 +1,131 @@
/**
* Internal dependencies
*/
import { getSplitGateways, getIsWCPayOrOtherCategoryDoneSetup } from '../utils';
const wcpay = {
plugins: [ 'woocommerce-payments' ],
installed: false,
needsSetup: true,
};
const cod = {
is_offline: true,
};
const bacs = {
is_offline: true,
};
const paypal = {
id: 'paypal',
category_other: [ 'CA' ],
category_additional: [ 'CA' ],
};
const stripe = {
id: 'stripe',
category_other: [ 'US' ],
category_additional: [ 'US' ],
};
const klarna = {
id: 'klarna',
category_other: [ '' ],
category_additional: [ 'US' ],
};
describe( 'getSplitGateways()', () => {
it( 'Returns WCPay gateways', () => {
const [ wcpayGateways ] = getSplitGateways( [ wcpay, cod, paypal ] );
expect( wcpayGateways ).toEqual( [ wcpay ] );
} );
it( 'Returns offline gateways', () => {
const [ , offlineGateways ] = getSplitGateways( [
wcpay,
cod,
bacs,
paypal,
] );
expect( offlineGateways ).toEqual( [ cod, bacs ] );
} );
it( 'Excludes enabled gateways', () => {
const [ , , additionalGateways ] = getSplitGateways( [
wcpay,
cod,
bacs,
{
...paypal,
enabled: true,
},
] );
expect( additionalGateways ).toEqual( [] );
} );
describe( 'Additional gateways with eligible WCPay', () => {
it( 'Returns only "other" category gateways when WCPay or "other" category gateway isnt set up', () => {
const [ , , additionalGateways ] = getSplitGateways(
[ wcpay, cod, bacs, paypal, stripe, klarna ],
'US',
true,
false
);
expect( additionalGateways ).toEqual( [ stripe ] );
} );
it( 'Returns only "additional" category gateways when WCPay or "other" category gateway is set up', () => {
const [ , , additionalGateways ] = getSplitGateways(
[ wcpay, cod, bacs, paypal, stripe, klarna ],
'US',
true,
true
);
expect( additionalGateways ).toEqual( [ stripe, klarna ] );
} );
} );
describe( 'Additional gateways with ineligible WCPay', () => {
it( 'Returns all gateways when "other" gateways isnt set up', () => {
const [ , , additionalGateways ] = getSplitGateways(
[ wcpay, cod, bacs, paypal, stripe, klarna ],
'US',
false,
false
);
expect( additionalGateways ).toEqual( [ paypal, stripe, klarna ] );
} );
it( 'Returns only "additional" category gateways when "other" gateways is set up', () => {
const [ , , additionalGateways ] = getSplitGateways(
[ wcpay, cod, bacs, paypal, stripe, klarna ],
'US',
false,
true
);
expect( additionalGateways ).toEqual( [ stripe, klarna ] );
} );
} );
} );
describe( 'getIsWCPayOrOtherCategoryDoneSetup()', () => {
it( 'False when nothing is set up', () => {
expect(
getIsWCPayOrOtherCategoryDoneSetup( [ wcpay, cod, paypal ] )
).toEqual( false );
} );
it( 'True when WCPay is set up', () => {
expect(
getIsWCPayOrOtherCategoryDoneSetup( [
{ ...wcpay, installed: true, needsSetup: false },
] )
).toEqual( true );
} );
it( 'True when "other" category gateway is set up', () => {
expect(
getIsWCPayOrOtherCategoryDoneSetup(
[ { ...stripe, installed: true, needsSetup: false } ],
'US'
)
).toEqual( true );
} );
} );

View File

@ -0,0 +1,140 @@
/**
* Internal dependencies
*/
import { getPluginSlug } from '~/utils';
export const comparePaymentGatewaysByPriority = ( a, b ) =>
a.recommendation_priority - b.recommendation_priority;
export const getIsGatewayWCPay = ( gateway ) =>
gateway.plugins?.length === 1 &&
gateway.plugins[ 0 ] === 'woocommerce-payments';
export const getIsGatewayOtherCategory = ( gateway, countryCode ) =>
gateway.category_other &&
gateway.category_other.indexOf( countryCode ) !== -1;
export const getIsGatewayAdditionalCategory = ( gateway, countryCode ) =>
gateway.category_additional &&
gateway.category_additional.indexOf( countryCode ) !== -1;
export const getEnrichedPaymentGateways = (
installedPaymentGateways,
paymentGatewaySuggestions
) => {
const mappedPaymentGateways = installedPaymentGateways.reduce(
( map, gateway ) => {
map[ gateway.id ] = gateway;
return map;
},
{}
);
return paymentGatewaySuggestions.reduce( ( map, suggestion ) => {
// A colon ':' is used sometimes to have multiple configs for the same gateway ex: woocommerce_payments:us.
const id = getPluginSlug( suggestion.id );
const installedGateway = mappedPaymentGateways[ id ]
? mappedPaymentGateways[ id ]
: {};
const enrichedSuggestion = {
installed: !! mappedPaymentGateways[ id ],
postInstallScripts: installedGateway.post_install_scripts,
hasPlugins: !! ( suggestion.plugins && suggestion.plugins.length ),
enabled: installedGateway.enabled || false,
needsSetup: installedGateway.needs_setup,
settingsUrl: installedGateway.settings_url,
connectionUrl: installedGateway.connection_url,
setupHelpText: installedGateway.setup_help_text,
title: installedGateway.title,
requiredSettings: installedGateway.required_settings_keys
? installedGateway.required_settings_keys
.map(
( settingKey ) =>
installedGateway.settings[ settingKey ]
)
.filter( Boolean )
: [],
...suggestion,
};
map.set( suggestion.id, enrichedSuggestion );
return map;
}, new Map() );
};
export const getIsWCPayOrOtherCategoryDoneSetup = (
paymentGateways,
countryCode
) => {
for ( const [ , gateway ] of paymentGateways.entries() ) {
if ( ! gateway.installed || gateway.needsSetup ) {
continue;
}
if ( getIsGatewayWCPay( gateway ) ) {
return true;
}
if ( getIsGatewayOtherCategory( gateway, countryCode ) ) {
return true;
}
}
return false;
};
export const getSplitGateways = (
paymentGateways,
countryCode,
isWCPaySupported,
isWCPayOrOtherCategoryDoneSetup
) =>
Array.from( paymentGateways.values() )
.sort( ( a, b ) => {
if ( a.hasPlugins === b.hasPlugins ) {
return comparePaymentGatewaysByPriority( a, b );
}
// hasPlugins payment first
if ( a.hasPlugins ) {
return -1;
}
return 1;
} )
.reduce(
( all, gateway ) => {
const [ wcPay, offline, additional ] = all;
// WCPay is handled separately when not installed and configured
if (
getIsGatewayWCPay( gateway ) &&
! ( gateway.installed && ! gateway.needsSetup )
) {
wcPay.push( gateway );
} else if ( gateway.is_offline ) {
offline.push( gateway );
} else if ( gateway.enabled ) {
// Enabled gateways should be ignored.
} else if ( isWCPayOrOtherCategoryDoneSetup ) {
// If WCPay or "other" gateway is enabled in an WCPay-eligible country, only
// allow to list "additional" gateways.
if (
getIsGatewayAdditionalCategory( gateway, countryCode )
) {
additional.push( gateway );
}
} else if ( ! isWCPaySupported ) {
// When WCPay-ineligible, just show all gateways.
additional.push( gateway );
} else if (
getIsGatewayOtherCategory( gateway, countryCode )
) {
// When nothing is set up and eligible for WCPay, only show "other" gateways.
additional.push( gateway );
}
return all;
},
[ [], [], [] ]
);

View File

@ -0,0 +1,4 @@
Significance: patch
Type: tweak
Refactor and improve tests payments task