search

EvgeniyMukhamedjanov / liquid-ajax-cart

Build a Shopify Ajax-cart without JavaScript coding
https://liquid-ajax-cart.js.org
191 stars 22 forks source link

Ajax Cart Quantity Bug #74

Closed thagxt closed 10 months ago

thagxt commented 1 year ago

Description: While experimenting with the ajax cart functionality, I identified a bug related to product quantity handling. Here's a breakdown:

  1. When attempting to add a quantity of products larger than what's available, the system:

    • Adds the available products to the cart.
    • Fails to update both the "drawer" and the "cart bubble".
    • Subsequently, an error is thrown.

  2. If I then try to reduce the product quantity, the system indicates that the specified number of products is already in the cart. However, the "drawer" and "cart bubble" only reflect the correct quantity after a page refresh.

https://github.com/EvgeniyMukhamedjanov/liquid-ajax-cart/assets/7128602/5643c7f2-7b81-4354-9c07-6c7d94d5add9

EvgeniyMukhamedjanov commented 1 year ago

@thagxt Thank you that you noticed it. I guess Shopify changed their Cart API again. It didn't add anything to the cart if an error happens, now this behavior changed... I'll try to release a new version with the bug fixed after the weekend. Thank you!

EvgeniyMukhamedjanov commented 1 year ago

Actually it looks like a bug on the Shopify side. When you send an Ajax request that returns an error, it shouldn't add anything to the cart, but it does.

image

Don't you have any insight on it, maybe you see an issue in the Shopify Github repository about it? I'm trying to find any information on if they are going to fix it or it will stay like this so I should fix Liquid Ajax Cart on my side.

EvgeniyMukhamedjanov commented 1 year ago

The thing is, this bug exists in the Dawn theme as well. Looks like they aren't aware of this bug.

EvgeniyMukhamedjanov commented 1 year ago

@thagxt I've also asked the question in the shopify community: https://community.shopify.com/c/technical-q-a/cart-api-add-js-wrong-behavior/m-p/2227468 Hoping that maybe we've got an official response from Shopify support (even though it is rarely happens lol).

thagxt commented 1 year ago

Yes, it is an API issue. I reported it on Slack, and another dev who encountered the same problem in August suggested to open an issue on Dawn's repo, since this may be the only way for this to reach the right people at Shopify and get fixed hopefully. Let me know if you want to open it I'll upvote, if not I'll do.

EvgeniyMukhamedjanov commented 1 year ago

Can you open it pls, I'll upvote a bit later.

If you use Liquid ajax Cart on production and this bug makes troubles for your case, let me know, I'll provide a script that will refresh the cart after product "add to cart" error. It will be just a few lines of code that use liquid ajax cart api.

thagxt commented 1 year ago

Thank you @EvgeniyMukhamedjanov ! I'm not using it currently, but I'm considering migrating from cartjs.org and was exploring alternatives to it and to the Dawn approach.

I've created the issue Here

EvgeniyMukhamedjanov commented 1 year ago

I see. So basically the difference of Liquid Ajax Cart from cartjs is that cartjs uses shopify cart json response as data for the ajax cart, liquid ajax cart uses bundle section rendering, so you can use liquid objects as data for your ajax cart. Let me know if you have any questions.

liquid ajax cart approach is somehow like Dawn's approach, but you can't take dawn's code and copy paste to your theme, as it is tied to classnames, specific functionality etc :-)

thagxt commented 1 year ago

Yes, I know... currently working on stripping Dawn down to keep only the things I need and hasn't been a fun process so far haha. However, I was interested in removing jQuery (cartjs.org) from an older project, and based on what you've said, your method appears to be the more appropriate one here. Thank you for your insight!

thagxt commented 1 year ago

Question:

Could you provide a compiled/minified version of the liquid-ajax-cart.js suitable for CDN use for instance? The current version outputted by webpack is very "ugly", and since I'm not well-versed in webpack and don't intend to use it, it would be great to have a straightforward method to just "plug-n-play" the cart JS into any theme without having to do the whole process and end up with a file like this :) thank you

EvgeniyMukhamedjanov commented 1 year ago

@thagxt Sure, you can download the file here: https://liquid-ajax-cart.js.org/v2/releases/ or here, if you want to use the version 1: https://liquid-ajax-cart.js.org/v1/releases/

EvgeniyMukhamedjanov commented 10 months ago

@thagxt It seems like the issue is fixed by Shopify? I don't see the wrong behavior anymore of the change.js/add.js requests.

UPD: so strange, worked yesterday, but doesn't work now...

UPD2: works differently on different stores. If you could test on yours, would be good.

thagxt commented 10 months ago

I think Shopify fixed the problem, it is working as expected for me on the stores I've tested it on. 👍