Error Value NaN Displayed in Cart Popover

Shopify Discussion
,

Topic summary

A Shopify store owner is encountering a “NaN” (Not a Number) error appearing in their cart popover when products are added. The issue manifests as “NaN Product Title” instead of the expected “Quantity Product Title” format.

Technical Details:

  • The NaN value appears within the <h3> tag containing the product title
  • No quantity is being displayed alongside the product title
  • Browser inspection reveals the error originates from the cart notification popover code

Root Cause:
The code snippet shows parseFloat($('.quantity__input', this.container$).val()) is being used to capture the added quantity. This suggests the quantity input value is either undefined, null, or not properly formatted as a number, resulting in the NaN error.

Constraints:
The site is heavily customized, preventing the owner from seeking support from the original theme developers. They are looking for either a fix to properly display the quantity or a workaround to remove the NaN display entirely.

The discussion remains open with no resolution provided yet.

Summarized with AI on November 17. AI used: claude-sonnet-4-5-20250929.
1

Hello! I’ve been trying to find a way to get rid of a “NaN” value that keeps showing in the cart popover when you add a product to cart. From my theme.js file it looks like the cart popover should be showing the “Quantity” followed by the “Product Title” but what renders is “NaN Product Title”:

Screenshot 2023-08-31 at 13.51.53.png
Screenshot 2023-08-31 at 13.51.53.png734×641 17 KB

I inspected my site to see where the line of code comes from, and what I see is that the NaN is in the

tag within the product title and no quantity is displayed:

Screenshot 2023-08-31 at 15.34.33.png
Screenshot 2023-08-31 at 15.34.33.png1004×480 71.4 KB

I’m unsure what happened but my site is so heavily customized that I can not reach out to my theme developers for help. Any insight on why the quantity isn’t displaying or how I can simply remove the “NaN” would be so appreciated!

Below is the details section of the cart popover from my theme.js file:

   showCartNotificationPopup: function(product){
      var addedQuantity = parseInt( $('.quantity__input', this.$container).val() );
      var title = product.product_title.length > 20 ? product.product_title.substring(0, 20) + '...' : product.product_title;
      var variant = product.variant_title == 'Default Title' ? false : product.variant_title;
      var image = slate.Image.getSizedImageUrl(product.image, '720x720');
      var unitPrice = this.$container.find('[data-product-unit]')[0] || null;
      if (unitPrice) { unitPrice = unitPrice.outerHTML; }

      var itemData = {
        item_count: addedQuantity,
        product_image: image,
        product_title: title,
        variant: variant,
        price: product.price,
        unit_price: unitPrice,
        price_formatted: slate.Currency.formatMoney(product.price, theme.moneyFormat)
      }