/cart.js Not Showing Correct Contents of the Cart

Highlighted
Tourist
4 0 1

We're experiencing issues with the /cart.js endpoint on our client's stores https://multi-health-systems.myshopify.com/ and https://multi-health-systems-usd.myshopify.com/ .

It doesn't seem to be updating. Here you can see I have 5 items added to the cart...

mhs1.pngBut the /cart.js only shows I have 1 item added to the cart.

mhs2.pngCan anyone confirm this bug? We use the /cart.js endpoint to populate the cart drop down in the header and it's confusing customers.

Thanks for the help,

Shane Kunz

0 Likes
Highlighted
Shopify Staff
Shopify Staff
587 71 128

Hey @shanemlk,

I just tested the functionality on my own store and can confirm it's working as expected. I had a look at both stores you linked, and I definitely had issues using the cart on both. On the USD store I couldn't add products at all, on the CAD store I replicated the issue you described where the cart shows an incorrect count.

Since we know there's no issue with the endpoint, the most likely explanation is that other code on your theme is causing an issue. The javascript console shows a number of errors on the storefront, with the most relevant one being  query-3.4.1.min.js:2 Uncaught TypeError: Cannot read property 'length'. Cart.js relies on jQuery, and this error suggests there's an issue with the library being used on your storefront, or perhaps multiple libraries are causing a conflict. I'm fairly confident that resolving this jQuery error will solve the cart count issue, so I recommend giving that a shot first. If you're still seeing issues after that I recommend looking at the JS console for additional errors, and look at getting those resolved.

JB | Developer Support @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Click Accept as Solution 

0 Likes
Highlighted
Tourist
4 0 1

Can you please have someone look at the endpoint on OUR store (storefront.mhs.com), not yours? The USD is adding products to the cart if you go to storefront.mhs.com/cart. I know the header will say 0, but just continue to the cart. Here's a cart with 1 product...

Annotation 2020-06-24 155402.png

There's absolutely something in the cart if the liquid code is rendering it. But then go https://storefront.mhs.com/cart.js and you'll see an empty cart...

Capture.PNG

This is a problem on this store specifically. I have plenty of other stores working, but this one specifically has something wrong happening with it. I tried to contact support, and they said to post in the forums. I understand some apps are causing javascript errors, but the /cart.js endpoint showing an empty cart has nothing to do with the javascript on the page.

0 Likes
Highlighted
Shopify Staff
Shopify Staff
587 71 128

Hey @shanemlk,

The purpose of testing on my own store is to confirm there is no issue with the cart.js component itself. Since we know cart.js is working as expected, this tells us the issue is with existing code on your theme. I looked through your theme code and tried to identify what's causing the issue, but there are a number of errors appearing in the console on your themes and the offending code wasn't super obvious. At this point identifying the issue will be a process of trial and error. This isn't something we can do for you, I recommend getting whoever is most familiar with this theme's code to remove/disable JS scripts one-by-one until you identify the problem.

JB | Developer Support @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Click Accept as Solution 

1 Like
Highlighted
Tourist
4 0 1

We just had this occur on another much busier store around 11AM with no changes to the theme today.

A coworker found the fix, just use "/cart.json" instead of "cart.js".

_JB you might want to update the docs... https://shopify.dev/docs/themes/ajax-api/reference/cart

0 Likes