product view and JS require an image

[NathanPJF]

Issue

The markup and JS assumes your product images will always have an image.

• When product template doesn't have a featured image, it renders the placeholder tag.
• The JS throws an error when it goes looking for an image selector and doesn't find one.

I realize it's not common for a product not to have an image, but it's an assumption baked into the theme that should be addressed.

Reproduction

Make a product that has no images associated with it. Example screenshot: http://take.ms/zIVff

Screenshot of feature product section

Problem code

Three areas:

• featured-product.liquid
• product.liquid
• product.js

In featured-product.liquid, it assumes that if you don't have a featured image then you must be onboarding:

  {% if product.featured_image.src != blank %}
    {{ product.featured_image.src | img_url: '480x480' | img_tag: product.featured_image.src.alt, 'product-image' }}
  {% else %}
    {{ 'product-1' | placeholder_svg_tag: 'placeholder-svg placeholder-svg--small' }}
  {% endif %}

In product.liquid there's no check if a featured image exists.

In product.js there is no check whether $(selectors.productFeaturedImage, this.$container) yields any results first.

this.settings.imageSize = slate.Image.imageSize($(selectors.productFeaturedImage, this.$container).attr('src'))

[NathanPJF]

Possibly related: https://github.com/Shopify/narrative/pull/252/

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.