MAGETWO-96308: Configurable "As low As" Product Price Not Updating Correctly

Author: rostyslav-hymon

app/code/Magento/Catalog/view/base/web/js/price-box.js

@@ -78,7 +78,11 @@ define([
                 pricesCode = [],
                 priceValue, origin, finalPrice;
 
-            this.cache.additionalPriceObject = this.cache.additionalPriceObject || {};
+            if (typeof newPrices !== 'undefined' && newPrices.hasOwnProperty("prices")) {
+                this.cache.additionalPriceObject = {};
+            } else {
+                this.cache.additionalPriceObject = this.cache.additionalPriceObject || {};
+            }
 
             if (newPrices) {
                 $.extend(this.cache.additionalPriceObject, newPrices);

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

@@ -477,16 +477,32 @@ define([
         _getPrices: function () {
             var prices = {},
                 elements = _.toArray(this.options.settings),
-                hasProductPrice = false;
+                hasProductPrice = false,
+                optionPriceDiff = 0,
+                allowedProduct, optionPrices, basePrice, optionFinalPrice;
 
             _.each(elements, function (element) {
                 var selected = element.options[element.selectedIndex],
                     config = selected && selected.config,
                     priceValue = {};
 
                 if (config && config.allowedProducts.length === 1 && !hasProductPrice) {
+                    prices = {};
                     priceValue = this._calculatePrice(config);
                     hasProductPrice = true;
+                } else if (element.value) {
+                    allowedProduct = this._getAllowedProductWithMinPrice(config.allowedProducts);
+                    optionPrices = this.options.spConfig.optionPrices;
+                    basePrice = parseFloat(this.options.spConfig.prices.basePrice.amount);
+
+                    if (!_.isEmpty(allowedProduct)) {
+                        optionFinalPrice = parseFloat(optionPrices[allowedProduct].finalPrice.amount);
+                        optionPriceDiff = optionFinalPrice - basePrice;
+                    }
+                    if (optionPriceDiff !== 0) {
+                        prices = {};
+                        priceValue = this._calculatePriceDifference(allowedProduct);
+                    }
                 }
 
                 prices[element.attributeId] = priceValue;
@@ -495,6 +511,53 @@ define([
             return prices;
         },
 
+        /**
+         * Get product with minimum price from selected options.
+         *
+         * @param {Array} allowedProducts
+         * @returns {String}
+         * @private
+         */
+        _getAllowedProductWithMinPrice: function (allowedProducts) {
+            var optionPrices = this.options.spConfig.optionPrices,
+                product = {},
+                optionMinPrice, optionFinalPrice;
+
+            _.each(allowedProducts, function (allowedProduct) {
+                optionFinalPrice = parseFloat(optionPrices[allowedProduct].finalPrice.amount);
+
+                if (_.isEmpty(product)) {
+                    optionMinPrice = optionFinalPrice;
+                    product = allowedProduct;
+                }
+                if (optionFinalPrice < optionMinPrice) {
+                    product = allowedProduct;
+                }
+            }, this);
+
+            return product;
+        },
+
+        /**
+         * Calculate price difference for allowed product
+         *
+         * @param {*} allowedProduct - Product
+         * @returns {*}
+         * @private
+         */
+        _calculatePriceDifference: function (allowedProduct) {
+            var displayPrices = $(this.options.priceHolderSelector).priceBox('option').prices,
+                newPrices = this.options.spConfig.optionPrices[allowedProduct];
+
+            _.each(displayPrices, function (price, code) {
+                if (newPrices[code]) {
+                    displayPrices[code].amount = newPrices[code].amount - displayPrices[code].amount;
+                }
+            });
+
+            return displayPrices;
+        },
+
         /**
          * Returns prices for configured products
          *

app/code/Magento/Swatches/view/frontend/web/js/swatch-renderer.js

@@ -968,10 +968,24 @@ define([
          * @private
          */
         _getPrices: function (newPrices, displayPrices) {
-            var $widget = this;
+            var $widget = this,
+                optionPriceDiff = 0,
+                allowedProduct, optionPrices, basePrice, optionFinalPrice;
 
             if (_.isEmpty(newPrices)) {
-                newPrices = $widget.options.jsonConfig.prices;
+                allowedProduct = this._getAllowedProductWithMinPrice(this._CalcProducts());
+                optionPrices = this.options.jsonConfig.optionPrices;
+                basePrice = parseFloat(this.options.jsonConfig.prices.basePrice.amount);
+                
+                if (!_.isEmpty(allowedProduct)) {
+                    optionFinalPrice = parseFloat(optionPrices[allowedProduct].finalPrice.amount);
+                    optionPriceDiff = optionFinalPrice - basePrice;
+                }
+                if (optionPriceDiff !== 0) {
+                    newPrices  = this.options.jsonConfig.optionPrices[allowedProduct];
+                } else {
+                    newPrices = $widget.options.jsonConfig.prices;
+                }
             }
 
             _.each(displayPrices, function (price, code) {
@@ -983,6 +997,33 @@ define([
             return displayPrices;
         },
 
+        /**
+         * Get product with minimum price from selected options.
+         *
+         * @param {Array} allowedProducts
+         * @returns {String}
+         * @private
+         */
+        _getAllowedProductWithMinPrice: function (allowedProducts) {
+            var optionPrices = this.options.jsonConfig.optionPrices,
+                product = {},
+                optionFinalPrice, optionMinPrice;
+
+            _.each(allowedProducts, function (allowedProduct) {
+                optionFinalPrice = parseFloat(optionPrices[allowedProduct].finalPrice.amount);
+
+                if (_.isEmpty(product)) {
+                    optionMinPrice = optionFinalPrice;
+                    product = allowedProduct;
+                }
+                if (optionFinalPrice < optionMinPrice) {
+                    product = allowedProduct;
+                }
+            }, this);
+
+            return product;
+        },
+
         /**
          * Gets all product media and change current to the needed one
          *