Line item key changing if add/update/delete multiple products at same request with CART API

[MISEASD]

I've observed an issue with the unique key value of cart line items when manipulating multiple products in a single request using Shopify's CART API. Tested on multiple stores and same behavior. Here's how you can replicate this behavior (see pictures):

1. Begin by clearing the shopping cart.
2. Add two products using the add.js script.
3. Then, either add or update these two products again, using either add.js or update.js.

During this process, I noticed that the unique key value for each line item changes after the second request. However, after second request, the line item key remains consistent in all subsequent requests.

Docs:

https://shopify.dev/docs/api/liquid/objects/line_item#line_item-key

https://shopify.dev/docs/api/ajax/reference/cart

I'm uncertain about the duration of this issue, but I recall that around six months ago, the unique key values for line items remained consistent across all requests.

Here's code snippet for testing:

let formData = {
    "items": [
        {
            "id": PLACE_VARIANT_ID_1,
            "quantity": 1,
        },
        {
            "id": PLACE_VARIANT_ID_2,
            "quantity": 1,
        },
    ]
}

fetch(window.Shopify.routes.root + 'cart/add.js', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(formData)
}).then(response => {
  return response.json();
}).then(data => {
  data.items.forEach(obj => console.log(obj.key));
})

[ldrsousa]

I have the same issue in my stores. I need to update the quantity on some products when customers update the quantity on others, and this issue is affecting the first quantity change, as the item key becomes different. In the subsequent changes it works fine, but the quantities are not synced anymore because the first change returns different item keys and it needs to update the other product quantity correctly to everything works fine.

[rhatton]

I have exactly the same issue. Adding a product to the cart using the cart.js api. 

Then trying to remove the item from the cart by clicking the link generated by the {{item.url_to_remove}} results in a Shopify error:

'no valid id or line parameter'

If I refresh the cart page, the key (and generated remove link) then changes, and I'm able to remove the item from the cart. I'm not sure why this would be as the docs state that the key is a hashed version of the properties, which are always blank in my case. 

Must be a Shopify bug.

[JackL]

I'm experiencing an issue with line item keys in Shopify. The key seems to be changing based on whether a discount is applied to the line item or not.

Here's what I'm observing:

• A line item has a specific key (e.g., 123456).
• If I reduce the quantity until the discount is removed, the key changes to a different value (e.g., 654321).
• Conversely, if I increase the quantity to trigger a discount again, the key reverts back to the original value.

In essence, the line item key keeps switching back and forth depending on the presence or absence of a discount.
I would appreciate it if Shopify could investigate this behavior and consider potential solutions for ensuring consistent line item keys across discount scenarios.

[abhishektaparia]

Facing similar issue:
1. Trying to update `attributes` in the cart with `update.js` api.

2. Key of the items present in the cart changes.
3. Because of this when I try to remove item from cart with `change.js`, it gives 400 with message `no valid id or line parameter`.
4. Once I refresh and then try to remove item from cart, it works.

[Darren8]

Same issue here.  The item.key changes on existing products in the cart for me anytime a new product is added.   As these keys are used to manage connections between products in the cart this is causing issues.   Hopefully someone from Shopify can confirm if this is expected behaviour as it appears it wasn't in the past.

[KaustuvDhungana]

Hi guys,

I had reached out to the Shopify Support and they have now fixed the issue. Could you guys please check and confirm?

[PrasidKayastha]

Yes, the issue has been solved now. Thanks 👍

[rajibmk]

Thank you. 

[smilenaren]

Good job 🤝 @KaustuvDhungana 

[preejal]

🙏

[vivekcojha]

Thank you 👏

[MISEASD]

Yap, now its working

How did you managed to contact Shopify Support?

[KaustuvDhungana]

You can send your queries here -- https://help.shopify.com/en/support/partners/

They are very responsive.

[Darren8]

Thanks KaustuvDhungana,

Key seems to stay the same when other products are added or removed from the cart but I'm seeing the key change when the quantity of the item is increased/decreased.  Does anyone know if this expected behaviour?  The item key changing seems to limit it's usefulness.

Thanks,

Darren

[KaustuvDhungana]

Hi Darren,

I just checked a couple of my stores and the keys seem to be consistent even when the quantity is updated. Could you please check again or provide me your store url so that I can check once.

Thank you.

- Kaustuv

[williamwong]

Hi, I'm finding that I'm running into this same issue again.

The line item key seems to be changing in unexpected ways, leading to a few undesired effects:

1. Add an item that already exists in the cart using `/cart/add.js` will lead to a second, separate line item being added, rather than being merged with the existing line item and just increasing the quantity, if there's side cart/drawer component that displays the cart immediately after adding to cart.
   • This is at odds with what the Add to Cart API docs states: "If an added item was already in the cart, then the quantity is equal to the new quantity for that c...
   • Presumably this is because the line item key differs from the existing line item in the cart? So it's getting split into its own line item?
   • However, if you refresh the page, the updated cart re-combines the line items into a single line properly.
2. After an item is added to the cart, if we try to update the quantity using `cart/change.js` throws returns a 400 error with message `no valid id or line parameter`, as someone has described above already.
   • However, once again if the page is refreshed then the item key gets re-generated and everything works again.

Because a page refresh fixes things, we only really see this if a theme has a side cart or cart drawer that opens immediately after adding to cart. If we browse to a standard `/cart` page, the page refreshes and we get corrected line-item keys and a correct cart with the right functionality.

Has there been some kind of regression here within Shopify?

Thanks!

[tim]

There are apps which add and remove line item properties in the background. Change in LIPs leads to change in key.

Make sure this is not what happens in your case.

Recently seen one of the min/max quantity app doing this. Product added to cart, cart drawer refreshed, then app adds LIPs and plus/minus/remove line item buttons stop working because the key is different now.

[williamwong]

Thanks for this tip. I see now what the issue is.

One of the line item properties I'm passing in is a boolean value. When making the `/cart/add.js` call, "true" or "false" is being passed in (and therefore hashed) as a string, but once submitted to Shopify, on the backend it gets converted into a boolean, and then returned as such for the cart. So the generated key for the new item and the existing item are momentarily different, until we refresh the page and Shopify returns the newly added item's line item property as a true boolean value and an properly merge them into a single line item. 😵 

Will try to figure out the best way to handle this going forward. Thanks @tim !