The track Function

The Noibu JavaScript SDK includes a track() function for sending key ecommerce events (e.g. add to cart, checkout, purchase) to Noibu. Event data is captured in session replays, giving your team additional context into shopper behaviour during issue investigation.

For Shopify, BigCommerce, Magento 2 (Adobe Commerce), and SFCC SFRA deployments, ecommerce event collection is enabled automatically. For all other platforms, use the track() function to implement it manually.

Basic structure

window.NOIBUJS.track(eventType, eventData);

Because the Noibu JS SDK is attached to the global window as window.NOIBUJS, make sure it’s available before calling track() (or wait for the noibuSDKReady event).

Parameters

eventType: string (required)

One of the following supported event types:

• product_added_to_cart — logged when a customer adds a product to their cart

• product_removed_from_cart — logged when a customer removes a product from their cart

• checkout_started — logged when a customer begins the checkout process

• payment_info_submitted — logged when a customer submits their payment information

• checkout_completed — logged when a customer completes a purchase

• search_submitted — logged when a customer performs a search on the storefront

• collection_viewed — logged when a customer visits a product collection index page

• product_viewed — logged when a customer visits a product details page

• cart_viewed — logged when a customer visits the cart page

These event names match Shopify’s standard Web Pixels event names. (Shopify)

eventData: object (required)

Specified per eventType, see docs below.

Return value

track() returns:

{ success: boolean, errors: string[] }

• success: true when the event is accepted for tracking; otherwise false

• errors: a list of validation errors (empty when success is true)

Examples

Wait for SDK readiness (recommended)

async function trackCheckoutStarted() {
  if (!window.NOIBUJS) {
    await new Promise((resolve) => window.addEventListener("noibuSDKReady", resolve));
  }

  const result = window.NOIBUJS.track("checkout_started", {
    // Shopify-standard payload shape; all fields optional
    checkout: {
      token: "example-checkout-token",
      totalPrice: { amount: 49.99, currencyCode: "USD" },
    },
  });

  if (!result.success) console.warn("Noibu track failed:", result.errors);
}

Event Types Overview

Fields by Event

product_viewed

Purpose: Tracks which products users view

Minimum required payload:

{
  "productVariant": {
    "sku": "...",
    "id": "...",
    "title": "...",
    "product": {
      "id": "...",
      "title": "...",
      "type": "...",
      "vendor": "..."
    }
  }
}

collection_viewed

Purpose: Tracks which collections/categories users browse.

Minimum required payload:

{
  "collection": {
    "title": "..."
  }
}

search_submitted

Purpose: Tracks site search queries

Minimum required payload:

{
  "searchResult": {
    "query": "..."
  }
}

product_added_to_cart

Purpose: Tracks products added to cart

Minimum required payload:

{
  "cartLine": {
    "quantity": 1,
    "merchandise": {
      "sku": "...",
      "id": "...",
      "title": "...",
      "product": {
        "id": "...",
        "title": "...",
        "type": "...",
        "vendor": "..."
      }
    },
    "cost": {
      "totalAmount": {
        "amount": "29.99",
        "currencyCode": "USD"
      }
    }
  }
}

product_removed_from_cart

Purpose: Tracks products removed from cart. Same structure as product_added_to_cart.

Minimum required payload: Same structure as product_added_to_cart.

cart_viewed

Purpose: Tracks cart page views

Minimum required payload:

{
  "cart": {
    "totalQuantity": 3,
    "cost": {
      "totalAmount": {
        "amount": "89.97",
        "currencyCode": "USD"
      }
    }
  }
}

checkout_started

Purpose: Snapshot of cart at checkout initiation

Minimum required payload:

{
  "checkout": {
    "currencyCode": "USD",
    "lineItems": [
      {
        "title": "...",
        "quantity": "1",
        "variant": {
          "sku": "...",
          "id": "...",
          "title": "...",
          "product": { "id": "...", "type": "...", "vendor": "..." }
        }
      }
    ],
    "subtotalPrice": { "amount": "..." },
    "shippingLine": { "price": { "amount": "..." } },
    "totalTax": { "amount": "..." },
    "totalPrice": { "amount": "..." },
    "discountsAmount": { "amount": "..." },
    "discountApplications": [
      { "title": "...", "type": "..." }
    ]
  }
}

checkout_contact_info_submitted

Purpose: Tracks that the user submitted contact info during checkout.

Minimum required payload: None needed beyond ecomm_name. Discount detection only needs the array to exist (can be empty []).

checkout_address_info_submitted

Purpose: Tracks address submission and delivery options

Minimum required payload:

{
  "checkout": {
    "delivery": {
      "selectedDeliveryOptions": [
        { "title": "Standard Shipping", "type": "SHIPPING" }
      ]
    }
  }
}

checkout_shipping_info_submitted

Purpose: Tracks shipping info submission

Minimum required payload: Same as checkout_address_info_submitted.

payment_info_submitted

Purpose: Tracks payment info submission

Minimum required payload:

{
  "checkout": {
    "currencyCode": "USD",
    "totalPrice": { "amount": "..." },
    "delivery": {
      "selectedDeliveryOptions": [
        { "title": "...", "type": "..." }
      ]
    },
    "transactions": [
      {
        "gateway": "shopify_payments",
        "paymentMethod": { "type": "CREDIT_CARD", "name": "Visa" }
      }
    ],
    "discountApplications": []
  }
}

checkout_completed

Purpose: Final order snapshot

Minimum required payload:

{
  "checkout": {
    "currencyCode": "USD",
    "order": {
      "id": "...",
      "customer": { "id": "..." }
    },
    "lineItems": [
      {
        "title": "...",
        "quantity": "1",
        "variant": {
          "sku": "...",
          "id": "...",
          "title": "...",
          "product": { "id": "...", "type": "...", "vendor": "..." }
        }
      }
    ],
    "subtotalPrice": { "amount": "..." },
    "shippingLine": { "price": { "amount": "..." } },
    "totalTax": { "amount": "..." },
    "totalPrice": { "amount": "..." },
    "discountsAmount": { "amount": "..." },
    "discountApplications": [
      { "title": "...", "type": "..." }
    ],
    "delivery": {
      "selectedDeliveryOptions": [
        { "title": "...", "type": "..." }
      ]
    },
    "transactions": [
      {
        "gateway": "...",
        "paymentMethod": { "type": "...", "name": "..." }
      }
    ]
  }
}