Update qty #1338
Update qty #1338
Conversation
|
Autotagging @bigcommerce/storefront-team @davidchin |
| @@ -110,6 +110,9 @@ <h4 class="cart-item-name"><a href="{{url}}">{{name}}</a></h4> | |||
| data-quantity-max-error="{{lang 'products.quantity_max' quantity=max_purchase_quantity}}" | |||
| min="1" | |||
| pattern="[0-9]*" | |||
| data-cart-itemid="{{id}}" | |||
There was a problem hiding this comment.
why do we have this twice ?
assets/js/theme/cart.js
Outdated
| const itemId = $target.data('cartItemid'); | ||
| const $el = $(`#qty-${itemId}`); | ||
| const oldQty = parseInt($el.val(), 10); | ||
| const oldQty = preVal !== null ? preVal : parseInt($el.val(), 10); |
There was a problem hiding this comment.
shouldn't we be running parseInt on preVal as well ?
assets/js/theme/cart.js
Outdated
| const maxQty = parseInt($el.data('quantityMax'), 10); | ||
| const minQty = parseInt($el.data('quantityMin'), 10); | ||
| const minError = $el.data('quantityMinError'); | ||
| const maxError = $el.data('quantityMaxError'); | ||
| const newQty = $target.data('action') === 'inc' ? oldQty + 1 : oldQty - 1; | ||
| let qty = null; |
There was a problem hiding this comment.
why not initialize the qty value with the default value.
assets/js/theme/cart.js
Outdated
| text: "Not a valid entry", | ||
| type: 'error', | ||
| }); | ||
| } else if(newQty < minQty) { |
There was a problem hiding this comment.
@junedkazi I changed that to display error if there is an invalid input, however that will change the current logic that fallback in case of invalid input to the min min_purchase_quantity. If we choose to keep it, I would like to write a test for this case
There was a problem hiding this comment.
I like this logic because I (and users) can now enter trash into the quantity field. Maybe the text should be "Not a valid number?" Because other errors will show up in the case of out of stock.
|
@Ubersmake can we test this PR before we merge it. |
|
@junedkazi @bc-zoharmuzafi Taking a look. |
|
There are a lot of corner cases here. Using the current arrow-only behavior for comparison:
With the addition of the item quantity feature:
|
|
💚 |
Fix eslint warning in cart.js focus event from #1338
What?
Currently if user change manually (write a number) the qty of item, the cart is not updated and the only way to update the qty it is using the inc and dec arrows. This change added "focusout" event on the qty field, which allow the user to change manually the number of the qty., and the cart will be updated once focus leaves the field.
Test