JavaScript function to refresh cart drawer (Sense theme)

[tobiaszellweger]

Hi everyone,

I need some help with my Shopify store (I’m using the Sense theme).

An app provider (Fast Bundle) asked me to create a global JavaScript function that can be called via window in the browser console. This function should update or refresh the content of the cart drawer — specifically, the native Shopify cart drawer that comes with the Sense theme.

I’m not quite sure how to do this. Has anyone done something similar or could help me write such a function?

Any help would be really appreciated!

https://kyotsu.ch
PW: kyotsu.ch

Best regards,
Tobias

[PaulNewton]

@tobiaszellweger Try something like the following UNTESTED and not final code:

/* make sure this event happens after custom elements are defined */
document.addEventListener('DOMContentLoaded', refreshCart(ajaxCartJSONResponseObject)
}
function refreshCart(ajaxCartJSONResponseObject){
  let cart = document.getElementsByTagName('cart-drawer')[0];
  if(cart)
      cart.renderContents(ajaxCartJSONResponseObject);
}

If the app is changing the cart it should be able to call that function and pass in the cart object it got ajaxCartJSONResponseObject

Otherwise you need to also build the ajax/fetch logic to get the cart, this info is found in shopify theme docs or generally online.

Or you'd have to modify the theme to expose the behavior outside of anonymous functions and classes.

To either get the cart render behavior from the product form as a product is added in product-form.js.

Or from the cart-drawer-items custom element and it's internal renderContents() function in cart-drawer.js

If you need this advanced customization built and tested then contact me by for services.

Contact info in forum signature.

or if you have access use a private message by clicking here (sloooower).
ALWAYS please provide context, examples: store url, theme name, post url(s) , or any further detail in ALL correspondence.