I've created a product type, with some variation types, and then a test product with variations.

On the default theme, Bartik, my product shows what appears to be the first variation's title and SKU.

This doesn't seem right to me -- this is internal data and should be configured to be hidden by default.

Here's the output from my node:

<article>
            <div class="product--variation-field--variation_title__3 field field--name-title field--type-string field--label-hidden field__item">My product's title - Red, Small</div>
      
            <div class="product--variation-field--variation_sku__3 field field--name-sku field--type-string field--label-hidden field__item">SKU-RedSmall</div>
      
  <div class="field field--name-variations field--type-entity-reference field--label-above">
    <div class="field__label">Variations</div>
          <div class="field__items">
              <div class="field__item"><div id="commerce-product-add-to-cart-form"><form class="commerce-order-item-default-add-to-cart-1-form commerce-order-item-add-to-cart-form" data-drupal-selector="commerce-order-item-default-add-to-cart-1-form" action="/drupal-8-commerce/product/3" method="post" id="commerce-order-item-default-add-to-cart-1-form" accept-charset="UTF-8">
  <div class="field--type-entity-reference field--name-purchased-entity field--widget-commerce-product-variation-attributes js-form-wrapper form-wrapper" data-drupal-selector="edit-purchased-entity-wrapper" id="edit-purchased-entity-wrapper">      <div class="attribute-widgets js-form-wrapper form-wrapper" data-drupal-selector="edit-purchased-entity-0-attributes" id="edit-purchased-entity-0-attributes"><div class="js-form-item form-item js-form-type-select form-type-select js-form-item-purchased-entity-0-attributes-attribute-colour form-item-purchased-entity-0-attributes-attribute-colour form-disabled">
      <label for="edit-purchased-entity-0-attributes-attribute-colour" class="js-form-required form-required">Colour</label>
        <select data-drupal-selector="edit-purchased-entity-0-attributes-attribute-colour" disabled="disabled" id="edit-purchased-entity-0-attributes-attribute-colour" name="purchased_entity[0][attributes][attribute_colour]" class="form-select required" required="required" aria-required="true"><option value="1" selected="selected">Red</option></select>
        </div>
<div class="js-form-item form-item js-form-type-select form-type-select js-form-item-purchased-entity-0-attributes-attribute-size form-item-purchased-entity-0-attributes-attribute-size">
      <label for="edit-purchased-entity-0-attributes-attribute-size" class="js-form-required form-required">Size</label>
        <select data-drupal-selector="edit-purchased-entity-0-attributes-attribute-size" id="edit-purchased-entity-0-attributes-attribute-size" name="purchased_entity[0][attributes][attribute_size]" class="form-select required" required="required" aria-required="true"><option value="3" selected="selected">Small</option><option value="5">Large</option></select>
        </div>
</div>

  </div>
<input data-drupal-selector="form-mrbc7welmzrm0ssoix-yi4jsyt7ba9nbtfokmt39dlu" name="form_build_id" value="form-MRbC7wELMZrm0sSOix_yI4jsyt7Ba9nbtfoKMt39dlU" type="hidden">
<input data-drupal-selector="edit-commerce-order-item-default-add-to-cart-1-form-form-token" name="form_token" value="Du6J24qSkKO8SAZirUIh_tWsM727LLjMciM9mRQArsQ" type="hidden">
<input data-drupal-selector="edit-commerce-order-item-default-add-to-cart-1-form" name="form_id" value="commerce_order_item_default_add_to_cart_1_form" type="hidden">
<div data-drupal-selector="edit-actions" class="form-actions js-form-wrapper form-wrapper" id="edit-actions"><input data-drupal-selector="edit-submit" id="edit-submit" name="op" value="Add to cart" class="button button--primary js-form-submit form-submit" type="submit">
</div>

</form>
</div></div>
              </div>
      </div>
</article>
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

joachim created an issue. See original summary.

bojanz’s picture

Title: OOTB products show variation SKU and title » Hide variation SKU by default

The title is not internal data.

SKU can be, so let's say this is what you're asking.

joachim’s picture

Is this maybe because I enabled 'Inject product variation fields into the rendered product.' on the product type? I had *no* idea what that was going to do, so perhaps that UI element needs an explanation.

bojanz’s picture

Yes, that's field injection. Same concept we had in 1.x

joachim’s picture

(side issue, but then shouldn't they change when I pick a different variation? they don't.)

bojanz’s picture

Title: Hide variation SKU by default » Hide variation title and SKU by default
Category: Bug report » Task

Revisiting this, it makes sense to hide the title by default as well, since it's usually shown in the variation selection widget in some shape.

jsacksick’s picture

Status: Active » Needs review
FileSize
3.28 KB

I updated the tests, I now check that the SKU isn't present by default, and then I reconfigured the entity view display to show the SKU and check if it's there.

bojanz’s picture

Status: Needs review » Needs work

ProductVariationFieldRendererTest hasn't been updated, so it's failing.

jsacksick’s picture

Status: Needs work » Needs review
FileSize
4.12 KB

  • bojanz committed 34ca144 on 8.x-2.x authored by jsacksick
    Issue #2886727 by jsacksick, bojanz, joachim: Hide variation title and...
bojanz’s picture

Status: Needs review » Fixed

Thanks!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.

romstach’s picture

Hello

When i create a product, I must create 45 Variations !!! So i have other products where i have to create more than 500 variations !!!!!!!

Do you know how to avoid this ???

Thx

Edit:
@Drugan give me this : https://github.com/drupalcommerce/commerce/compare/8.x-2.x...drugan:allo...
Thank's to him