Merge pull request #6233 from vuestorefront/#6226-cart-customer-canno…

…t-insert-multi-digit-quantity-into-input

fix(core): add debounce for updateCartQuantity

packages/core/docs/changelog/6226.js

@@ -0,0 +1,8 @@
+module.exports = {
+  description: 'Fix quantity input being immediately disabled after inserting single digit',
+  link: 'https://github.com/vuestorefront/vue-storefront/issues/6226',
+  isBreaking: false,
+  breakingChanges: [],
+  author: 'Igor Wojciechowski',
+  linkToGitHubAccount: 'https://github.com/igorwojciechowski'
+};

packages/core/nuxt-theme-module/theme/components/CartSidebar.vue

@@ -47,7 +47,7 @@
                       :disabled="loading"
                       :qty="cartGetters.getItemQty(product)"
                       class="sf-collected-product__quantity-selector"
-                      @input="updateItemQty({ product, quantity: $event })"
+                      @input="updateQuantity({ product, quantity: $event })"
                     />
                   </div>
                 </template>
@@ -123,6 +123,7 @@ import {
 import { computed } from '@vue/composition-api';
 import { useCart, useUser, cartGetters } from '<%= options.generate.replace.composables %>';
 import { useUiState } from '~/composables';
+import debounce from 'lodash.debounce';
 
 export default {
   name: 'Cart',
@@ -146,12 +147,16 @@ export default {
     const totalItems = computed(() => cartGetters.getTotalItems(cart.value));
     loadCart();
 
+    const updateQuantity = debounce(async ({ product, quantity }) => {
+      await updateItemQty({ product, quantity });
+    }, 500);
+
     return {
+      updateQuantity,
       loading,
       isAuthenticated,
       products,
       removeItem,
-      updateItemQty,
       isCartSidebarOpen,
       toggleCartSidebar,
       totals,