Cart vs Checkout & Updating Line Items within Checkout (Shopify Plus)

Technical Q&A
1

Hi all,

A bit of background - we have a Shopify Plus store with access to checkout.liquid. Our setup is headless so the frontend is a separate React app. We’re wanting to incorporate an upsell widget in the checkout so that customers can add extra products before checking out. Something to note: our frontend currently uses the Storefront API to create/mutate a checkout when a customer adds items to their cart, because when we implemented it there was no cart object available in the Storefront API.

The problem:

When we try to add items to the cart via the Ajax API or Storefront API (using cart mutations), they seem to get added to a different cart than the one that is associated with the checkout, so when navigating to the next step or refreshing the page the added items don’t appear.

What we’ve tried:

  • Added to cart from within the checkout via Ajax API. The requests worked fine but they seemed to add items to a cart that was not associated with the checkout.

  • On the frontend we tried to create a new cart via Storefront API, used the checkoutUrl to navigate to checkout, added more items to that same cart via Storefront API from within the checkout. Once again the requests worked fine but items still don’t appear in the checkout after refresh or navigation to next step.

Is there a way to achieve this? I could potentially use the Storefront API to mutate the actual checkout but there doesn’t seem to be a way of getting the checkoutId from within the checkout. Am I missing something?

Any help would be much appreciated, thanks!

2

Bump.

Any ideas?

3

Did you figure this out after all ?

4

Unfortunately no :disappointed_face:

5

The Checkout ID is made available for you after creating the checkout, in the response. You can store this Checkout ID in storage or attach it to the checkout as an attribute or you could pass it as an AJAX Cart attribute which should be readable from checkout. My concern is whether to use the Cart Storefront API at all, as this is essentially a simpler version of the Checkout API, I’m not even sure if it’s worth switching to. Since you’re on Plus, I also recommend looking into the new Checkout Functions which are backend processes you can run on certain checkout actions.

6

Storing the checkoutId is not what I’m wanting to do. I already store the checkoutId in localstorage and use it in conjunction with the checkout api instead of the cart api. The issue is that the checkout and the cart seem completely unrelated so there is no way to add more items to this checkout object after I reach checkout (for example from within an upsell widget). I will look into checkout functions, thanks.