From 71e0d8bf48351d5c99c3f6a5ca56e6f4787714fc Mon Sep 17 00:00:00 2001 From: Daniel Kift Date: Tue, 23 Dec 2025 14:35:40 +0000 Subject: [PATCH 1/2] rename onError to onFail for consistency --- .../src/components/Checkout.tsx | 12 +-- .../tests/CheckoutError.test.tsx | 74 +++++++++---------- 2 files changed, 43 insertions(+), 43 deletions(-) diff --git a/modules/@shopify/checkout-sheet-kit/src/components/Checkout.tsx b/modules/@shopify/checkout-sheet-kit/src/components/Checkout.tsx index 4f75016a..cef03ad6 100644 --- a/modules/@shopify/checkout-sheet-kit/src/components/Checkout.tsx +++ b/modules/@shopify/checkout-sheet-kit/src/components/Checkout.tsx @@ -63,7 +63,7 @@ export interface ShopifyCheckoutProps { /** * Called when checkout fails */ - onError?: (error: CheckoutException) => void; + onFail?: (error: CheckoutException) => void; /** * Called when checkout is completed successfully @@ -161,7 +161,7 @@ const RCTCheckoutWebView = * console.log('Checkout completed!', event.orderDetails)} - * onError={(error) => console.error('Checkout failed:', error.message)} + * onFail={(error) => console.error('Checkout failed:', error.message)} * style={{flex: 1}} * /> * @@ -182,7 +182,7 @@ const RCTCheckoutWebView = * ref={checkoutRef} * checkoutUrl={url} * auth={authToken} - * onError={() => { + * onFail={() => { * // Reload on error * checkoutRef.current?.reload(); * }} @@ -197,7 +197,7 @@ export const ShopifyCheckout = forwardRef< checkoutUrl, auth, onStart, - onError, + onFail, onComplete, onCancel, onLinkClick, @@ -236,9 +236,9 @@ export const ShopifyCheckout = forwardRef< >( event => { const transformedError = parseCheckoutError(event.nativeEvent); - onError?.(transformedError); + onFail?.(transformedError); }, - [onError], + [onFail], ); const handleComplete = useCallback< diff --git a/modules/@shopify/checkout-sheet-kit/tests/CheckoutError.test.tsx b/modules/@shopify/checkout-sheet-kit/tests/CheckoutError.test.tsx index aa7ef4e7..dcd40696 100644 --- a/modules/@shopify/checkout-sheet-kit/tests/CheckoutError.test.tsx +++ b/modules/@shopify/checkout-sheet-kit/tests/CheckoutError.test.tsx @@ -38,12 +38,12 @@ describe('Checkout Component - Error Events', () => { describe('error transformation', () => { it('transforms native error to ConfigurationError class', () => { - const onError = jest.fn(); + const onFail = jest.fn(); const {getByTestId} = render( , ); @@ -61,9 +61,9 @@ describe('Checkout Component - Error Events', () => { }); }); - expect(onError).toHaveBeenCalledTimes(1); + expect(onFail).toHaveBeenCalledTimes(1); - const receivedError = onError.mock.calls[0][0]; + const receivedError = onFail.mock.calls[0][0]; expect(receivedError).toBeInstanceOf(ConfigurationError); expect(receivedError.code).toBe( CheckoutErrorCode.storefrontPasswordRequired, @@ -75,12 +75,12 @@ describe('Checkout Component - Error Events', () => { }); it('transforms native error to CheckoutClientError class', () => { - const onError = jest.fn(); + const onFail = jest.fn(); const {getByTestId} = render( , ); @@ -98,9 +98,9 @@ describe('Checkout Component - Error Events', () => { }); }); - expect(onError).toHaveBeenCalledTimes(1); + expect(onFail).toHaveBeenCalledTimes(1); - const receivedError = onError.mock.calls[0][0]; + const receivedError = onFail.mock.calls[0][0]; expect(receivedError).toBeInstanceOf(CheckoutClientError); // KILLSWITCH_ENABLED is now in the enum expect(receivedError.code).toBe(CheckoutErrorCode.killswitchEnabled); @@ -108,12 +108,12 @@ describe('Checkout Component - Error Events', () => { }); it('transforms native error to CheckoutExpiredError class', () => { - const onError = jest.fn(); + const onFail = jest.fn(); const {getByTestId} = render( , ); @@ -131,9 +131,9 @@ describe('Checkout Component - Error Events', () => { }); }); - expect(onError).toHaveBeenCalledTimes(1); + expect(onFail).toHaveBeenCalledTimes(1); - const receivedError = onError.mock.calls[0][0]; + const receivedError = onFail.mock.calls[0][0]; expect(receivedError).toBeInstanceOf(CheckoutExpiredError); expect(receivedError.code).toBe(CheckoutErrorCode.cartCompleted); expect(receivedError.message).toBe('Cart already completed'); @@ -158,12 +158,12 @@ describe('Checkout Component - Error Events', () => { ])( 'maps native code $nativeCode to CheckoutErrorCode enum', ({nativeCode, expectedCode}) => { - const onError = jest.fn(); + const onFail = jest.fn(); const {getByTestId} = render( , ); @@ -181,13 +181,13 @@ describe('Checkout Component - Error Events', () => { }); }); - const receivedError = onError.mock.calls[0][0]; + const receivedError = onFail.mock.calls[0][0]; expect(receivedError.code).toBe(expectedCode); }, ); }); - it('does not crash when onError prop is not provided', () => { + it('does not crash when onFail prop is not provided', () => { const {getByTestId} = render( , ); @@ -210,12 +210,12 @@ describe('Checkout Component - Error Events', () => { describe('error object structure', () => { it('ConfigurationError has correct properties', () => { - const onError = jest.fn(); + const onFail = jest.fn(); const {getByTestId} = render( , ); @@ -233,7 +233,7 @@ describe('Checkout Component - Error Events', () => { }); }); - const error = onError.mock.calls[0][0]; + const error = onFail.mock.calls[0][0]; expect(error).toBeInstanceOf(ConfigurationError); expect(error).toMatchObject({ @@ -247,12 +247,12 @@ describe('Checkout Component - Error Events', () => { }); it('CheckoutClientError has correct properties', () => { - const onError = jest.fn(); + const onFail = jest.fn(); const {getByTestId} = render( , ); @@ -270,7 +270,7 @@ describe('Checkout Component - Error Events', () => { }); }); - const error = onError.mock.calls[0][0]; + const error = onFail.mock.calls[0][0]; expect(error).toBeInstanceOf(CheckoutClientError); expect(error).toMatchObject({ @@ -284,12 +284,12 @@ describe('Checkout Component - Error Events', () => { }); it('CheckoutExpiredError has correct properties', () => { - const onError = jest.fn(); + const onFail = jest.fn(); const {getByTestId} = render( , ); @@ -307,7 +307,7 @@ describe('Checkout Component - Error Events', () => { }); }); - const error = onError.mock.calls[0][0]; + const error = onFail.mock.calls[0][0]; expect(error).toBeInstanceOf(CheckoutExpiredError); expect(error).toMatchObject({ @@ -321,12 +321,12 @@ describe('Checkout Component - Error Events', () => { }); it('CheckoutHTTPError has correct properties including statusCode', () => { - const onError = jest.fn(); + const onFail = jest.fn(); const {getByTestId} = render( , ); @@ -345,7 +345,7 @@ describe('Checkout Component - Error Events', () => { }); }); - const error = onError.mock.calls[0][0]; + const error = onFail.mock.calls[0][0]; expect(error).toBeInstanceOf(CheckoutHTTPError); expect(error).toMatchObject({ @@ -359,12 +359,12 @@ describe('Checkout Component - Error Events', () => { }); it('InternalError has correct properties', () => { - const onError = jest.fn(); + const onFail = jest.fn(); const {getByTestId} = render( , ); @@ -382,7 +382,7 @@ describe('Checkout Component - Error Events', () => { }); }); - const error = onError.mock.calls[0][0]; + const error = onFail.mock.calls[0][0]; expect(error).toBeInstanceOf(InternalError); expect(error).toMatchObject({ @@ -395,12 +395,12 @@ describe('Checkout Component - Error Events', () => { }); it('GenericError is returned for unknown __typename', () => { - const onError = jest.fn(); + const onFail = jest.fn(); const {getByTestId} = render( , ); @@ -418,7 +418,7 @@ describe('Checkout Component - Error Events', () => { }); }); - const error = onError.mock.calls[0][0]; + const error = onFail.mock.calls[0][0]; expect(error).toBeInstanceOf(GenericError); expect(error).toMatchObject({ @@ -431,12 +431,12 @@ describe('Checkout Component - Error Events', () => { }); it('GenericError preserves statusCode when provided', () => { - const onError = jest.fn(); + const onFail = jest.fn(); const {getByTestId} = render( , ); @@ -455,7 +455,7 @@ describe('Checkout Component - Error Events', () => { }); }); - const error = onError.mock.calls[0][0]; + const error = onFail.mock.calls[0][0]; expect(error).toBeInstanceOf(GenericError); expect(error).toMatchObject({ From a106f3f6b4fcc4fbf5282e239162bb0bac1a5397 Mon Sep 17 00:00:00 2001 From: Kieran Osgood Date: Mon, 5 Jan 2026 13:51:32 +0000 Subject: [PATCH 2/2] refactor: include full chain in onError -> onFail rename --- .../checkoutsheetkit/CheckoutEventType.java | 2 +- .../checkoutsheetkit/RCTCheckoutWebView.java | 2 +- .../RCTCheckoutWebViewManagerTest.java | 2 +- .../ios/RCTCheckoutWebView.swift | 6 ++--- .../ios/ShopifyCheckoutSheetKit.mm | 2 +- .../src/components/Checkout.tsx | 6 ++--- .../tests/CheckoutError.test.tsx | 24 +++++++++---------- sample/src/screens/BuyNow/CheckoutScreen.tsx | 6 ++--- 8 files changed, 25 insertions(+), 25 deletions(-) diff --git a/modules/@shopify/checkout-sheet-kit/android/src/main/java/com/shopify/reactnative/checkoutsheetkit/CheckoutEventType.java b/modules/@shopify/checkout-sheet-kit/android/src/main/java/com/shopify/reactnative/checkoutsheetkit/CheckoutEventType.java index 91b7cecc..33844840 100644 --- a/modules/@shopify/checkout-sheet-kit/android/src/main/java/com/shopify/reactnative/checkoutsheetkit/CheckoutEventType.java +++ b/modules/@shopify/checkout-sheet-kit/android/src/main/java/com/shopify/reactnative/checkoutsheetkit/CheckoutEventType.java @@ -39,7 +39,7 @@ of this software and associated documentation files (the "Software"), to deal */ public enum CheckoutEventType { ON_START("onStart"), - ON_ERROR("onError"), + ON_FAIL("onFail"), ON_COMPLETE("onComplete"), ON_CANCEL("onCancel"), ON_LINK_CLICK("onLinkClick"), diff --git a/modules/@shopify/checkout-sheet-kit/android/src/main/java/com/shopify/reactnative/checkoutsheetkit/RCTCheckoutWebView.java b/modules/@shopify/checkout-sheet-kit/android/src/main/java/com/shopify/reactnative/checkoutsheetkit/RCTCheckoutWebView.java index 066da8f6..2c006ac2 100644 --- a/modules/@shopify/checkout-sheet-kit/android/src/main/java/com/shopify/reactnative/checkoutsheetkit/RCTCheckoutWebView.java +++ b/modules/@shopify/checkout-sheet-kit/android/src/main/java/com/shopify/reactnative/checkoutsheetkit/RCTCheckoutWebView.java @@ -322,7 +322,7 @@ public void onComplete(@NonNull CheckoutCompleteEvent event) { @Override public void onFail(@NonNull CheckoutException error) { - sendEvent(CheckoutEventType.ON_ERROR, buildErrorMap(error)); + sendEvent(CheckoutEventType.ON_FAIL, buildErrorMap(error)); } @Override diff --git a/modules/@shopify/checkout-sheet-kit/android/src/test/java/com/shopify/reactnative/checkoutsheetkit/RCTCheckoutWebViewManagerTest.java b/modules/@shopify/checkout-sheet-kit/android/src/test/java/com/shopify/reactnative/checkoutsheetkit/RCTCheckoutWebViewManagerTest.java index 1ac8a7f5..f22b28b2 100644 --- a/modules/@shopify/checkout-sheet-kit/android/src/test/java/com/shopify/reactnative/checkoutsheetkit/RCTCheckoutWebViewManagerTest.java +++ b/modules/@shopify/checkout-sheet-kit/android/src/test/java/com/shopify/reactnative/checkoutsheetkit/RCTCheckoutWebViewManagerTest.java @@ -217,7 +217,7 @@ public void testGetExportedCustomDirectEventTypeConstants_includesAllEventTypes( .containsKeys( "onStart", "onComplete", - "onError", + "onFail", "onCancel", "onLinkClick", "onAddressChangeStart", diff --git a/modules/@shopify/checkout-sheet-kit/ios/RCTCheckoutWebView.swift b/modules/@shopify/checkout-sheet-kit/ios/RCTCheckoutWebView.swift index 7bf7c910..f1751697 100644 --- a/modules/@shopify/checkout-sheet-kit/ios/RCTCheckoutWebView.swift +++ b/modules/@shopify/checkout-sheet-kit/ios/RCTCheckoutWebView.swift @@ -87,7 +87,7 @@ class RCTCheckoutWebView: UIView { } @objc var onStart: RCTBubblingEventBlock? - @objc var onError: RCTBubblingEventBlock? + @objc var onFail: RCTBubblingEventBlock? @objc var onComplete: RCTBubblingEventBlock? @objc var onCancel: RCTBubblingEventBlock? @objc var onLinkClick: RCTBubblingEventBlock? @@ -246,7 +246,7 @@ class RCTCheckoutWebView: UIView { errorCode = "UNKNOWN_ERROR" } - onError?([ + onFail?([ "error": errorMessage, "eventId": id, "code": errorCode @@ -276,7 +276,7 @@ extension RCTCheckoutWebView: CheckoutDelegate { } func checkoutDidFail(error: ShopifyCheckoutSheetKit.CheckoutError) { - onError?(ShopifyEventSerialization.serialize(checkoutError: error)) + onFail?(ShopifyEventSerialization.serialize(checkoutError: error)) } func checkoutDidClickLink(url: URL) { diff --git a/modules/@shopify/checkout-sheet-kit/ios/ShopifyCheckoutSheetKit.mm b/modules/@shopify/checkout-sheet-kit/ios/ShopifyCheckoutSheetKit.mm index 8d42bea2..861c680e 100644 --- a/modules/@shopify/checkout-sheet-kit/ios/ShopifyCheckoutSheetKit.mm +++ b/modules/@shopify/checkout-sheet-kit/ios/ShopifyCheckoutSheetKit.mm @@ -106,7 +106,7 @@ @interface RCT_EXTERN_MODULE (RCTCheckoutWebViewManager, RCTViewManager) /** * Emitted when checkout fails */ - RCT_EXPORT_VIEW_PROPERTY(onError, RCTDirectEventBlock) + RCT_EXPORT_VIEW_PROPERTY(onFail, RCTBubblingEventBlock) /** * Emitted when checkout completes successfully diff --git a/modules/@shopify/checkout-sheet-kit/src/components/Checkout.tsx b/modules/@shopify/checkout-sheet-kit/src/components/Checkout.tsx index cef03ad6..f7da2fa8 100644 --- a/modules/@shopify/checkout-sheet-kit/src/components/Checkout.tsx +++ b/modules/@shopify/checkout-sheet-kit/src/components/Checkout.tsx @@ -129,7 +129,7 @@ interface NativeShopifyCheckoutWebViewProps { style?: ViewStyle; testID?: string; onStart?: (event: {nativeEvent: CheckoutStartEvent}) => void; - onError?: (event: {nativeEvent: CheckoutNativeError}) => void; + onFail?: (event: {nativeEvent: CheckoutNativeError}) => void; onComplete?: (event: {nativeEvent: CheckoutCompleteEvent}) => void; onCancel?: () => void; onLinkClick?: (event: {nativeEvent: {url: string}}) => void; @@ -232,7 +232,7 @@ export const ShopifyCheckout = forwardRef< ); const handleError = useCallback< - Required['onError'] + Required['onFail'] >( event => { const transformedError = parseCheckoutError(event.nativeEvent); @@ -322,7 +322,7 @@ export const ShopifyCheckout = forwardRef< style={style} testID={testID} onStart={handleStart} - onError={handleError} + onFail={handleError} onComplete={handleComplete} onCancel={handleCancel} onLinkClick={handleLinkClick} diff --git a/modules/@shopify/checkout-sheet-kit/tests/CheckoutError.test.tsx b/modules/@shopify/checkout-sheet-kit/tests/CheckoutError.test.tsx index dcd40696..8737e4b0 100644 --- a/modules/@shopify/checkout-sheet-kit/tests/CheckoutError.test.tsx +++ b/modules/@shopify/checkout-sheet-kit/tests/CheckoutError.test.tsx @@ -51,7 +51,7 @@ describe('Checkout Component - Error Events', () => { const nativeComponent = getByTestId('checkout-webview'); act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'ConfigurationError', code: 'STOREFRONT_PASSWORD_REQUIRED', @@ -88,7 +88,7 @@ describe('Checkout Component - Error Events', () => { const nativeComponent = getByTestId('checkout-webview'); act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'CheckoutClientError', code: 'KILLSWITCH_ENABLED', @@ -121,7 +121,7 @@ describe('Checkout Component - Error Events', () => { const nativeComponent = getByTestId('checkout-webview'); act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'CheckoutExpiredError', code: 'CART_COMPLETED', @@ -171,7 +171,7 @@ describe('Checkout Component - Error Events', () => { const nativeComponent = getByTestId('checkout-webview'); act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'ConfigurationError', code: nativeCode, @@ -196,7 +196,7 @@ describe('Checkout Component - Error Events', () => { expect(() => { act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'ConfigurationError', code: 'STOREFRONT_PASSWORD_REQUIRED', @@ -223,7 +223,7 @@ describe('Checkout Component - Error Events', () => { const nativeComponent = getByTestId('checkout-webview'); act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'ConfigurationError', code: 'INVALID_PAYLOAD', @@ -260,7 +260,7 @@ describe('Checkout Component - Error Events', () => { const nativeComponent = getByTestId('checkout-webview'); act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'CheckoutClientError', code: 'UNRECOVERABLE_FAILURE', @@ -297,7 +297,7 @@ describe('Checkout Component - Error Events', () => { const nativeComponent = getByTestId('checkout-webview'); act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'CheckoutExpiredError', code: 'INVALID_CART', @@ -334,7 +334,7 @@ describe('Checkout Component - Error Events', () => { const nativeComponent = getByTestId('checkout-webview'); act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'CheckoutHTTPError', code: 'http_error', @@ -372,7 +372,7 @@ describe('Checkout Component - Error Events', () => { const nativeComponent = getByTestId('checkout-webview'); act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'InternalError', code: 'error_sending_message', @@ -408,7 +408,7 @@ describe('Checkout Component - Error Events', () => { const nativeComponent = getByTestId('checkout-webview'); act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'SomeUnknownErrorType', code: 'some_unknown_code', @@ -444,7 +444,7 @@ describe('Checkout Component - Error Events', () => { const nativeComponent = getByTestId('checkout-webview'); act(() => { - nativeComponent.props.onError({ + nativeComponent.props.onFail({ nativeEvent: { __typename: 'UnknownError', code: 'unknown', diff --git a/sample/src/screens/BuyNow/CheckoutScreen.tsx b/sample/src/screens/BuyNow/CheckoutScreen.tsx index 6d7ab96d..a6a9b14d 100644 --- a/sample/src/screens/BuyNow/CheckoutScreen.tsx +++ b/sample/src/screens/BuyNow/CheckoutScreen.tsx @@ -96,8 +96,8 @@ export default function CheckoutScreen(props: { navigation.getParent()?.goBack(); }; - const onError = (error: unknown) => { - console.log(' onError: ', error); + const onFail = (error: unknown) => { + console.log(' onFail: ', error); ref.current?.reload(); }; @@ -117,7 +117,7 @@ export default function CheckoutScreen(props: { onPaymentMethodChangeStart={onPaymentMethodChangeStart} onSubmitStart={onSubmitStart} onCancel={onCancel} - onError={onError} + onFail={onFail} onComplete={onComplete} /> );