🤖 Merge PR #47746 braintree-web: paypal tokenize promise return type by @tbrannam

* fix: paypal tokenize promise return type

The promise returning version of `tokenize` returns a different type than the callback version.

Additionally, included specialization of `tokenize` callback interface to reflect the payload type of callback.

* fix: paypal tokenize promise return type

The promise returning version of `tokenize` returns a different type than the callback version.

Additionally, included specialization of `tokenize` callback interface to reflect the payload type of callback.
This commit is contained in:
Todd Brannam 2020-09-17 21:40:06 -04:00 committed by GitHub
parent cc6d4d4b19
commit 0807fca4d5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 58 additions and 5 deletions

View File

@ -3,7 +3,7 @@
*/
export const VERSION: string;
export type callback = (err?: BraintreeError, data?: any) => void;
export type callback<T = any> = (err?: BraintreeError, data?: T) => void;
/**
* Enum for {@link BraintreeError} types.

View File

@ -63,7 +63,7 @@ export interface PayPal {
* });
*/
create(options: { client: Client }): Promise<PayPal>;
create(options: { client: Client }, callback: callback): void;
create(options: { client: Client }, callback: callback<PayPal>): void;
VERSION: string;
@ -150,7 +150,7 @@ export interface PayPal {
shippingAddressOverride?: PayPalShippingAddress;
shippingAddressEditable?: boolean;
billingAgreementDescription?: string;
}): Promise<PayPalTokenizeReturn>;
}): Promise<PayPalTokenizePayload>;
tokenize(
options: {
flow: string;
@ -166,7 +166,7 @@ export interface PayPal {
shippingAddressEditable?: boolean;
billingAgreementDescription?: string;
},
callback: callback,
callback: callback<PayPalTokenizePayload>,
): PayPalTokenizeReturn;
/**

View File

@ -386,7 +386,7 @@ braintree.client.create(
{
client: clientInstance,
},
(createErr, paypalInstance) => {
(createErr, paypalInstance: braintree.PayPal) => {
if (createErr) {
if (createErr.code === 'PAYPAL_BROWSER_NOT_SUPPORTED') {
console.error('This browser is not supported.');
@ -439,6 +439,59 @@ braintree.client.create(
},
);
braintree.paypal.create(
{
client: clientInstance,
},
(createErr, paypalInstance) => {
if (createErr) {
if (createErr.code === 'PAYPAL_BROWSER_NOT_SUPPORTED') {
console.error('This browser is not supported.');
} else {
console.error('Error!', createErr);
}
}
const button = new HTMLButtonElement();
button.addEventListener('click', async () => {
// Disable the button so that we don't attempt to open multiple popups.
button.setAttribute('disabled', 'disabled');
// Because PayPal tokenization opens a popup, this must be called
// as a result of a user action, such as a button click.
try {
const payload = await paypalInstance.tokenize({
flow: 'vault', // Required
// Any other tokenization options
});
payload.nonce;
// Submit payload.nonce to your server
} catch (tokenizeErr /*braintree.BraintreeError*/) {
// Handle tokenization errors or premature flow closure
switch (tokenizeErr.code) {
case 'PAYPAL_POPUP_CLOSED':
console.error('Customer closed PayPal popup.');
break;
case 'PAYPAL_ACCOUNT_TOKENIZATION_FAILED':
console.error('PayPal tokenization failed. See details:', tokenizeErr.details);
break;
case 'PAYPAL_FLOW_FAILED':
console.error(
'Unable to initialize PayPal flow. Are your options correct?',
tokenizeErr.details,
);
break;
default:
console.error('Error!', tokenizeErr);
}
} finally {
button.removeAttribute('disabled');
}
});
},
);
braintree.paypalCheckout.create(
{
client: clientInstance,