fix(storefront): STRF-12475 Use fetch when updating variants in cart

CHANGELOG.md

@@ -12,6 +12,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Fix GH build action & added package version and short commit hash to artifact names in GitHub Actions workflow for improved traceability and uniqueness. ([#2494](https://github.com/bigcommerce/cornerstone/pull/2494))
 - Bump stencil-utils to 6.18.0 ([#2493](https://github.com/bigcommerce/cornerstone/pull/2493))
 - Bump other GH actions to fix warnings related to old versions. ([#2495](https://github.com/bigcommerce/cornerstone/pull/2495))
+- Use fetch when updating variants in cart ([#2521](https://github.com/bigcommerce/cornerstone/pull/2521))
 
 ## 6.15.0 (10-18-2024)
 - Cornerstone changes to support inc/ex tax price lists on PDP [#2486](https://github.com/bigcommerce/cornerstone/pull/2486)

assets/js/theme/cart.js

@@ -19,6 +19,11 @@ export default class Cart extends PageManager {
             .hide(); // TODO: temporary until roper pulls in his cart components
         this.$activeCartItemId = null;
         this.$activeCartItemBtnAction = null;
+        this.$refreshBtn = $('#refresh-cart-test');
+
+        this.$refreshBtn.on('click', () => {
+            this.refreshContent();
+        });
 
         this.setApplePaySupport();
         this.bindEvents();
@@ -151,6 +156,18 @@ export default class Cart extends PageManager {
                 this.$modal.one(ModalEvents.opened, optionChangeHandler);
             }
 
+            const modalForm = this.$modal.find('form');
+            const refreshContent = () => this.refreshContent();
+            async function onSubmit(event) {
+                event.preventDefault();
+                utils.api.cart.updateCartItemOptions(new FormData(this), () => {
+                    modal.close();
+                    refreshContent();
+                });
+            }
+
+            modalForm.on('submit', onSubmit);
+
             this.productDetails = new CartItemDetails(this.$modal, context);
 
             this.bindGiftWrappingForm();