Have your say in Community Polls: What was/is your greatest motivation to start your own business?
Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

Rare behavior when adding a new item to cart.

Rare behavior when adding a new item to cart.

dduenas-acidlab
Shopify Partner
5 0 0

Hello, 

 

I'm having a strange behavior in the cart page when I add a product using javascript. The logic is simple, I need to apply a discount (Buy X and get Y) automatically.

For this to work, product Y needs to exist in the cart and a simple condition has to be true. (The shopping cart has to be equal or more than $500)

So, when my customer has $500 or more, my javascript adds the product Y to the cart using this logic:

 
            fetch("/cart/add.json", {
                method: "POST",
                headers: {
                    "Content-Type": "application/json",
                    "Accept": "application/json"
                },
                body: JSON.stringify({
                    id: productY_Id,
                    quantity: 1
                })
            })
            .then(function() {
                alert("Product added correctly.");
            }).catch(function(error) {
                console.log(error);
            });
 
It works perfectly.
The rare behaviour happens when the discount code is active. The cart creates a new line with all my products duplicating the contents of the cart. What could be happening?
 
Important info: 
- I don't apply the discount code in my logic, i only add the product Y.
- I'm adding screenshots of the issue.
- I'm using this configuration of discount code with Automatic method.
 
# screenshot 1 - normal
 
Captura de pantalla 2023-11-27 170706.jpg
 
# screenshot 2 - error
 
Captura de pantalla 2023-11-27 170643.jpg

Thank you so much for your time!

 

Replies 2 (2)

Liam
Community Manager
3108 344 891

Hi Dduenas,

I believe the behavior you're experiencing might be due to how Shopify handles automatic discounts. When an automatic discount is applied, Shopify creates a new line item for the discounted product. This is intended and is done to show the original and discounted price separately.

 

However, in your case, it seems like the entire cart is being duplicated. This could be due to a conflict with your script and how Shopify applies automatic discounts. You should ensure that your script is only adding the product Y to the cart once the cart total is $500 or more and make sure it's not being triggered multiple times.

 

 

Also you could test without the script and manually add products to the cart to reach the $500 threshold. Then, check to see if the cart is still being duplicated. If it's not, then the issue might be with your script.

 

Hope this helps! 

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

dduenas-acidlab
Shopify Partner
5 0 0

Hi Liam!,


Thanks for your response. 

I tried applying product Y and the discount manually and it works correctly.

The problem, as it seems, is in my JS 😬.

However, when I have the discount code disabled, my JS adds product Y correctly and my cart stays with the original items (no duplicity). This only happens when I have the discount code active. I am using exactly this code in my JS (https://shopify.dev/docs/api/ajax/reference/cart)

 

Captura de pantalla 2023-11-28 110809.png

 

* I also use product_id  (or product-id ) property in the product object. Still the same.

 

Maybe, there is a parameter in the line item properties that I'm forgetting..

 

 

Thank you very much again.