From 5edac1992d7ae1478dbbb0a20856a20fe1d6ef8c Mon Sep 17 00:00:00 2001 From: Estefania Ocampo Date: Thu, 28 May 2020 12:26:21 -0500 Subject: [PATCH 1/2] feat(payment): INT-2118 adding amazon pay option - Render Amazon Pay as a HostedWidgetPaymentMethod - Introduces a new StaticAddressEditable component - Uses the new isShippingStepPending selector --- src/app/address/StaticAddress.tsx | 8 +- src/app/billing/StaticBillingAddress.spec.tsx | 42 ++++++++ src/app/billing/StaticBillingAddress.tsx | 3 +- src/app/customer/CheckoutButtonList.tsx | 1 + src/app/customer/canSignOut.spec.ts | 8 ++ src/app/customer/canSignOut.ts | 1 + src/app/payment/Payment.tsx | 1 + .../AmazonPayV2PaymentMethod.spec.tsx | 102 ++++++++++++++++++ .../AmazonPayV2PaymentMethod.tsx | 43 ++++++++ .../HostedWidgetPaymentMethod.spec.tsx | 37 +++++++ .../HostedWidgetPaymentMethod.tsx | 47 +++++++- .../payment/paymentMethod/PaymentMethod.tsx | 5 + .../payment/paymentMethod/PaymentMethodId.ts | 1 + .../paymentMethod/PaymentMethodTitle.tsx | 4 + .../paymentMethod/getPaymentMethodName.ts | 4 + src/app/shipping/Shipping.spec.tsx | 8 +- src/app/shipping/Shipping.tsx | 13 ++- src/app/shipping/ShippingAddress.spec.tsx | 28 +++++ src/app/shipping/ShippingAddress.tsx | 42 ++++++-- src/app/shipping/SingleShippingForm.tsx | 5 +- src/app/shipping/StaticAddressEditable.scss | 9 ++ .../shipping/StaticAddressEditable.spec.tsx | 43 ++++++++ src/app/shipping/StaticAddressEditable.tsx | 85 +++++++++++++++ src/app/shipping/getShippingMethodId.ts | 2 +- .../components/checkout/widget/_widget.scss | 4 + 25 files changed, 522 insertions(+), 24 deletions(-) create mode 100644 src/app/payment/paymentMethod/AmazonPayV2PaymentMethod.spec.tsx create mode 100644 src/app/payment/paymentMethod/AmazonPayV2PaymentMethod.tsx create mode 100644 src/app/shipping/StaticAddressEditable.scss create mode 100644 src/app/shipping/StaticAddressEditable.spec.tsx create mode 100644 src/app/shipping/StaticAddressEditable.tsx diff --git a/src/app/address/StaticAddress.tsx b/src/app/address/StaticAddress.tsx index 9bb9443686..8d8c6f0d8e 100644 --- a/src/app/address/StaticAddress.tsx +++ b/src/app/address/StaticAddress.tsx @@ -1,4 +1,4 @@ -import { Address, Country, FormField } from '@bigcommerce/checkout-sdk'; +import { Address, CheckoutSelectors, Country, FormField, ShippingInitializeOptions } from '@bigcommerce/checkout-sdk'; import { isEmpty } from 'lodash'; import React, { memo, FunctionComponent } from 'react'; @@ -14,12 +14,16 @@ export interface StaticAddressProps { type?: AddressType; } +export interface StaticAddressEditableProps extends StaticAddressProps { + initialize?(options: ShippingInitializeOptions): Promise; +} + interface WithCheckoutStaticAddressProps { countries?: Country[]; fields?: FormField[]; } -const StaticAddress: FunctionComponent = ({ +const StaticAddress: FunctionComponent = ({ countries, fields, address: addressWithoutLocalization, diff --git a/src/app/billing/StaticBillingAddress.spec.tsx b/src/app/billing/StaticBillingAddress.spec.tsx index a94b8d92b3..935b8c69dc 100644 --- a/src/app/billing/StaticBillingAddress.spec.tsx +++ b/src/app/billing/StaticBillingAddress.spec.tsx @@ -64,4 +64,46 @@ describe('StaticBillingAddress', () => { expect(container.text()) .toEqual(getLanguageService().translate('billing.billing_address_amazon')); }); + + it('renders message instead of address when using Amazon Pay V2 and no full address is provided', () => { + jest.spyOn(checkoutState.data, 'getCheckout') + .mockReturnValue({ + ...getCheckout(), + payments: [ + { ...getCheckoutPayment(), providerId: 'amazonpay' }, + ], + }); + + const addressData = { + ...getAddress(), + firstName: '', + }; + + const container = mount(); + + expect(container.find(StaticAddress).length) + .toEqual(0); + + expect(container.text()) + .toEqual(getLanguageService().translate('billing.billing_address_amazon')); + }); + + it('renders address when using Amazon Pay V2 when full address is provided', () => { + jest.spyOn(checkoutState.data, 'getCheckout') + .mockReturnValue({ + ...getCheckout(), + payments: [ + { ...getCheckoutPayment(), providerId: 'amazonpay' }, + ], + }); + + const addressData = { + ...getAddress(), + }; + + const container = mount(); + + expect(container.find(StaticAddress).length) + .toEqual(1); + }); }); diff --git a/src/app/billing/StaticBillingAddress.tsx b/src/app/billing/StaticBillingAddress.tsx index d01c874a7a..ca9c659817 100644 --- a/src/app/billing/StaticBillingAddress.tsx +++ b/src/app/billing/StaticBillingAddress.tsx @@ -22,7 +22,8 @@ const StaticBillingAddress: FunctionComponent< address, payments = EMPTY_ARRAY, }) => { - if (payments.find(payment => payment.providerId === 'amazon')) { + if (payments.find(payment => payment.providerId === 'amazon') || + (payments.find(payment => payment.providerId === 'amazonpay' && address.firstName === ''))) { return (

); diff --git a/src/app/customer/CheckoutButtonList.tsx b/src/app/customer/CheckoutButtonList.tsx index 77e9c6b7a5..0b56e5e66d 100644 --- a/src/app/customer/CheckoutButtonList.tsx +++ b/src/app/customer/CheckoutButtonList.tsx @@ -8,6 +8,7 @@ import CheckoutButton from './CheckoutButton'; // TODO: The API should tell UI which payment method offers its own checkout button export const SUPPORTED_METHODS: string[] = [ 'amazon', + 'amazonpay', 'braintreevisacheckout', 'chasepay', 'masterpass', diff --git a/src/app/customer/canSignOut.spec.ts b/src/app/customer/canSignOut.spec.ts index 4e7420e0c4..7da20ffe3c 100644 --- a/src/app/customer/canSignOut.spec.ts +++ b/src/app/customer/canSignOut.spec.ts @@ -35,4 +35,12 @@ describe('canSignOut()', () => { expect(canSignOut(customer, checkout, 'amazon')) .toEqual(true); }); + + it('returns true if customer uses amazonpay as checkout method', () => { + const customer = getCustomer(); + const checkout = getCheckoutWithPayments(); + + expect(canSignOut(customer, checkout, 'amazonpay')) + .toEqual(true); + }); }); diff --git a/src/app/customer/canSignOut.ts b/src/app/customer/canSignOut.ts index f8b0527497..aa5f9bfcd6 100644 --- a/src/app/customer/canSignOut.ts +++ b/src/app/customer/canSignOut.ts @@ -5,6 +5,7 @@ import { SUPPORTED_METHODS } from './CheckoutButtonList'; const SUPPORTED_SIGNOUT_METHODS = [ 'amazon', + 'amazonpay', ]; export const isSupportedSignoutMethod = (methodId: string): boolean => { diff --git a/src/app/payment/Payment.tsx b/src/app/payment/Payment.tsx index ab0aa3f171..ae709d2c50 100644 --- a/src/app/payment/Payment.tsx +++ b/src/app/payment/Payment.tsx @@ -250,6 +250,7 @@ class Payment extends Component { + let method: PaymentMethod; + let checkoutService: CheckoutService; + let checkoutState: CheckoutSelectors; + let defaultProps: PaymentMethodProps; + let localeContext: LocaleContextType; + let PaymentMethodTest: FunctionComponent; + + beforeEach(() => { + defaultProps = { + method: getPaymentMethod(), + onUnhandledError: jest.fn(), + }; + + checkoutService = createCheckoutService(); + checkoutState = checkoutService.getState(); + localeContext = createLocaleContext(getStoreConfig()); + method = { ...getPaymentMethod(), + id: PaymentMethodId.AmazonPay, + initializationData: { + paymentDescriptor: 'Hey Amazon', + paymentToken: 'abcdefg', + }}; + + jest.spyOn(checkoutState.data, 'getConfig') + .mockReturnValue(getStoreConfig()); + + jest.spyOn(checkoutService, 'deinitializePayment') + .mockResolvedValue(checkoutState); + + jest.spyOn(checkoutService, 'initializePayment') + .mockResolvedValue(checkoutState); + + PaymentMethodTest = props => ( + + + + + + + + ); + }); + + it('renders as hosted widget method', () => { + const container = mount(); + const component: ReactWrapper = container.find(HostedWidgetPaymentMethod); + + expect(component.props()) + .toEqual(expect.objectContaining({ + buttonId: 'editButtonId', + containerId: 'paymentWidget', + deinitializeCustomer: undefined, + hideWidget: true, + initializeCustomer: undefined, + initializePayment: expect.any(Function), + isSignInRequired: false, + method, + onSignOut: expect.any(Function), + paymentDescriptor: 'Hey Amazon', + shouldShowDescriptor: true, + shouldShowEditButton: true, + })); + }); + + it('initializes method with required config', () => { + const container = mount(); + const component: ReactWrapper = container.find(HostedWidgetPaymentMethod); + + component.prop('initializePayment')({ + methodId: method.id, + gatewayId: method.gateway, + }); + + expect(checkoutService.initializePayment) + .toHaveBeenCalledWith(expect.objectContaining({ + methodId: method.id, + gatewayId: method.gateway, + [method.id]: { + editButtonId: 'editButtonId', + }, + })); + }); +}); diff --git a/src/app/payment/paymentMethod/AmazonPayV2PaymentMethod.tsx b/src/app/payment/paymentMethod/AmazonPayV2PaymentMethod.tsx new file mode 100644 index 0000000000..76c74f6867 --- /dev/null +++ b/src/app/payment/paymentMethod/AmazonPayV2PaymentMethod.tsx @@ -0,0 +1,43 @@ +import { CheckoutSelectors, PaymentInitializeOptions } from '@bigcommerce/checkout-sdk'; +import React, { useCallback, FunctionComponent } from 'react'; +import { Omit } from 'utility-types'; + +import HostedWidgetPaymentMethod , { HostedWidgetPaymentMethodProps } from './HostedWidgetPaymentMethod'; + +export interface AmazonPayV2PaymentMethodProps extends Omit { + initializePayment(options: PaymentInitializeOptions): Promise; +} + +const AmazonPayV2PaymentMethod: FunctionComponent = ({ + initializePayment, + method, + method: { initializationData: { paymentDescriptor, paymentToken } }, + ...rest +}) => { + const initializeAmazonPayV2Payment = useCallback((options: PaymentInitializeOptions) => initializePayment({ + ...options, + amazonpay: { + editButtonId: 'editButtonId', + }, + }), [initializePayment]); + + const reload = useCallback(() => window.location.reload(), []); + + return ; +}; + +export default AmazonPayV2PaymentMethod; diff --git a/src/app/payment/paymentMethod/HostedWidgetPaymentMethod.spec.tsx b/src/app/payment/paymentMethod/HostedWidgetPaymentMethod.spec.tsx index 1d64a81f51..7b812369e4 100644 --- a/src/app/payment/paymentMethod/HostedWidgetPaymentMethod.spec.tsx +++ b/src/app/payment/paymentMethod/HostedWidgetPaymentMethod.spec.tsx @@ -9,6 +9,7 @@ import { CheckoutProvider } from '../../checkout'; import { getCheckout, getCheckoutPayment } from '../../checkout/checkouts.mock'; import { getStoreConfig } from '../../config/config.mock'; import { getCustomer } from '../../customer/customers.mock'; +import { TranslatedString } from '../../locale'; import { getConsignment } from '../../shipping/consignment.mock'; import { LoadingOverlay } from '../../ui/loading'; import { CreditCardStorageField } from '../creditCard'; @@ -146,6 +147,30 @@ describe('HostedWidgetPaymentMethod', () => { .toHaveLength(0); }); + it('shows the payment descriptor', () => { + const propsDescriptor = { + ...defaultProps, + shouldShowDescriptor: true, + paymentDescriptor: 'meow', + }; + + const component = mount(); + + expect(component.find('.payment-descriptor')).toHaveLength(1); + }); + + it('does not show the payment descriptor', () => { + const propsDescriptor = { + ...defaultProps, + shouldShowDescriptor: false, + paymentDescriptor: 'meow', + }; + + const component = mount(); + + expect(component.find('.payment-descriptor')).toHaveLength(0); + }); + describe('when user is signed into their payment method account', () => { beforeEach(() => { jest.spyOn(checkoutState.data, 'getCheckout') @@ -204,6 +229,18 @@ describe('HostedWidgetPaymentMethod', () => { expect(handleSignOutError) .toHaveBeenCalledWith(expect.any(Error)); }); + + it('renders link for user to edit their selected credit card', () => { + const payMethodId = 'walletButton'; + const component = mount(); + + expect(component.find(`#${payMethodId}`).find(TranslatedString).prop('id')) + .toEqual('remote.select_different_card_action'); + }); }); describe('when user is not signed into their payment method account and is required to', () => { diff --git a/src/app/payment/paymentMethod/HostedWidgetPaymentMethod.tsx b/src/app/payment/paymentMethod/HostedWidgetPaymentMethod.tsx index 10ca1b09f9..6af2612e69 100644 --- a/src/app/payment/paymentMethod/HostedWidgetPaymentMethod.tsx +++ b/src/app/payment/paymentMethod/HostedWidgetPaymentMethod.tsx @@ -5,8 +5,10 @@ import { find, noop, some } from 'lodash'; import React, { Component, ReactNode } from 'react'; import { withCheckout, CheckoutContextProps } from '../../checkout'; +import { preventDefault } from '../../common/dom'; import { connectFormik, ConnectFormikProps } from '../../common/form'; import { MapToProps } from '../../common/hoc'; +import { TranslatedString } from '../../locale'; import { LoadingOverlay } from '../../ui/loading'; import { CreditCardStorageField } from '../creditCard'; import { isBankAccountInstrument, isCardInstrument, isInstrumentCardCodeRequiredSelector, isInstrumentCardNumberRequiredSelector, isInstrumentFeatureAvailable, AccountInstrumentFieldset, AccountInstrumentStorageField, CardInstrumentFieldset, CreditCardValidation } from '../storedInstrument'; @@ -17,15 +19,20 @@ import SignOutLink from './SignOutLink'; export interface HostedWidgetPaymentMethodProps { additionalContainerClassName?: string; + buttonId?: string; containerId: string; hideContentWhenSignedOut?: boolean; hideVerificationFields?: boolean; isAccountInstrument?: boolean; + hideWidget?: boolean; isInitializing?: boolean; isUsingMultiShipping?: boolean; isSignInRequired?: boolean; method: PaymentMethod; + paymentDescriptor?: string; shouldHideInstrumentExpiryDate?: boolean; + shouldShowDescriptor?: boolean; + shouldShowEditButton?: boolean; validateInstrument?(shouldShowNumberField: boolean): React.ReactNode; deinitializeCustomer?(options: CustomerRequestOptions): Promise; deinitializePayment(options: PaymentRequestOptions): Promise; @@ -141,6 +148,7 @@ class HostedWidgetPaymentMethod extends Component< instruments, containerId, hideContentWhenSignedOut = false, + hideWidget = false, isInitializing = false, isSignedIn = false, isSignInRequired = false, @@ -161,9 +169,9 @@ class HostedWidgetPaymentMethod extends Component< const shouldShowInstrumentFieldset = isInstrumentFeatureAvailableProp && instruments.length > 0; const shouldShowCreditCardFieldset = !shouldShowInstrumentFieldset || isAddingNewCard; const shouldShowSaveInstrument = isInstrumentFeatureAvailableProp && shouldShowCreditCardFieldset; - const isLoading = isInitializing || isLoadingInstruments; + const isLoading = (isInitializing || isLoadingInstruments) && !hideWidget; - const selectedAccountInstrument = selectedInstrumentId && selectedInstrument && isBankAccountInstrument(selectedInstrument) ? selectedInstrument : undefined; + const selectedAccountInstrument = selectedInstrument && isBankAccountInstrument(selectedInstrument) ? selectedInstrument : undefined; return ( } + { this.renderPaymentDescriptorIfAvailable() } +
{ shouldShowSaveInstrument && this.renderSaveInstrumentCheckbox() } + { this.renderEditButtonIfAvailable() } + { isSignedIn && ; + + if (shouldShowEditButton) { + return ( +

+ + { translatedString } + +

+ ); + } + } + + private renderPaymentDescriptorIfAvailable() { + const { shouldShowDescriptor, paymentDescriptor } = this.props; + + if (shouldShowDescriptor && paymentDescriptor) { + return( +
{ paymentDescriptor }
+ ); + } + } + private renderSaveInstrumentCheckbox() { const { isAccountInstrument } = this.props; diff --git a/src/app/payment/paymentMethod/PaymentMethod.tsx b/src/app/payment/paymentMethod/PaymentMethod.tsx index c48d9fa21a..0dd797647e 100644 --- a/src/app/payment/paymentMethod/PaymentMethod.tsx +++ b/src/app/payment/paymentMethod/PaymentMethod.tsx @@ -6,6 +6,7 @@ import { withCheckout, CheckoutContextProps } from '../../checkout'; import AdyenV2PaymentMethod from './AdyenV2PaymentMethod'; import AffirmPaymentMethod from './AffirmPaymentMethod'; import AmazonPaymentMethod from './AmazonPaymentMethod'; +import AmazonPayV2PaymentMethod from './AmazonPayV2PaymentMethod'; import BarclaycardPaymentMethod from './BarclaycardPaymentMethod'; import BlueSnapV2PaymentMethod from './BlueSnapV2PaymentMethod'; import BraintreeCreditCardPaymentMethod from './BraintreeCreditCardPaymentMethod'; @@ -71,6 +72,10 @@ const PaymentMethodComponent: FunctionComponent; } + if (method.id === PaymentMethodId.AmazonPay) { + return ; + } + if (method.id === PaymentMethodId.Affirm) { return ; } diff --git a/src/app/payment/paymentMethod/PaymentMethodId.ts b/src/app/payment/paymentMethod/PaymentMethodId.ts index 610b7e04dd..da1f36fb2a 100644 --- a/src/app/payment/paymentMethod/PaymentMethodId.ts +++ b/src/app/payment/paymentMethod/PaymentMethodId.ts @@ -5,6 +5,7 @@ enum PaymentMethodId { Affirm = 'affirm', Afterpay = 'afterpay', Amazon = 'amazon', + AmazonPay = 'amazonpay', Barclaycard = 'barclaycard', BlueSnapV2 = 'bluesnapv2', Braintree = 'braintree', diff --git a/src/app/payment/paymentMethod/PaymentMethodTitle.tsx b/src/app/payment/paymentMethod/PaymentMethodTitle.tsx index b9d308996f..fe4033e924 100644 --- a/src/app/payment/paymentMethod/PaymentMethodTitle.tsx +++ b/src/app/payment/paymentMethod/PaymentMethodTitle.tsx @@ -65,6 +65,10 @@ function getPaymentMethodTitle( logoUrl: cdnPath('/img/payment-providers/amazon-header.png'), titleText: '', }, + [PaymentMethodId.AmazonPay]: { + logoUrl: cdnPath('/img/payment-providers/amazon-header.png'), + titleText: '', + }, [PaymentMethodId.ChasePay]: { logoUrl: cdnPath('/img/payment-providers/chase-pay.png'), titleText: '', diff --git a/src/app/payment/paymentMethod/getPaymentMethodName.ts b/src/app/payment/paymentMethod/getPaymentMethodName.ts index fcdeb04f52..74ed2ddb94 100644 --- a/src/app/payment/paymentMethod/getPaymentMethodName.ts +++ b/src/app/payment/paymentMethod/getPaymentMethodName.ts @@ -52,6 +52,10 @@ export function getTranslatedPaymentMethodName( return language.translate('payment.amazon_name_text'); } + if (method.id === PaymentMethodId.AmazonPay) { + return language.translate('payment.amazon_name_text'); + } + if (method.id === PaymentMethodId.Klarna) { return language.translate('payment.klarna_name_text'); } diff --git a/src/app/shipping/Shipping.spec.tsx b/src/app/shipping/Shipping.spec.tsx index 835a5e1fe1..946b987219 100644 --- a/src/app/shipping/Shipping.spec.tsx +++ b/src/app/shipping/Shipping.spec.tsx @@ -13,7 +13,7 @@ import { createLocaleContext, LocaleContext, LocaleContextType } from '../locale import { getConsignment } from './consignment.mock'; import { getShippingAddress } from './shipping-addresses.mock'; -import Shipping, { ShippingProps } from './Shipping'; +import Shipping, { ShippingProps, WithCheckoutShippingProps } from './Shipping'; import ShippingForm from './ShippingForm'; describe('Shipping Component', () => { @@ -22,7 +22,7 @@ describe('Shipping Component', () => { let checkoutService: CheckoutService; let checkoutState: CheckoutSelectors; let defaultProps: ShippingProps; - let ComponentTest: FunctionComponent; + let ComponentTest: FunctionComponent & Partial; beforeEach(() => { localeContext = createLocaleContext(getStoreConfig()); @@ -59,10 +59,10 @@ describe('Shipping Component', () => { }, } as Cart); - jest.spyOn(checkoutService.getState().data, 'getShippingAddress') + jest.spyOn(checkoutState.data, 'getShippingAddress') .mockReturnValue(getShippingAddress()); - jest.spyOn(checkoutService.getState().data, 'getBillingAddress') + jest.spyOn(checkoutState.data, 'getBillingAddress') .mockReturnValue(undefined); jest.spyOn(checkoutState.data, 'getConfig') diff --git a/src/app/shipping/Shipping.tsx b/src/app/shipping/Shipping.tsx index 196dbf5c98..be4629050b 100644 --- a/src/app/shipping/Shipping.tsx +++ b/src/app/shipping/Shipping.tsx @@ -157,10 +157,12 @@ class Shipping extends Component> = []; + const hasRemoteBilling = this.hasRemoteBilling(methodId); if (!isEqualAddress(updatedShippingAddress, shippingAddress)) { promises.push(updateShippingAddress(updatedShippingAddress || {})); @@ -168,7 +170,8 @@ class Shipping extends Component boolean = methodId => { + const PAYMENT_METHOD_VALID = ['amazonpay']; + + return PAYMENT_METHOD_VALID.some(method => method === methodId); + }; + private handleUseNewAddress: (address: Address, itemId: string) => void = async (address, itemId) => { const { unassignItem, onUnhandledError } = this.props; @@ -257,6 +266,7 @@ export function mapToShippingProps({ getShippingCountries, }, statuses: { + isShippingStepPending, isSelectingShippingOption, isLoadingShippingOptions, isUpdatingConsignment, @@ -290,6 +300,7 @@ export function mapToShippingProps({ const methodId = getShippingMethodId(checkout); const shippableItemsCount = getShippableItemsCount(cart); const isLoading = ( + isShippingStepPending() || isLoadingShippingOptions() || isSelectingShippingOption() || isUpdatingConsignment() || diff --git a/src/app/shipping/ShippingAddress.spec.tsx b/src/app/shipping/ShippingAddress.spec.tsx index 1d6e9f74db..ef4c62394e 100644 --- a/src/app/shipping/ShippingAddress.spec.tsx +++ b/src/app/shipping/ShippingAddress.spec.tsx @@ -3,6 +3,7 @@ import { Formik } from 'formik'; import { noop } from 'lodash'; import React from 'react'; +import { StaticAddress } from '../address/'; import { getFormFields } from '../address/formField.mock'; import { getCustomer } from '../customer/customers.mock'; @@ -11,6 +12,7 @@ import { getShippingAddress } from './shipping-addresses.mock'; import RemoteShippingAddress from './RemoteShippingAddress'; import ShippingAddress, { ShippingAddressProps } from './ShippingAddress'; import ShippingAddressForm from './ShippingAddressForm'; +import StaticAddressEditable from './StaticAddressEditable'; describe('ShippingAddress Component', () => { const defaultProps: ShippingAddressProps = { @@ -76,6 +78,19 @@ describe('ShippingAddress Component', () => { expect(component.find(RemoteShippingAddress).length).toEqual(0); }); + + it('does not render StaticAddress if method id is not sent', () => { + const component = mount( + + + + ); + + expect(component.find(StaticAddress).length).toEqual(0); + }); }); describe('when method id is provided', () => { @@ -119,5 +134,18 @@ describe('ShippingAddress Component', () => { expect(component.find(ShippingAddressForm).length).toEqual(0); }); + + it('renders a StaticAddressEditable if methodId is amazon pay', () => { + const component = mount( + + + + ); + + expect(component.find(StaticAddressEditable).length).toEqual(1); + }); }); }); diff --git a/src/app/shipping/ShippingAddress.tsx b/src/app/shipping/ShippingAddress.tsx index 405a48e912..6004387b18 100644 --- a/src/app/shipping/ShippingAddress.tsx +++ b/src/app/shipping/ShippingAddress.tsx @@ -7,6 +7,7 @@ import { FormContext } from '../ui/form'; import RemoteShippingAddress from './RemoteShippingAddress'; import ShippingAddressForm from './ShippingAddressForm'; +import StaticAddressEditable from './StaticAddressEditable'; export interface ShippingAddressProps { addresses: CustomerAddress[]; @@ -77,18 +78,39 @@ const ShippingAddress: FunctionComponent = props => { onError: onUnhandledError, }, }; + + return ( + + ); } - return ( - - ); + if (methodId === 'amazonpay' && shippingAddress) { + const editAddressButtonId = 'edit-ship-button'; + + options = { + amazonpay: { + editAddressButtonId, + }, + }; + + return ( + + ); + } } return ( diff --git a/src/app/shipping/SingleShippingForm.tsx b/src/app/shipping/SingleShippingForm.tsx index 2c8b8fd742..e47ec2c253 100644 --- a/src/app/shipping/SingleShippingForm.tsx +++ b/src/app/shipping/SingleShippingForm.tsx @@ -112,7 +112,8 @@ class SingleShippingForm extends PureComponent method === methodId); return (
@@ -127,7 +128,7 @@ class SingleShippingForm extends PureComponent { + let defaultProps: StaticAddressEditableProps; + + defaultProps = { + address: getAddress(), + buttonId: 'foo', + isLoading: false, + methodId: 'bar', + initialize: jest.fn(), + deinitialize: jest.fn(), + }; + + it('renders static address and button to edit', () => { + const component = mount(); + + expect(component.find(StaticAddress).length) + .toEqual(1); + + expect(component.find(Button).length) + .toEqual(1); + }); + + it('calls initialize prop on mount', () => { + shallow(); + + expect(defaultProps.initialize).toHaveBeenCalled(); + }); + + it('calls deinitialize prop on unmount', () => { + shallow().unmount(); + + expect(defaultProps.initialize).toHaveBeenCalled(); + }); +}); diff --git a/src/app/shipping/StaticAddressEditable.tsx b/src/app/shipping/StaticAddressEditable.tsx new file mode 100644 index 0000000000..2a539fc093 --- /dev/null +++ b/src/app/shipping/StaticAddressEditable.tsx @@ -0,0 +1,85 @@ +import { Address, CheckoutSelectors, ShippingInitializeOptions, ShippingRequestOptions } from '@bigcommerce/checkout-sdk'; +import { noop } from 'lodash'; +import React, { PureComponent, ReactNode } from 'react'; + +import { StaticAddress } from '../address/'; +import { preventDefault } from '../common/dom'; +import { TranslatedString } from '../locale'; +import { Button, ButtonSize, ButtonVariant } from '../ui/button'; +import { LoadingOverlay } from '../ui/loading'; + +import './StaticAddressEditable.scss'; + +export interface StaticAddressEditableProps { + address: Address; + buttonId: string; + isLoading: boolean; + methodId?: string; + deinitialize(options?: ShippingRequestOptions): Promise; + initialize(options?: ShippingInitializeOptions): Promise; + onUnhandledError?(error: Error): void; +} + +class StaticAddressEditable extends PureComponent { + async componentDidMount(): Promise { + const { + initialize, + methodId, + onUnhandledError = noop, + } = this.props; + + try { + await initialize({ methodId }); + } catch (error) { + onUnhandledError(error); + } + } + + async componentWillUnmount(): Promise { + const { + deinitialize, + methodId, + onUnhandledError = noop, + } = this.props; + + try { + await deinitialize({ methodId }); + } catch (error) { + onUnhandledError(error); + } + } + + render(): ReactNode { + const { + address, + buttonId, + isLoading, + } = this.props; + + return ( + +
+
+ +
+ +
+ +
+
+ + ); + } +} + +export default StaticAddressEditable; diff --git a/src/app/shipping/getShippingMethodId.ts b/src/app/shipping/getShippingMethodId.ts index 991efb42a3..0d329691c6 100644 --- a/src/app/shipping/getShippingMethodId.ts +++ b/src/app/shipping/getShippingMethodId.ts @@ -14,7 +14,7 @@ function getPreselectedPayment(checkout: Checkout): CheckoutPayment | undefined } export default function getShippingMethodId(checkout: Checkout): string | undefined { - const SHIPPING_METHOD_IDS = ['amazon']; + const SHIPPING_METHOD_IDS = ['amazon', 'amazonpay']; const preselectedPayment = getPreselectedPayment(checkout); return preselectedPayment && SHIPPING_METHOD_IDS.indexOf(preselectedPayment.providerId) > -1 ? diff --git a/src/scss/components/checkout/widget/_widget.scss b/src/scss/components/checkout/widget/_widget.scss index 525996df91..73ebf359a5 100644 --- a/src/scss/components/checkout/widget/_widget.scss +++ b/src/scss/components/checkout/widget/_widget.scss @@ -65,3 +65,7 @@ border-color: $input-focus-border-color; box-shadow: $input-focus-boxShadow; } + +.widget-link-amazonpay { + padding-bottom: spacing("quarter"); +} From 3a47ee663aa0e7a63a8a4d5fcfc45fa0570dd273 Mon Sep 17 00:00:00 2001 From: Mauricio Sanchez Date: Tue, 23 Jun 2020 11:38:18 -0500 Subject: [PATCH 2/2] feat(checkout): INT-2118 Bump checkout-sdk version to 1.78.0 --- package-lock.json | 225 +++++++++++++++++++++------------------------- package.json | 2 +- 2 files changed, 101 insertions(+), 126 deletions(-) diff --git a/package-lock.json b/package-lock.json index 383495adf5..d6f0c99167 100644 --- a/package-lock.json +++ b/package-lock.json @@ -255,9 +255,9 @@ } }, "@babel/helper-validator-identifier": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.1.tgz", - "integrity": "sha512-5vW/JXLALhczRCWP0PnFDMCJAchlBvM7f4uk/jXritBnIa6E1KmqmtrS3yn1LAnxFBypQ3eneLuXjsnfQsgILw==" + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.3.tgz", + "integrity": "sha512-bU8JvtlYpJSBPuj1VUmKpFGaDZuLxASky3LhaKj3bmpSTY6VWooSM8msk+Z0CZoErFye2tlABF6yDkT3FOPAXw==" }, "@babel/helper-wrap-function": { "version": "7.2.0", @@ -383,9 +383,9 @@ }, "dependencies": { "@babel/helper-plugin-utils": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.1.tgz", - "integrity": "sha512-fvoGeXt0bJc7VMWZGCAEBEMo/HAjW2mP8apF5eXK0wSqwLAVHAISCWRoLMBMUs2kqeaG77jltVqu4Hn8Egl3nA==" + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.3.tgz", + "integrity": "sha512-j/+j8NAWUTxOtx4LKHybpSClxHoq6I91DQ/mKgAXn5oNUPIUiGppjPIX3TDtJWPrdfP9Kfl7e4fgVMiQR9VE/g==" } } }, @@ -398,9 +398,9 @@ }, "dependencies": { "@babel/helper-plugin-utils": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.1.tgz", - "integrity": "sha512-fvoGeXt0bJc7VMWZGCAEBEMo/HAjW2mP8apF5eXK0wSqwLAVHAISCWRoLMBMUs2kqeaG77jltVqu4Hn8Egl3nA==" + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.3.tgz", + "integrity": "sha512-j/+j8NAWUTxOtx4LKHybpSClxHoq6I91DQ/mKgAXn5oNUPIUiGppjPIX3TDtJWPrdfP9Kfl7e4fgVMiQR9VE/g==" } } }, @@ -422,9 +422,9 @@ }, "dependencies": { "@babel/helper-plugin-utils": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.1.tgz", - "integrity": "sha512-fvoGeXt0bJc7VMWZGCAEBEMo/HAjW2mP8apF5eXK0wSqwLAVHAISCWRoLMBMUs2kqeaG77jltVqu4Hn8Egl3nA==" + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.3.tgz", + "integrity": "sha512-j/+j8NAWUTxOtx4LKHybpSClxHoq6I91DQ/mKgAXn5oNUPIUiGppjPIX3TDtJWPrdfP9Kfl7e4fgVMiQR9VE/g==" } } }, @@ -446,9 +446,9 @@ }, "dependencies": { "@babel/helper-plugin-utils": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.1.tgz", - "integrity": "sha512-fvoGeXt0bJc7VMWZGCAEBEMo/HAjW2mP8apF5eXK0wSqwLAVHAISCWRoLMBMUs2kqeaG77jltVqu4Hn8Egl3nA==" + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.3.tgz", + "integrity": "sha512-j/+j8NAWUTxOtx4LKHybpSClxHoq6I91DQ/mKgAXn5oNUPIUiGppjPIX3TDtJWPrdfP9Kfl7e4fgVMiQR9VE/g==" } } }, @@ -461,9 +461,9 @@ }, "dependencies": { "@babel/helper-plugin-utils": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.1.tgz", - "integrity": "sha512-fvoGeXt0bJc7VMWZGCAEBEMo/HAjW2mP8apF5eXK0wSqwLAVHAISCWRoLMBMUs2kqeaG77jltVqu4Hn8Egl3nA==" + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.3.tgz", + "integrity": "sha512-j/+j8NAWUTxOtx4LKHybpSClxHoq6I91DQ/mKgAXn5oNUPIUiGppjPIX3TDtJWPrdfP9Kfl7e4fgVMiQR9VE/g==" } } }, @@ -476,9 +476,9 @@ }, "dependencies": { "@babel/helper-plugin-utils": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.1.tgz", - "integrity": "sha512-fvoGeXt0bJc7VMWZGCAEBEMo/HAjW2mP8apF5eXK0wSqwLAVHAISCWRoLMBMUs2kqeaG77jltVqu4Hn8Egl3nA==" + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.3.tgz", + "integrity": "sha512-j/+j8NAWUTxOtx4LKHybpSClxHoq6I91DQ/mKgAXn5oNUPIUiGppjPIX3TDtJWPrdfP9Kfl7e4fgVMiQR9VE/g==" } } }, @@ -509,9 +509,9 @@ }, "dependencies": { "@babel/helper-plugin-utils": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.1.tgz", - "integrity": "sha512-fvoGeXt0bJc7VMWZGCAEBEMo/HAjW2mP8apF5eXK0wSqwLAVHAISCWRoLMBMUs2kqeaG77jltVqu4Hn8Egl3nA==" + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.3.tgz", + "integrity": "sha512-j/+j8NAWUTxOtx4LKHybpSClxHoq6I91DQ/mKgAXn5oNUPIUiGppjPIX3TDtJWPrdfP9Kfl7e4fgVMiQR9VE/g==" } } }, @@ -981,19 +981,19 @@ }, "dependencies": { "@babel/code-frame": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.10.1.tgz", - "integrity": "sha512-IGhtTmpjGbYzcEDOw7DcQtbQSXcG9ftmAXtWTu9V936vDye4xjjekktFAtgZsWpzTj/X01jocB46mTywm/4SZw==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.10.3.tgz", + "integrity": "sha512-fDx9eNW0qz0WkUeqL6tXEXzVlPh6Y5aCDEZesl0xBGA8ndRukX91Uk44ZqnkECp01NAZUdCAl+aiQNGi0k88Eg==", "requires": { - "@babel/highlight": "^7.10.1" + "@babel/highlight": "^7.10.3" } }, "@babel/generator": { - "version": "7.10.2", - "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.10.2.tgz", - "integrity": "sha512-AxfBNHNu99DTMvlUPlt1h2+Hn7knPpH5ayJ8OqDWSeLld+Fi2AYBTC/IejWDM9Edcii4UzZRCsbUt0WlSDsDsA==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.10.3.tgz", + "integrity": "sha512-drt8MUHbEqRzNR0xnF8nMehbY11b1SDkRw03PSNH/3Rb2Z35oxkddVSi3rcaak0YJQ86PCuE7Qx1jSFhbLNBMA==", "requires": { - "@babel/types": "^7.10.2", + "@babel/types": "^7.10.3", "jsesc": "^2.5.1", "lodash": "^4.17.13", "source-map": "^0.5.0" @@ -1007,37 +1007,37 @@ } }, "@babel/helper-function-name": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.10.1.tgz", - "integrity": "sha512-fcpumwhs3YyZ/ttd5Rz0xn0TpIwVkN7X0V38B9TWNfVF42KEkhkAAuPCQ3oXmtTRtiPJrmZ0TrfS0GKF0eMaRQ==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.10.3.tgz", + "integrity": "sha512-FvSj2aiOd8zbeqijjgqdMDSyxsGHaMt5Tr0XjQsGKHD3/1FP3wksjnLAWzxw7lvXiej8W1Jt47SKTZ6upQNiRw==", "requires": { - "@babel/helper-get-function-arity": "^7.10.1", - "@babel/template": "^7.10.1", - "@babel/types": "^7.10.1" + "@babel/helper-get-function-arity": "^7.10.3", + "@babel/template": "^7.10.3", + "@babel/types": "^7.10.3" } }, "@babel/helper-get-function-arity": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.10.1.tgz", - "integrity": "sha512-F5qdXkYGOQUb0hpRaPoetF9AnsXknKjWMZ+wmsIRsp5ge5sFh4c3h1eH2pRTTuy9KKAA2+TTYomGXAtEL2fQEw==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.10.3.tgz", + "integrity": "sha512-iUD/gFsR+M6uiy69JA6fzM5seno8oE85IYZdbVVEuQaZlEzMO2MXblh+KSPJgsZAUx0EEbWXU0yJaW7C9CdAVg==", "requires": { - "@babel/types": "^7.10.1" + "@babel/types": "^7.10.3" } }, "@babel/helper-member-expression-to-functions": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.10.1.tgz", - "integrity": "sha512-u7XLXeM2n50gb6PWJ9hoO5oO7JFPaZtrh35t8RqKLT1jFKj9IWeD1zrcrYp1q1qiZTdEarfDWfTIP8nGsu0h5g==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.10.3.tgz", + "integrity": "sha512-q7+37c4EPLSjNb2NmWOjNwj0+BOyYlssuQ58kHEWk1Z78K5i8vTUsteq78HMieRPQSl/NtpQyJfdjt3qZ5V2vw==", "requires": { - "@babel/types": "^7.10.1" + "@babel/types": "^7.10.3" } }, "@babel/helper-module-imports": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.10.1.tgz", - "integrity": "sha512-SFxgwYmZ3HZPyZwJRiVNLRHWuW2OgE5k2nrVs6D9Iv4PPnXVffuEHy83Sfx/l4SqF+5kyJXjAyUmrG7tNm+qVg==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.10.3.tgz", + "integrity": "sha512-Jtqw5M9pahLSUWA+76nhK9OG8nwYXzhQzVIGFoNaHnXF/r4l7kz4Fl0UAW7B6mqC5myoJiBP5/YQlXQTMfHI9w==", "requires": { - "@babel/types": "^7.10.1" + "@babel/types": "^7.10.3" } }, "@babel/helper-module-transforms": { @@ -1055,11 +1055,11 @@ } }, "@babel/helper-optimise-call-expression": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.10.1.tgz", - "integrity": "sha512-a0DjNS1prnBsoKx83dP2falChcs7p3i8VMzdrSbfLhuQra/2ENC4sbri34dz/rWmDADsmF1q5GbfaXydh0Jbjg==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.10.3.tgz", + "integrity": "sha512-kT2R3VBH/cnSz+yChKpaKRJQJWxdGoc6SjioRId2wkeV3bK0wLLioFpJROrX0U4xr/NmxSSAWT/9Ih5snwIIzg==", "requires": { - "@babel/types": "^7.10.1" + "@babel/types": "^7.10.3" } }, "@babel/helper-replace-supers": { @@ -1101,11 +1101,11 @@ } }, "@babel/highlight": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.10.1.tgz", - "integrity": "sha512-8rMof+gVP8mxYZApLF/JgNDAkdKa+aJt3ZYxF8z6+j/hpeXL7iMsKCPHa2jNMHu/qqBwzQF4OHNoYi8dMA/rYg==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.10.3.tgz", + "integrity": "sha512-Ih9B/u7AtgEnySE2L2F0Xm0GaM729XqqLfHkalTsbjXGyqmf/6M0Cu0WpvqueUlW+xk88BHw9Nkpj49naU+vWw==", "requires": { - "@babel/helper-validator-identifier": "^7.10.1", + "@babel/helper-validator-identifier": "^7.10.3", "chalk": "^2.0.0", "js-tokens": "^4.0.0" }, @@ -1157,42 +1157,42 @@ } }, "@babel/parser": { - "version": "7.10.2", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.10.2.tgz", - "integrity": "sha512-PApSXlNMJyB4JiGVhCOlzKIif+TKFTvu0aQAhnTvfP/z3vVSN6ZypH5bfUNwFXXjRQtUEBNFd2PtmCmG2Py3qQ==" + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.10.3.tgz", + "integrity": "sha512-oJtNJCMFdIMwXGmx+KxuaD7i3b8uS7TTFYW/FNG2BT8m+fmGHoiPYoH0Pe3gya07WuFmM5FCDIr1x0irkD/hyA==" }, "@babel/template": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.10.1.tgz", - "integrity": "sha512-OQDg6SqvFSsc9A0ej6SKINWrpJiNonRIniYondK2ViKhB06i3c0s+76XUft71iqBEe9S1OKsHwPAjfHnuvnCig==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.10.3.tgz", + "integrity": "sha512-5BjI4gdtD+9fHZUsaxPHPNpwa+xRkDO7c7JbhYn2afvrkDu5SfAAbi9AIMXw2xEhO/BR35TqiW97IqNvCo/GqA==", "requires": { - "@babel/code-frame": "^7.10.1", - "@babel/parser": "^7.10.1", - "@babel/types": "^7.10.1" + "@babel/code-frame": "^7.10.3", + "@babel/parser": "^7.10.3", + "@babel/types": "^7.10.3" } }, "@babel/traverse": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.10.1.tgz", - "integrity": "sha512-C/cTuXeKt85K+p08jN6vMDz8vSV0vZcI0wmQ36o6mjbuo++kPMdpOYw23W2XH04dbRt9/nMEfA4W3eR21CD+TQ==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.10.3.tgz", + "integrity": "sha512-qO6623eBFhuPm0TmmrUFMT1FulCmsSeJuVGhiLodk2raUDFhhTECLd9E9jC4LBIWziqt4wgF6KuXE4d+Jz9yug==", "requires": { - "@babel/code-frame": "^7.10.1", - "@babel/generator": "^7.10.1", - "@babel/helper-function-name": "^7.10.1", + "@babel/code-frame": "^7.10.3", + "@babel/generator": "^7.10.3", + "@babel/helper-function-name": "^7.10.3", "@babel/helper-split-export-declaration": "^7.10.1", - "@babel/parser": "^7.10.1", - "@babel/types": "^7.10.1", + "@babel/parser": "^7.10.3", + "@babel/types": "^7.10.3", "debug": "^4.1.0", "globals": "^11.1.0", "lodash": "^4.17.13" } }, "@babel/types": { - "version": "7.10.2", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.10.2.tgz", - "integrity": "sha512-AD3AwWBSz0AWF0AkCN9VPiWrvldXq+/e3cHa4J89vo4ymjz1XwrBFFVZmkJTsQIPNk+ZVomPSXUJqq8yyjZsng==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.10.3.tgz", + "integrity": "sha512-nZxaJhBXBQ8HVoIcGsf9qWep3Oh3jCENK54V4mRF7qaJabVsAYdbTtmSD8WmAp1R6ytPiu5apMwSXyxB1WlaBA==", "requires": { - "@babel/helper-validator-identifier": "^7.10.1", + "@babel/helper-validator-identifier": "^7.10.3", "lodash": "^4.17.13", "to-fast-properties": "^2.0.0" } @@ -1237,9 +1237,9 @@ } }, "@types/babel__core": { - "version": "7.1.8", - "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.1.8.tgz", - "integrity": "sha512-KXBiQG2OXvaPWFPDS1rD8yV9vO0OuWIqAEqLsbfX0oU2REN5KuoMnZ1gClWcBhO5I3n6oTVAmrMufOvRqdmFTQ==", + "version": "7.1.9", + "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.1.9.tgz", + "integrity": "sha512-sY2RsIJ5rpER1u3/aQ8OFSI7qGIy8o1NEEbgb2UaJcvOtXOMpd39ko723NBpjQFg9SIX7TXtjejZVGeIMLhoOw==", "requires": { "@babel/parser": "^7.1.0", "@babel/types": "^7.0.0", @@ -1404,18 +1404,18 @@ }, "dependencies": { "@babel/core": { - "version": "7.10.2", - "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.10.2.tgz", - "integrity": "sha512-KQmV9yguEjQsXqyOUGKjS4+3K8/DlOCE2pZcq4augdQmtTy5iv5EHtmMSJ7V4c1BIPjuwtZYqYLCq9Ga+hGBRQ==", + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.10.3.tgz", + "integrity": "sha512-5YqWxYE3pyhIi84L84YcwjeEgS+fa7ZjK6IBVGTjDVfm64njkR2lfDhVR5OudLk8x2GK59YoSyVv+L/03k1q9w==", "requires": { - "@babel/code-frame": "^7.10.1", - "@babel/generator": "^7.10.2", + "@babel/code-frame": "^7.10.3", + "@babel/generator": "^7.10.3", "@babel/helper-module-transforms": "^7.10.1", "@babel/helpers": "^7.10.1", - "@babel/parser": "^7.10.2", - "@babel/template": "^7.10.1", - "@babel/traverse": "^7.10.1", - "@babel/types": "^7.10.2", + "@babel/parser": "^7.10.3", + "@babel/template": "^7.10.3", + "@babel/traverse": "^7.10.3", + "@babel/types": "^7.10.3", "convert-source-map": "^1.7.0", "debug": "^4.1.0", "gensync": "^1.0.0-beta.1", @@ -1610,9 +1610,9 @@ } }, "@bigcommerce/checkout-sdk": { - "version": "1.77.3", - "resolved": "https://registry.npmjs.org/@bigcommerce/checkout-sdk/-/checkout-sdk-1.77.3.tgz", - "integrity": "sha512-hPQ+hWq9NXwXxpWmGd/dU0V7PiW0ey4zgZwRIHYj1wPVweVjUpC7LETW8r3A9TMu68LUHjdxsk+Vchw4fBvnWA==", + "version": "1.78.0", + "resolved": "https://registry.npmjs.org/@bigcommerce/checkout-sdk/-/checkout-sdk-1.78.0.tgz", + "integrity": "sha512-mEirIwhSd5mk6r4+wyGhDmF239A3E4MzBQHN4bYoWaAeyjDVymzMGEQP96U9iYDD8qBGOwp3uJ7K4yVURUPR4g==", "requires": { "@babel/polyfill": "^7.4.4", "@bigcommerce/bigpay-client": "^5.7.0", @@ -1665,35 +1665,10 @@ } } }, - "@bigcommerce/script-loader": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/@bigcommerce/script-loader/-/script-loader-2.2.1.tgz", - "integrity": "sha512-FnZP0UZsju1A79qx30H6mj3pz/KB/pX/5y+DazVJXOAuyfQ+guuwJsCVBWA4aZ279w/l2eHdqoKMrymFDFew8w==", - "requires": { - "@bigcommerce/request-sender": "^0.3.0", - "tslib": "^1.10.0" - }, - "dependencies": { - "@bigcommerce/request-sender": { - "version": "0.3.0", - "resolved": "https://registry.npmjs.org/@bigcommerce/request-sender/-/request-sender-0.3.0.tgz", - "integrity": "sha512-qILGm+r6JqZ56kGtgxLq/eAHlQXZMxq64nA2mIB7uxp8RpgDupJrpnVKd7uSQSOoHemUsD6UM/sCYWbGprw2lg==", - "requires": { - "@types/js-cookie": "^2.1.0", - "@types/lodash": "^4.14.133", - "@types/query-string": "^5.1.0", - "js-cookie": "^2.1.4", - "lodash": "^4.17.11", - "query-string": "^5.0.0", - "tslib": "^1.8.0" - } - } - } - }, "@types/lodash": { - "version": "4.14.155", - "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.155.tgz", - "integrity": "sha512-vEcX7S7aPhsBCivxMwAANQburHBtfN9RdyXFk84IJmu2Z4Hkg1tOFgaslRiEqqvoLtbCBi6ika1EMspE+NZ9Lg==" + "version": "4.14.156", + "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.156.tgz", + "integrity": "sha512-l2AgHXcKUwx2DsvP19wtRPqZ4NkONjmorOdq4sMcxIjqdIuuV/ULo2ftuv4NUpevwfW7Ju/UKLqo0ZXuEt/8lQ==" }, "@types/yup": { "version": "0.26.37", @@ -3495,9 +3470,9 @@ }, "dependencies": { "@babel/helper-plugin-utils": { - "version": "7.10.1", - "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.1.tgz", - "integrity": "sha512-fvoGeXt0bJc7VMWZGCAEBEMo/HAjW2mP8apF5eXK0wSqwLAVHAISCWRoLMBMUs2kqeaG77jltVqu4Hn8Egl3nA==" + "version": "7.10.3", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.10.3.tgz", + "integrity": "sha512-j/+j8NAWUTxOtx4LKHybpSClxHoq6I91DQ/mKgAXn5oNUPIUiGppjPIX3TDtJWPrdfP9Kfl7e4fgVMiQR9VE/g==" }, "@babel/plugin-syntax-async-generators": { "version": "7.8.4", diff --git a/package.json b/package.json index 6ca3b5bdb7..51b803aa13 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ }, "homepage": "https://github.com/bigcommerce/checkout-js#readme", "dependencies": { - "@bigcommerce/checkout-sdk": "^1.77.3", + "@bigcommerce/checkout-sdk": "^1.78.0", "@bigcommerce/citadel": "^2.15.1", "@bigcommerce/form-poster": "^1.2.2", "@bigcommerce/memoize": "^1.0.0",