mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-09-01 07:02:48 +08:00
♻️ Move button event dispatcher to helper file
This commit is contained in:
parent
3c200e408a
commit
b85a16abda
2 changed files with 57 additions and 4 deletions
|
@ -7,6 +7,10 @@ import {
|
|||
PaymentMethods,
|
||||
} from '../Helper/CheckoutMethodState';
|
||||
import BootstrapHelper from '../Helper/BootstrapHelper';
|
||||
import {
|
||||
ButtonEvents,
|
||||
dispatchButtonEvent,
|
||||
} from '../Helper/PaymentButtonHelpers';
|
||||
|
||||
class CheckoutBootstap {
|
||||
constructor( gateway, renderer, spinner, errorHandler ) {
|
||||
|
@ -180,7 +184,7 @@ class CheckoutBootstap {
|
|||
* Custom JS event to notify other modules that the payment button on the checkout page
|
||||
* has become irrelevant or invalid.
|
||||
*/
|
||||
document.body.dispatchEvent( new Event( 'ppcp_invalidate_methods' ) );
|
||||
dispatchButtonEvent( { event: ButtonEvents.INVALIDATE } );
|
||||
}
|
||||
|
||||
updateUi() {
|
||||
|
@ -247,9 +251,10 @@ class CheckoutBootstap {
|
|||
* Dynamic part of the event name is the payment method ID, for example
|
||||
* "ppcp-credit-card-gateway" or "ppcp-googlepay"
|
||||
*/
|
||||
document.body.dispatchEvent(
|
||||
new Event( `ppcp_render_method-${ currentPaymentMethod }` )
|
||||
);
|
||||
dispatchButtonEvent( {
|
||||
event: ButtonEvents.RENDER,
|
||||
paymentMethod: currentPaymentMethod,
|
||||
} );
|
||||
|
||||
document.body.dispatchEvent( new Event( 'ppcp_checkout_rendered' ) );
|
||||
}
|
||||
|
|
|
@ -0,0 +1,48 @@
|
|||
/**
|
||||
* Helper function used by PaymentButton instances.
|
||||
*
|
||||
* @file
|
||||
*/
|
||||
|
||||
/**
|
||||
* Collection of recognized event names for payment button events.
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
export const ButtonEvents = Object.freeze( {
|
||||
INVALIDATE: 'ppcp_invalidate_methods',
|
||||
RENDER: 'ppcp_render_method',
|
||||
REDRAW: 'ppcp_redraw_method',
|
||||
} );
|
||||
|
||||
/**
|
||||
* Verifies if the given event name is a valid Payment Button event.
|
||||
*
|
||||
* @param {string} event - The event name to verify.
|
||||
* @return {boolean} True, if the event name is valid.
|
||||
*/
|
||||
export function isValidButtonEvent( event ) {
|
||||
const buttonEventValues = Object.values( ButtonEvents );
|
||||
|
||||
return buttonEventValues.includes( event );
|
||||
}
|
||||
|
||||
/**
|
||||
* Dispatches a payment button event.
|
||||
*
|
||||
* @param {Object} options - The options for dispatching the event.
|
||||
* @param {string} options.event - Event to dispatch.
|
||||
* @param {string} [options.paymentMethod] - Optional. Name of payment method, to target a specific button only.
|
||||
* @throws {Error} Throws an error if the event is invalid.
|
||||
*/
|
||||
export function dispatchButtonEvent( { event, paymentMethod = '' } ) {
|
||||
if ( ! isValidButtonEvent( event ) ) {
|
||||
throw new Error( `Invalid event: ${ event }` );
|
||||
}
|
||||
|
||||
const fullEventName = paymentMethod
|
||||
? `${ event }-${ paymentMethod }`
|
||||
: event;
|
||||
|
||||
document.body.dispatchEvent( new Event( fullEventName ) );
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue