Cart

Description

The cart variable provides access to the current customer’s shopping cart data within the Superfans SDK.
It allows you to read line items, quantities, prices, discounts, and totals directly from Shopify’s cart.
This variable is available globally whenever a user has an active cart session. If no items have been added, cart will be empty or null.

Properties of cart

Properties of cart items

Example Usage

const cart = VajroSDK.variables.cart;

if (cart && cart.items?.length > 0) {
  console.log(`You have ${cart.totalQuantity} items in your cart.`);

  // Show first item info
  const firstItem = cart.items[0];
  console.log(`First item: ${firstItem.title} - ${firstItem.quantity} pcs`);

  // Display subtotal and discount applied
  console.log(`Subtotal: $${cart.subtotal}`);
  console.log(`Discounts applied: $${cart.appliedDiscounts}`);
} else {
  console.log("Your cart is empty.");
}

Best Practices

1. Check for null or empty carts: Always verify that cart exists and has items before accessing its properties.
2. Reflect real-time changes: The cart updates automatically when items are added or removed. Use event listeners or refresh functions to re-render totals dynamically.
3. Avoid direct modification: Cart data is read-only via this variable. Use cart actions (like addToCart, removeFromCart) to modify contents.

Caveats

1. Price rounding: Shopify handles rounding and currency precision; do not manually round floats.
2. Discount structures: Some discount allocations may be split per line item instead of the full cart; handle both cases.
3. Subscriptions: If using Shopify selling plans, ensure sellingPlanAllocation exists before referencing it.