ENGCOM-1336: Display Wrong Data On Cart Update Page #14765

 - Merge Pull Request #14765 from nit-it/magento2:nit-it-patch-2
 - Merged commits:
   1. 1690bb2
   2. 4f3c9c5
   3. 3b636d6
   4. d8d51e9

Author: magento-engcom-team

app/code/Magento/Catalog/view/frontend/templates/product/view/form.phtml

@@ -22,6 +22,7 @@
         <input type="hidden" name="product" value="<?= /* @escapeNotVerified */ $_product->getId() ?>" />
         <input type="hidden" name="selected_configurable_option" value="" />
         <input type="hidden" name="related_product" id="related-products-field" value="" />
+        <input type="hidden" name="item"  value="<?= /* @noEscape */ $block->getRequest()->getParam('id') ?>" />
         <?= $block->getBlockHtml('formkey') ?>
         <?= $block->getChildHtml('form_top') ?>
         <?php if (!$block->hasOptions()):?>

app/code/Magento/Checkout/view/frontend/web/js/view/configure/product-customer-data.js

@@ -7,10 +7,12 @@ require([
 
     var selectors = {
         qtySelector: '#product_addtocart_form [name="qty"]',
-        productIdSelector: '#product_addtocart_form [name="product"]'
+        productIdSelector: '#product_addtocart_form [name="product"]',
+        itemIdSelector: '#product_addtocart_form [name="item"]'
     },
     cartData = customerData.get('cart'),
     productId = $(selectors.productIdSelector).val(),
+    itemId = $(selectors.itemIdSelector).val(),
     productQty,
     productQtyInput,
 
@@ -40,8 +42,10 @@ require([
             return;
         }
         product = data.items.find(function (item) {
-            return item['product_id'] === productId ||
-                item['item_id'] === productId;
+            if (item['item_id'] === itemId) {
+                return item['product_id'] === productId ||
+                    item['item_id'] === productId;
+            }
         });
 
         if (!product) {

app/code/Magento/ConfigurableProduct/view/frontend/web/js/options-updater.js

@@ -7,10 +7,12 @@ define([
 
     var selectors = {
         formSelector: '#product_addtocart_form',
-        productIdSelector: '#product_addtocart_form [name="product"]'
+        productIdSelector: '#product_addtocart_form [name="product"]',
+        itemIdSelector: '#product_addtocart_form [name="item"]'
     },
     cartData = customerData.get('cart'),
     productId = $(selectors.productIdSelector).val(),
+    itemId = $(selectors.itemIdSelector).val(),
 
     /**
     * set productOptions according to cart data from customer-data
@@ -24,8 +26,10 @@ define([
         if (!(data && data.items && data.items.length && productId)) {
             return false;
         }
-        changedProductOptions = _.find(data.items, function (item) {
-            return item['product_id'] === productId;
+        changedProductOptions = data.items.find(function (item) {
+            if (item['item_id'] === itemId) {
+                return item['product_id'] === productId;
+            }
         });
         changedProductOptions = changedProductOptions && changedProductOptions.options &&
             changedProductOptions.options.reduce(function (obj, val) {