MAGETWO-35379: Gallery images are not loaded for Configurable Product

Author: orlangur

app/code/Magento/ConfigurableProduct/Block/Product/View/Type/Configurable.php

@@ -183,8 +183,9 @@ public function getJsonConfig()
                     'amount' => $this->_registerJsPrice($this->_convertPrice($regularPrice->getAmount()->getValue())),
                 ],
                 'basePrice' => [
-                    'amount' =>
-                        $this->_registerJsPrice($this->_convertPrice($finalPrice->getAmount()->getBaseAmount())),
+                    'amount' => $this->_registerJsPrice(
+                        $this->_convertPrice($finalPrice->getAmount()->getBaseAmount())
+                    ),
                 ],
                 'finalPrice' => [
                     'amount' => $this->_registerJsPrice($this->_convertPrice($finalPrice->getAmount()->getValue())),
@@ -193,7 +194,6 @@ public function getJsonConfig()
             'productId' => $currentProduct->getId(),
             'chooseText' => __('Choose an Option...'),
             'images' => isset($options['images']) ? $options['images'] : [],
-            'baseImage' => $options['baseImage'],
         ];
 
         if ($currentProduct->hasPreconfiguredValues() && !empty($attributes['defaultValues'])) {

app/code/Magento/ConfigurableProduct/Helper/Data.php

@@ -58,7 +58,6 @@ public function getOptions($currentProduct, $allowedProducts)
                 $options['images'][$productAttributeId][$attributeValue][$productId] = $imageUrl;
             }
         }
-        $options['baseImage'] = $baseImageUrl;
 
         return $options;
     }

app/code/Magento/ConfigurableProduct/Test/Unit/Helper/DataTest.php

@@ -82,11 +82,10 @@ public function getOptionsDataProvider()
         );
         $provider = [];
         $provider[] = [
-            ['baseImage' => 'http://example.com/base_img_url'],
+            [],
             [
                 'allowed_products' => [],
                 'current_product_mock' => $currentProductMock,
-                'baseImage' => 'http://example.com/base_img_url'
             ],
         ];
 
@@ -163,12 +162,10 @@ public function getOptionsDataProvider()
                 'attribute_id_2' => [
                     'attribute_code_value_2' => ['product_id_1', 'product_id_2'],
                 ],
-                'baseImage' => 'http://example.com/base_img_url',
             ],
             [
                 'allowed_products' => $allowedProducts,
                 'current_product_mock' => $currentProductMock,
-                'baseImage' => 'http://example.com/base_img_url'
             ],
         ];
         return $provider;

app/code/Magento/ConfigurableProduct/view/frontend/web/js/configurable.js

@@ -10,7 +10,8 @@ define([
     "priceUtils",
     "priceBox",
     "jquery/ui",
-    "jquery/jquery.parsequery"
+    "jquery/jquery.parsequery",
+    "mage/gallery"
 ], function($, _, mageTemplate, utils){
 
     function getPrices(elems){
@@ -83,6 +84,8 @@ define([
 
             this.options.values = this.options.spConfig.defaultValues || {};
             this.options.parentImage = $('[data-role=base-image-container] img').attr('src');
+
+            this.initialGalleryImages = $(this.options.mediaGallerySelector).gallery('option', 'images');
         },
 
         /**
@@ -238,12 +241,7 @@ define([
         _changeProductImage: function () {
             var images = this.options.spConfig.images,
                 imagesArray = null,
-                galleryElement = $(this.options.mediaGallerySelector),
-                baseImage = {
-                    small: this.options.spConfig.baseImage,
-                    medium: this.options.spConfig.baseImage,
-                    large: this.options.spConfig.baseImage
-                };
+                galleryElement = $(this.options.mediaGallerySelector);
             $.each(this.options.settings, function (k, v) {
                 var selectValue = parseInt(v.value, 10),
                     attributeId = v.id.replace(/[a-z]*/, '');
@@ -263,18 +261,16 @@ define([
             });
 
             var result = [];
-            $.each(imagesArray || baseImage, function (k, v) {
+            $.each(imagesArray || {}, function (k, v) {
                 result.push({
                     small: v,
                     medium: v,
                     large: v
                 });
             });
-            if (result.length !== 1) {
-                result = [baseImage];
-            }
+
             if (galleryElement.length && galleryElement.data('mageGallery')) {
-                galleryElement.gallery('option', 'images', result);
+                galleryElement.gallery('option', 'images', result.length > 0 ? result : this.initialGalleryImages);
             }
         },
 

dev/tests/integration/testsuite/Magento/ConfigurableProduct/Block/Product/View/Type/ConfigurableTest.php

@@ -69,7 +69,7 @@ public function testGetAllowProducts()
             $this->assertInstanceOf('Magento\Catalog\Model\Product', $product);
         }
     }
-    
+
     /**
      * @magentoAppIsolation enabled
      */
@@ -79,7 +79,6 @@ public function testGetJsonConfig()
         $this->assertNotEmpty($config);
         $this->assertArrayHasKey('productId', $config);
         $this->assertEquals(1, $config['productId']);
-        $this->assertArrayHasKey('baseImage', $config);
         $this->assertArrayHasKey('attributes', $config);
         $this->assertArrayHasKey('template', $config);
         $this->assertArrayHasKey('prices', $config);