Merge branch 'develop' into PWA#3118

magento · May 24, 2023 · 55bf1fa · 55bf1fa
2 parents 1d89663 + 1fffeb6
commit 55bf1fa
Show file tree

Hide file tree

Showing 9 changed files with 50 additions and 39 deletions.
diff --git a/packages/pagebuilder/lib/__tests__/handleHtmlContentClick.spec.js b/packages/pagebuilder/lib/__tests__/handleHtmlContentClick.spec.js
@@ -24,29 +24,6 @@ test('does nothing when the target is not a link', () => {
 describe('when the target is a link', () => {
     const preventDefault = jest.fn();
 
-    test('uses the push() function in the history object if it is internal', () => {
-        const event = {
-            code: 'Enter',
-            target: {
-                origin: 'https://my-magento.store',
-                tagName: 'A',
-                pathname: '/checkout.html',
-                href: 'https://my-magento.store/checkout.html'
-            },
-            view: {
-                location: {
-                    origin: 'https://my-magento.store'
-                }
-            },
-            preventDefault: preventDefault
-        };
-
-        handleHtmlContentClick(mockHistory, event);
-
-        expect(preventDefault).toHaveBeenCalled();
-        expect(mockHistoryPush).toHaveBeenCalledWith(event.target.pathname);
-    });
-
     test('loads the new URL if it is external', () => {
         const mockAssign = jest.fn();
 
@@ -105,6 +82,6 @@ describe('when the target is a link', () => {
 
         expect(preventDefault).toHaveBeenCalled();
         expect(mockHistoryPush).not.toHaveBeenCalled();
-        expect(mockOpen).toHaveBeenCalledWith(event.target.href, '_blank');
+        expect(mockOpen).toHaveBeenCalledWith(event.target.href);
     });
 });
diff --git a/packages/pagebuilder/lib/handleHtmlContentClick.js b/packages/pagebuilder/lib/handleHtmlContentClick.js
@@ -16,23 +16,13 @@ const handleHtmlContentClick = (history, event) => {
     // destination is internal to avoid refreshing the page
     if (target.tagName === 'A' && shouldIntercept) {
         event.preventDefault();
-
-        const eventOrigin = event.view.location.origin;
-        const {
-            origin: linkOrigin,
-            pathname: path,
-            search: query,
-            target: tabTarget,
-            href
-        } = target;
+        const { search: query, target: tabTarget, href } = target;
 
         if (tabTarget && globalThis.open) {
-            globalThis.open(href, '_blank');
-        } else if (linkOrigin === eventOrigin) {
             if (query) {
-                history.push(path + query);
+                globalThis.open(href + query);
             } else {
-                history.push(path);
+                globalThis.open(href);
             }
         } else {
             globalThis.location.assign(href);

diff --git a/packages/peregrine/lib/talons/CartPage/GiftCards/__tests__/useGiftCards.spec.js b/packages/peregrine/lib/talons/CartPage/GiftCards/__tests__/useGiftCards.spec.js
@@ -121,6 +121,7 @@ test('it returns the proper shape', () => {
         errorLoadingGiftCards: expect.any(Boolean),
         errorRemovingCard: expect.any(Boolean),
         giftCardsData: expect.any(Array),
+        handleEnterKeyPress: expect.any(Function),
         isLoadingGiftCards: expect.any(Boolean),
         isApplyingCard: expect.any(Boolean),
         isCheckingBalance: expect.any(Boolean),

diff --git a/packages/peregrine/lib/talons/CartPage/GiftCards/useGiftCards.js b/packages/peregrine/lib/talons/CartPage/GiftCards/useGiftCards.js
@@ -156,6 +156,13 @@ export const useGiftCards = props => {
         removeCardLoading,
         setIsCartUpdating
     ]);
+    const handleEnterKeyPress = useCallback(() => {
+        event => {
+            if (event.key === 'Enter') {
+                applyGiftCard();
+            }
+        };
+    }, [applyGiftCard]);
 
     const shouldDisplayCardBalance =
         mostRecentAction === actions.CHECK_BALANCE &&
@@ -178,6 +185,7 @@ export const useGiftCards = props => {
             (appliedCardsResult.data &&
                 appliedCardsResult.data.cart.applied_gift_cards) ||
             [],
+        handleEnterKeyPress,
         isLoadingGiftCards: appliedCardsResult.loading,
         isApplyingCard: applyCardLoading,
         isCheckingBalance: balanceResult.loading,

diff --git a/packages/peregrine/lib/talons/CartPage/PriceAdjustments/CouponCode/useCouponCode.js b/packages/peregrine/lib/talons/CartPage/PriceAdjustments/CouponCode/useCouponCode.js
@@ -78,6 +78,13 @@ export const useCouponCode = props => {
         },
         [applyCoupon, cartId]
     );
+    const handleApplyCouponOnEnter = useCallback(() => {
+        event => {
+            if (event.key === 'Enter') {
+                handleApplyCoupon();
+            }
+        };
+    }, [handleApplyCoupon]);
 
     const handleRemoveCoupon = useCallback(
         async couponCode => {
@@ -95,6 +102,14 @@ export const useCouponCode = props => {
         [cartId, removeCoupon]
     );
 
+    const handleRemoveCouponOnEnter = useCallback(() => {
+        event => {
+            if (event.key === 'Enter') {
+                handleRemoveCoupon();
+            }
+        };
+    }, [handleRemoveCoupon]);
+
     useEffect(() => {
         if (applyCouponCalled || removeCouponCalled) {
             // If a coupon mutation is in flight, tell the cart.
@@ -124,7 +139,9 @@ export const useCouponCode = props => {
         data,
         errors,
         handleApplyCoupon,
+        handleApplyCouponOnEnter,
         handleRemoveCoupon,
+        handleRemoveCouponOnEnter,
         removingCoupon
     };
 };
@@ -167,6 +184,8 @@ export const useCouponCode = props => {
  * @property {String} errorMessage If GraphQL error occurs, this value is set.
  * @property {Object} fetchError The error data object returned by a GraphQL query.
  * @property {function} handleApplyCoupon Function to call for handling the application of a coupon code to a cart.
+ * @property {function} handleApplyCouponOnEnter Function to call for handling the application of a coupon code to a cart on enter key Press.
  * @property {function} handleRemoveCoupon Function to call for handling the removal of a coupon code from a cart
+ * @property {function} handleRemoveCouponOnEnter Function to call for handling the removal of a coupon code from a cart on enter key press.
  * @property {boolean} removingCoupon True if a coupon code is currently being removed. False otherwise.
  */
diff --git a/packages/peregrine/lib/talons/MagentoRoute/useMagentoRoute.js b/packages/peregrine/lib/talons/MagentoRoute/useMagentoRoute.js
@@ -48,6 +48,16 @@ export const useMagentoRoute = (props = {}) => {
     const { data, error, loading } = queryResult;
     const { route } = data || {};
 
+    // redirect to external url
+    useEffect(() => {
+        if (route) {
+            const external_URL = route.relative_url;
+            if (external_URL && external_URL.startsWith('http')) {
+                window.location.replace(external_URL);
+            }
+        }
+    }, [route]);
+
     useEffect(() => {
         if (initialized.current || !getInlinedPageData()) {
             runQuery({

diff --git a/...venia-ui/lib/components/CartPage/GiftCards/__tests__/__snapshots__/giftCards.spec.js.snap b/...venia-ui/lib/components/CartPage/GiftCards/__tests__/__snapshots__/giftCards.spec.js.snap
@@ -85,7 +85,6 @@ exports[`it renders correctly when it has cards 1`] = `
             disabled={false}
             onClick={[MockFunction]}
             onDragStart={[Function]}
-            onKeyDown={[Function]}
             onKeyUp={[Function]}
             onMouseDown={[Function]}
             onMouseEnter={[Function]}
@@ -337,7 +336,6 @@ exports[`it renders correctly with no cards 1`] = `
             disabled={false}
             onClick={[MockFunction]}
             onDragStart={[Function]}
-            onKeyDown={[Function]}
             onKeyUp={[Function]}
             onMouseDown={[Function]}
             onMouseEnter={[Function]}

diff --git a/packages/venia-ui/lib/components/CartPage/GiftCards/giftCards.js b/packages/venia-ui/lib/components/CartPage/GiftCards/giftCards.js
@@ -54,6 +54,7 @@ const GiftCards = props => {
         errorLoadingGiftCards,
         errorRemovingCard,
         giftCardsData,
+        handleEnterKeyPress,
         isLoadingGiftCards,
         isApplyingCard,
         isCheckingBalance,
@@ -198,6 +199,7 @@ const GiftCards = props => {
                     data-cy="GiftCards-apply"
                     disabled={isApplyingCard}
                     onClick={applyGiftCard}
+                    onKeyDown={handleEnterKeyPress}
                 >
                     <FormattedMessage
                         id={'giftCards.apply'}

diff --git a/packages/venia-ui/lib/components/CartPage/PriceAdjustments/CouponCode/couponCode.js b/packages/venia-ui/lib/components/CartPage/PriceAdjustments/CouponCode/couponCode.js
@@ -52,7 +52,9 @@ const CouponCode = props => {
         data,
         errors,
         handleApplyCoupon,
+        handleApplyCouponOnEnter,
         handleRemoveCoupon,
+        handleRemoveCouponOnEnter,
         removingCoupon
     } = talonProps;
     const { formatMessage } = useIntl();
@@ -102,6 +104,9 @@ const CouponCode = props => {
                         onClick={() => {
                             handleRemoveCoupon(code);
                         }}
+                        onKeyDown={() => {
+                            handleRemoveCouponOnEnter(code);
+                        }}
                     >
                         <FormattedMessage
                             id={'couponCode.removeButton'}
@@ -154,6 +159,7 @@ const CouponCode = props => {
                         disabled={applyingCoupon}
                         priority={'normal'}
                         type={'submit'}
+                        onKeyDown={handleApplyCouponOnEnter}
                     >
                         <FormattedMessage
                             id={'couponCode.apply'}