diff --git a/types/braintree-web/modules/core.d.ts b/types/braintree-web/modules/core.d.ts index 00460f6922..9bf5c7f3af 100644 --- a/types/braintree-web/modules/core.d.ts +++ b/types/braintree-web/modules/core.d.ts @@ -3,7 +3,7 @@ */ export const VERSION: string; -export type callback = (err?: BraintreeError, data?: any) => void; +export type callback = (err?: BraintreeError, data?: T) => void; /** * Enum for {@link BraintreeError} types. diff --git a/types/braintree-web/modules/paypal.d.ts b/types/braintree-web/modules/paypal.d.ts index be3ea3fd03..1b904806ef 100644 --- a/types/braintree-web/modules/paypal.d.ts +++ b/types/braintree-web/modules/paypal.d.ts @@ -63,7 +63,7 @@ export interface PayPal { * }); */ create(options: { client: Client }): Promise; - create(options: { client: Client }, callback: callback): void; + create(options: { client: Client }, callback: callback): void; VERSION: string; @@ -150,7 +150,7 @@ export interface PayPal { shippingAddressOverride?: PayPalShippingAddress; shippingAddressEditable?: boolean; billingAgreementDescription?: string; - }): Promise; + }): Promise; tokenize( options: { flow: string; @@ -166,7 +166,7 @@ export interface PayPal { shippingAddressEditable?: boolean; billingAgreementDescription?: string; }, - callback: callback, + callback: callback, ): PayPalTokenizeReturn; /** diff --git a/types/braintree-web/test/web.ts b/types/braintree-web/test/web.ts index 53b2b5233a..2427c9ea96 100644 --- a/types/braintree-web/test/web.ts +++ b/types/braintree-web/test/web.ts @@ -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,