Dev: JavaScript Events

Persistent Cart emits events to help you track synchronisation and cart updates.

apps:refactor_persistent_cart:updated

Fired whenever the persistent cart changes.

Use this to:

• Re-render UI components
• Update cart counters
• Trigger analytics

Example:

document.addEventListener("apps:refactor_persistent_cart:updated", (event) => {      
  console.log("Persistent cart updated", event.detail); 
});

apps:refactor_persistent_cart:ready

Fired when cart synchronisation is complete, and the API is ready to use.

You may also check:

window.refactor_apps.persistent_cart.isReady

Example:

document.addEventListener("apps:refactor_persistent_cart:ready", () => {   
  console.log("Persistent Cart is ready"); 
});

Synchronization Behavior

Cart synchronisation occurs shortly after page load and typically completes within a few milliseconds.

If your logic depends on synchronised cart data:

• Listen for apps:refactor_persistent_cart:ready      , or
• Check window.refactor_apps.persistent_cart.isReady      

Example:

if (window.refactor_apps.persistent_cart.isReady) {   
  const cart = await window.refactor_apps.persistent_cart.getGuestCart(); 
}

Best Practices

• Always pass customerId when you call API methods related to the customer cart (getCustomerCart, updateCustomerCart, etc)
• User should be logged in for the guest-related methods (getGuestCart, addToGuestCart, etc).
• Wait for apps:refactor_persistent_cart:ready   if you rely on synced data
• Do not assume immediate availability on page load