@internetarchive/donation-form 0.5.9 → 0.5.11-alpha.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/braintree-manager/payment-providers/credit-card/credit-card.js +23 -10
- package/dist/src/braintree-manager/payment-providers/credit-card/credit-card.js.map +1 -1
- package/dist/src/braintree-manager/payment-providers/paypal/paypal-button-datasource.js +1 -0
- package/dist/src/braintree-manager/payment-providers/paypal/paypal-button-datasource.js.map +1 -1
- package/dist/src/donation-form-error.d.ts +3 -0
- package/dist/src/donation-form-error.js +7 -0
- package/dist/src/donation-form-error.js.map +1 -0
- package/package.json +1 -1
- package/src/.DS_Store +0 -0
- package/src/@types/paypal-checkout-components/modules/callback-data.d.ts +4 -45
- package/src/braintree-manager/payment-providers/credit-card/credit-card.ts +25 -11
- package/src/braintree-manager/payment-providers/paypal/paypal-button-datasource.ts +1 -0
- package/src/donation-form-error.ts +6 -0
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { __awaiter } from "tslib";
|
|
2
2
|
import { PromisedSingleton } from '@internetarchive/promised-singleton';
|
|
3
3
|
import { createNanoEvents } from 'nanoevents';
|
|
4
|
+
import { DonationFormError } from '../../../donation-form-error';
|
|
4
5
|
export class CreditCardHandler {
|
|
5
6
|
constructor(options) {
|
|
6
7
|
var _a, _b;
|
|
@@ -38,18 +39,30 @@ export class CreditCardHandler {
|
|
|
38
39
|
let timeout;
|
|
39
40
|
const timeoutPromise = new Promise((resolve, reject) => {
|
|
40
41
|
timeout = window.setTimeout(() => {
|
|
41
|
-
|
|
42
|
+
const error = new DonationFormError('Timeout loading Hosted Fields');
|
|
43
|
+
reject(error);
|
|
42
44
|
}, this.loadTimeout);
|
|
43
45
|
});
|
|
44
|
-
const hostedFieldsPromise = new Promise((resolve) => __awaiter(this, void 0, void 0, function* () {
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
46
|
+
const hostedFieldsPromise = new Promise((resolve, reject) => __awaiter(this, void 0, void 0, function* () {
|
|
47
|
+
try {
|
|
48
|
+
const fields = yield this.hostedFieldClient.create({
|
|
49
|
+
client: braintreeClient,
|
|
50
|
+
styles: this.hostedFieldConfig.hostedFieldStyle,
|
|
51
|
+
fields: this.hostedFieldConfig.hostedFieldFieldOptions,
|
|
52
|
+
});
|
|
53
|
+
// clear the timeout when this finishes so we don't also get the timeout rejection
|
|
54
|
+
window.clearTimeout(timeout);
|
|
55
|
+
resolve(fields);
|
|
56
|
+
}
|
|
57
|
+
catch (error) {
|
|
58
|
+
if (error instanceof Error && error.message.includes('Hosted Fields timed out')) {
|
|
59
|
+
// this is the timeout error, so we don't need to do anything
|
|
60
|
+
}
|
|
61
|
+
else {
|
|
62
|
+
// this is some other error. reject so it bubbles up to Sentry
|
|
63
|
+
reject(error);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
53
66
|
}));
|
|
54
67
|
const result = yield Promise.race([timeoutPromise, hostedFieldsPromise]);
|
|
55
68
|
return result;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"credit-card.js","sourceRoot":"","sources":["../../../../../src/braintree-manager/payment-providers/credit-card/credit-card.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AAKxE,OAAO,EAAE,gBAAgB,EAAe,MAAM,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"credit-card.js","sourceRoot":"","sources":["../../../../../src/braintree-manager/payment-providers/credit-card/credit-card.ts"],"names":[],"mappings":"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","sourcesContent":["import { PromisedSingleton } from '@internetarchive/promised-singleton';\nimport { BraintreeManagerInterface } from '../../braintree-interfaces';\nimport { HostedFieldConfiguration } from './hosted-field-configuration';\nimport { HostedFieldName } from './hosted-field-container';\nimport { CreditCardHandlerEvents, CreditCardHandlerInterface } from './credit-card-interface';\nimport { createNanoEvents, Unsubscribe } from 'nanoevents';\nimport { DonationFormError } from '../../../donation-form-error';\n\nexport class CreditCardHandler implements CreditCardHandlerInterface {\n on<E extends keyof CreditCardHandlerEvents>(\n event: E,\n callback: CreditCardHandlerEvents[E],\n ): Unsubscribe {\n return this.emitter.on(event, callback);\n }\n\n instance = new PromisedSingleton<braintree.HostedFields | undefined>({\n generator: async (): Promise<braintree.HostedFields | undefined> => {\n const braintreeClient = await this.braintreeManager.instance.get();\n const hostedFields = await this.createHostedFields(braintreeClient);\n return hostedFields;\n },\n });\n\n private emitter = createNanoEvents<CreditCardHandlerEvents>();\n\n private maxRetryCount: number;\n\n private loadTimeout: number;\n\n constructor(options: {\n braintreeManager: BraintreeManagerInterface;\n hostedFieldClient: braintree.HostedFields;\n hostedFieldConfig: HostedFieldConfiguration;\n maxRetryCount?: number;\n loadTimeout?: number;\n }) {\n this.braintreeManager = options.braintreeManager;\n this.hostedFieldClient = options.hostedFieldClient;\n this.hostedFieldConfig = options.hostedFieldConfig;\n this.maxRetryCount = options.maxRetryCount ?? 2;\n this.loadTimeout = (options.loadTimeout ?? 6) * 1000;\n }\n\n private braintreeManager: BraintreeManagerInterface;\n private hostedFieldClient: braintree.HostedFields;\n private hostedFieldConfig: HostedFieldConfiguration;\n\n private async createHostedFields(\n braintreeClient: braintree.Client,\n retryCount = 0,\n ): Promise<braintree.HostedFields | undefined> {\n // we mainly want to do this for retry events, but it doesn't\n // hurt to do it on the first try\n this.hostedFieldConfig.hostedFieldContainer.resetHostedFields();\n try {\n // The hosted fields have a 60 second timeout internally, but braintree\n // support recommended setting a shorter timeout because 99% of users\n // load the hosted fields in under 4 seconds and 99.9% with 18 seconds.\n // What we're doing here is creating a \"timeout\" promise\n // and a \"create hosted fields\" promise and doing a `Promise.race()` to\n // resolve when the first one finishes. If the timeout finishes first,\n // we throw an error to trigger the retry logic. If the hosted fields\n // finishes first, we cancel the timeout promise since we're done.\n let timeout: number;\n\n const timeoutPromise = new Promise<void>((resolve, reject) => {\n timeout = window.setTimeout(() => {\n const error = new DonationFormError('Timeout loading Hosted Fields');\n reject(error);\n }, this.loadTimeout);\n });\n\n const hostedFieldsPromise = new Promise<braintree.HostedFields | undefined>(\n async (resolve, reject) => {\n try {\n const fields = await this.hostedFieldClient.create({\n client: braintreeClient,\n styles: this.hostedFieldConfig.hostedFieldStyle,\n fields: this.hostedFieldConfig.hostedFieldFieldOptions,\n });\n // clear the timeout when this finishes so we don't also get the timeout rejection\n window.clearTimeout(timeout);\n resolve(fields);\n } catch (error) {\n if (error instanceof Error && error.message.includes('Hosted Fields timed out')) {\n // this is the timeout error, so we don't need to do anything\n } else {\n // this is some other error. reject so it bubbles up to Sentry\n reject(error);\n }\n }\n },\n );\n\n const result = await Promise.race([timeoutPromise, hostedFieldsPromise]);\n\n return result as braintree.HostedFields;\n } catch (error) {\n if (retryCount >= this.maxRetryCount) {\n this.emitter.emit('hostedFieldsFailed', error);\n throw error;\n }\n const newRetryCount = retryCount + 1;\n this.emitter.emit('hostedFieldsRetry', newRetryCount);\n return this.createHostedFields(braintreeClient, newRetryCount);\n }\n }\n\n async tokenizeHostedFields(): Promise<braintree.HostedFieldsTokenizePayload | undefined> {\n const hostedFields = await this.instance.get();\n return hostedFields?.tokenize();\n }\n\n markFieldErrors(fields: HostedFieldName[]): void {\n this.hostedFieldConfig.hostedFieldContainer.markFieldErrors(fields);\n }\n\n removeFieldErrors(fields: HostedFieldName[]): void {\n this.hostedFieldConfig.hostedFieldContainer.removeFieldErrors(fields);\n }\n\n showErrorMessage(message?: string): void {\n this.hostedFieldConfig.hostedFieldContainer.showErrorMessage(message);\n }\n\n hideErrorMessage(): void {\n this.hostedFieldConfig.hostedFieldContainer.hideErrorMessage();\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"paypal-button-datasource.js","sourceRoot":"","sources":["../../../../../src/braintree-manager/payment-providers/paypal/paypal-button-datasource.ts"],"names":[],"mappings":";AAAA,OAAO,EAAuB,YAAY,EAAE,MAAM,4CAA4C,CAAC;AAE/F,OAAO,QAAQ,MAAM,aAAa,CAAC;AA6HnC,kBAAkB;AAClB,MAAM,OAAO,sBAAsB;IAgBjC,YAAY,OAGX;QACC,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC;QACzC,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC,cAAc,CAAC;IAC/C,CAAC;IAED,kBAAkB;IACZ,OAAO;;;YACX,MAAM,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC;YACpD,MAAM,IAAI,GAAG,YAAY,KAAK,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC;YAE1E,MAAM,OAAO,GAAiD;gBAC5D,IAAI,EAAE,IAAuB;
|
|
1
|
+
{"version":3,"file":"paypal-button-datasource.js","sourceRoot":"","sources":["../../../../../src/braintree-manager/payment-providers/paypal/paypal-button-datasource.ts"],"names":[],"mappings":";AAAA,OAAO,EAAuB,YAAY,EAAE,MAAM,4CAA4C,CAAC;AAE/F,OAAO,QAAQ,MAAM,aAAa,CAAC;AA6HnC,kBAAkB;AAClB,MAAM,OAAO,sBAAsB;IAgBjC,YAAY,OAGX;QACC,IAAI,CAAC,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC;QACzC,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC,cAAc,CAAC;IAC/C,CAAC;IAED,kBAAkB;IACZ,OAAO;;;YACX,MAAM,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC;YACpD,MAAM,IAAI,GAAG,YAAY,KAAK,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC;YAE1E,MAAM,OAAO,GAAiD;gBAC5D,IAAI,EAAE,IAAuB;gBAC7B,MAAM,EAAE,SAAS;aAClB,CAAC;YACF,OAAO,CAAC,qBAAqB,GAAG,IAAI,CAAC;YAErC,IAAI,IAAI,KAAK,UAAU,EAAE;gBACvB,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC;gBACzC,OAAO,CAAC,QAAQ,GAAG,KAAK,CAAC;aAC1B;iBAAM;gBACL,OAAO,CAAC,2BAA2B,GAAG,uBAAuB,QAAQ,CACnE,IAAI,CAAC,YAAY,CAAC,KAAK,EACvB,EAAE,MAAM,EAAE,GAAG,EAAE,CAChB,CAAC,MAAM,EAAE,UAAU,CAAC;aACtB;YAED,MAAA,IAAI,CAAC,QAAQ,0CAAE,oBAAoB,CAAC,IAAI,EAAE,OAAO,EAAE;YAEnD,OAAO,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;;KACnD;IAED,kBAAkB;IACZ,WAAW,CAAC,IAA8B;;;YAC9C,MAAM,OAAO,GAA2B,MAAM,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;YAExF,MAAA,IAAI,CAAC,QAAQ,0CAAE,uBAAuB,CAAC,IAAI,EAAE,OAAO,EAAE;YAEtD,OAAO,OAAO,CAAC;;KAChB;IAED,kBAAkB;IAClB,QAAQ,CAAC,IAAY;;QACnB,MAAA,IAAI,CAAC,QAAQ,0CAAE,sBAAsB,CAAC,IAAI,EAAE,IAAI,EAAE;IACpD,CAAC;IAED,kBAAkB;IAClB,OAAO,CAAC,KAAa;;QACnB,OAAO,CAAC,KAAK,CAAC,cAAc,EAAE,KAAK,CAAC,CAAC;QACrC,MAAA,IAAI,CAAC,QAAQ,0CAAE,kBAAkB,CAAC,IAAI,EAAE,KAAK,EAAE;IACjD,CAAC;CACF","sourcesContent":["import { DonationPaymentInfo, DonationType } from '@internetarchive/donation-form-data-models';\n\nimport currency from 'currency.js';\n\n/**\n * PayPayButtonDataSource is responsible for communicating with the PayPal button.\n *\n * The PayPal button cannot live in the ShadowDOM so we have to instantiate it at the\n * top of the DOM and it lives in the global sphere. This makes it difficult to communicate\n * with it directly. The PayPalButtonDataSource provides an object that we can pass around\n * that hooks into all of the PayPal button's callbacks and provides callbacks to its\n * delegate that is interested in the various events.\n *\n * @export\n * @interface PayPalButtonDataSourceInterface\n */\nexport interface PayPalButtonDataSourceInterface {\n /**\n * The delegate to inform about button events\n *\n * @type {PayPalButtonDataSourceDelegate}\n * @memberof PayPalButtonDataSourceInterface\n */\n delegate?: PayPalButtonDataSourceDelegate;\n\n /**\n * The Donation Info associated with this button.\n *\n * Since the user initiates the checkout flow from the button itself (not programatically by us),\n * we need to have up-to-date donation information so whenever the user updates donation info\n * from the form, we update this.\n *\n * @type {DonationPaymentInfo}\n * @memberof PayPalButtonDataSourceInterface\n */\n donationInfo: DonationPaymentInfo;\n\n /**\n * The payment has been started by the user (they clicked the PayPal button)\n *\n * @returns {Promise<string>}\n * @memberof PayPalButtonDataSourceInterface\n */\n payment(): Promise<string>;\n\n /**\n * The user has authorized the donation\n *\n * @param {paypal.AuthorizationData} data\n * @param {object} actions\n * @returns {(Promise<paypal.TokenizePayload | undefined>)}\n * @memberof PayPalButtonDataSourceInterface\n */\n onAuthorize(\n data: paypal.AuthorizationData,\n actions: object,\n ): Promise<paypal.TokenizePayload | undefined>;\n\n /**\n * The user cancelled the donation\n *\n * @param {paypal.CancellationData} data\n * @memberof PayPalButtonDataSourceInterface\n */\n onCancel(data: paypal.CancellationData): void;\n\n /**\n * An error occurred\n *\n * @param {string} error\n * @memberof PayPalButtonDataSourceInterface\n */\n onError(error: string): void;\n}\n\n/**\n * The PayPalButtonDataSourceDelegate is an interface for any object interested\n * in events emitted by the paypal button.\n *\n * @export\n * @interface PayPalButtonDataSourceDelegate\n */\nexport interface PayPalButtonDataSourceDelegate {\n /**\n * Payment has been started\n *\n * @param {PayPalButtonDataSourceInterface} dataSource\n * @param {object} options\n * @returns {Promise<void>}\n * @memberof PayPalButtonDataSourceDelegate\n */\n payPalPaymentStarted(dataSource: PayPalButtonDataSourceInterface, options: object): Promise<void>;\n\n /**\n * Payment has been authorized\n *\n * @param {PayPalButtonDataSourceInterface} dataSource\n * @param {paypal.TokenizePayload} payload\n * @returns {Promise<void>}\n * @memberof PayPalButtonDataSourceDelegate\n */\n payPalPaymentAuthorized(\n dataSource: PayPalButtonDataSourceInterface,\n payload: paypal.TokenizePayload,\n ): Promise<void>;\n\n /**\n * Payment has been cancelled\n *\n * @param {PayPalButtonDataSourceInterface} dataSource\n * @param {object} data\n * @returns {Promise<void>}\n * @memberof PayPalButtonDataSourceDelegate\n */\n payPalPaymentCancelled(dataSource: PayPalButtonDataSourceInterface, data: object): Promise<void>;\n\n /**\n * There was a payment error\n *\n * @param {PayPalButtonDataSourceInterface} dataSource\n * @param {string} error\n * @returns {Promise<void>}\n * @memberof PayPalButtonDataSourceDelegate\n */\n payPalPaymentError(dataSource: PayPalButtonDataSourceInterface, error: string): Promise<void>;\n}\n\n/** @inheritdoc */\nexport class PayPalButtonDataSource implements PayPalButtonDataSourceInterface {\n /** @inheritdoc */\n delegate?: PayPalButtonDataSourceDelegate;\n\n /** @inheritdoc */\n donationInfo: DonationPaymentInfo;\n\n /**\n * The PayPal instance\n *\n * @private\n * @type {braintree.PayPalCheckout}\n * @memberof PayPalButtonDataSource\n */\n private paypalInstance: braintree.PayPalCheckout;\n\n constructor(options: {\n donationInfo: DonationPaymentInfo;\n paypalInstance: braintree.PayPalCheckout;\n }) {\n this.donationInfo = options.donationInfo;\n this.paypalInstance = options.paypalInstance;\n }\n\n /** @inheritdoc */\n async payment(): Promise<string> {\n const donationType = this.donationInfo.donationType;\n const flow = donationType === DonationType.OneTime ? 'checkout' : 'vault';\n\n const options: braintree.PayPalCheckoutCreatePaymentOptions = {\n flow: flow as paypal.FlowType,\n intent: 'capture',\n };\n options.enableShippingAddress = true;\n\n if (flow === 'checkout') {\n options.amount = this.donationInfo.total;\n options.currency = 'USD';\n } else {\n options.billingAgreementDescription = `Subscribe to donate ${currency(\n this.donationInfo.total,\n { symbol: '$' },\n ).format()} monthly`;\n }\n\n this.delegate?.payPalPaymentStarted(this, options);\n\n return this.paypalInstance.createPayment(options);\n }\n\n /** @inheritdoc */\n async onAuthorize(data: paypal.AuthorizationData): Promise<paypal.TokenizePayload> {\n const payload: paypal.TokenizePayload = await this.paypalInstance.tokenizePayment(data);\n\n this.delegate?.payPalPaymentAuthorized(this, payload);\n\n return payload;\n }\n\n /** @inheritdoc */\n onCancel(data: object): void {\n this.delegate?.payPalPaymentCancelled(this, data);\n }\n\n /** @inheritdoc */\n onError(error: string): void {\n console.error('PayPal error', error);\n this.delegate?.payPalPaymentError(this, error);\n }\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"donation-form-error.js","sourceRoot":"","sources":["../../src/donation-form-error.ts"],"names":[],"mappings":"AAAA,MAAM,OAAO,iBAAkB,SAAQ,KAAK;IAC1C,YAAY,OAAe;QACzB,KAAK,CAAC,OAAO,CAAC,CAAC;QACf,IAAI,CAAC,IAAI,GAAG,mBAAmB,CAAC;IAClC,CAAC;CACF","sourcesContent":["export class DonationFormError extends Error {\n constructor(message: string) {\n super(message);\n this.name = 'DonationFormError';\n }\n}\n"]}
|
package/package.json
CHANGED
package/src/.DS_Store
CHANGED
|
Binary file
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
export
|
|
2
|
-
Debit = 'debit',
|
|
3
|
-
Credit = 'credit',
|
|
4
|
-
}
|
|
1
|
+
export type LineItemKind = 'debit' | 'credit';
|
|
5
2
|
|
|
6
3
|
export interface LineItem {
|
|
7
4
|
/**
|
|
@@ -45,17 +42,7 @@ export interface LineItem {
|
|
|
45
42
|
url: string | undefined;
|
|
46
43
|
}
|
|
47
44
|
|
|
48
|
-
export
|
|
49
|
-
/**
|
|
50
|
-
* The payer intends to receive the items at a specified address.
|
|
51
|
-
*/
|
|
52
|
-
Shipping = 'SHIPPING',
|
|
53
|
-
|
|
54
|
-
/**
|
|
55
|
-
* The payer intends to pick up the items at a specified address. For example, a store address.
|
|
56
|
-
*/
|
|
57
|
-
Pickup = 'PICKUP',
|
|
58
|
-
}
|
|
45
|
+
export type ShippingOptionType = 'SHIPPING' | 'PICKUP';
|
|
59
46
|
|
|
60
47
|
export interface CurrencyAmount {
|
|
61
48
|
/**
|
|
@@ -219,37 +206,9 @@ export interface TokenizePayload {
|
|
|
219
206
|
details: TokenizePayloadDetails;
|
|
220
207
|
}
|
|
221
208
|
|
|
222
|
-
export
|
|
223
|
-
/**
|
|
224
|
-
* Used to store the payment method for future use, ie subscriptions
|
|
225
|
-
*/
|
|
226
|
-
Vault = 'vault',
|
|
227
|
-
|
|
228
|
-
/**
|
|
229
|
-
* Used for one-time checkout
|
|
230
|
-
*/
|
|
231
|
-
Checkout = 'checkout',
|
|
232
|
-
}
|
|
233
|
-
|
|
234
|
-
export enum Intent {
|
|
235
|
-
/**
|
|
236
|
-
* Submits the transaction for authorization but not settlement.
|
|
237
|
-
*/
|
|
238
|
-
Authorize = 'authorize',
|
|
209
|
+
export type FlowType = 'checkout' | 'vault';
|
|
239
210
|
|
|
240
|
-
|
|
241
|
-
* Validates the transaction without an authorization (i.e. without holding funds).
|
|
242
|
-
* Useful for authorizing and capturing funds up to 90 days after the order has been placed.
|
|
243
|
-
* Only available for Checkout flow.
|
|
244
|
-
*/
|
|
245
|
-
Order = 'order',
|
|
246
|
-
|
|
247
|
-
/**
|
|
248
|
-
* Payment will be immediately submitted for settlement upon creating a transaction.
|
|
249
|
-
* `sale` can be used as an alias for this value.
|
|
250
|
-
*/
|
|
251
|
-
Capture = 'capture',
|
|
252
|
-
}
|
|
211
|
+
export type Intent = 'authorize' | 'order' | 'capture';
|
|
253
212
|
|
|
254
213
|
export interface AuthorizationData {
|
|
255
214
|
payerId: string;
|
|
@@ -4,6 +4,7 @@ import { HostedFieldConfiguration } from './hosted-field-configuration';
|
|
|
4
4
|
import { HostedFieldName } from './hosted-field-container';
|
|
5
5
|
import { CreditCardHandlerEvents, CreditCardHandlerInterface } from './credit-card-interface';
|
|
6
6
|
import { createNanoEvents, Unsubscribe } from 'nanoevents';
|
|
7
|
+
import { DonationFormError } from '../../../donation-form-error';
|
|
7
8
|
|
|
8
9
|
export class CreditCardHandler implements CreditCardHandlerInterface {
|
|
9
10
|
on<E extends keyof CreditCardHandlerEvents>(
|
|
@@ -62,22 +63,35 @@ export class CreditCardHandler implements CreditCardHandlerInterface {
|
|
|
62
63
|
// we throw an error to trigger the retry logic. If the hosted fields
|
|
63
64
|
// finishes first, we cancel the timeout promise since we're done.
|
|
64
65
|
let timeout: number;
|
|
66
|
+
|
|
65
67
|
const timeoutPromise = new Promise<void>((resolve, reject) => {
|
|
66
68
|
timeout = window.setTimeout(() => {
|
|
67
|
-
|
|
69
|
+
const error = new DonationFormError('Timeout loading Hosted Fields');
|
|
70
|
+
reject(error);
|
|
68
71
|
}, this.loadTimeout);
|
|
69
72
|
});
|
|
70
73
|
|
|
71
|
-
const hostedFieldsPromise = new Promise<braintree.HostedFields | undefined>(
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
74
|
+
const hostedFieldsPromise = new Promise<braintree.HostedFields | undefined>(
|
|
75
|
+
async (resolve, reject) => {
|
|
76
|
+
try {
|
|
77
|
+
const fields = await this.hostedFieldClient.create({
|
|
78
|
+
client: braintreeClient,
|
|
79
|
+
styles: this.hostedFieldConfig.hostedFieldStyle,
|
|
80
|
+
fields: this.hostedFieldConfig.hostedFieldFieldOptions,
|
|
81
|
+
});
|
|
82
|
+
// clear the timeout when this finishes so we don't also get the timeout rejection
|
|
83
|
+
window.clearTimeout(timeout);
|
|
84
|
+
resolve(fields);
|
|
85
|
+
} catch (error) {
|
|
86
|
+
if (error instanceof Error && error.message.includes('Hosted Fields timed out')) {
|
|
87
|
+
// this is the timeout error, so we don't need to do anything
|
|
88
|
+
} else {
|
|
89
|
+
// this is some other error. reject so it bubbles up to Sentry
|
|
90
|
+
reject(error);
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
},
|
|
94
|
+
);
|
|
81
95
|
|
|
82
96
|
const result = await Promise.race([timeoutPromise, hostedFieldsPromise]);
|
|
83
97
|
|
|
@@ -157,6 +157,7 @@ export class PayPalButtonDataSource implements PayPalButtonDataSourceInterface {
|
|
|
157
157
|
|
|
158
158
|
const options: braintree.PayPalCheckoutCreatePaymentOptions = {
|
|
159
159
|
flow: flow as paypal.FlowType,
|
|
160
|
+
intent: 'capture',
|
|
160
161
|
};
|
|
161
162
|
options.enableShippingAddress = true;
|
|
162
163
|
|