MAGETWO-83993: Fixed a js bug where ui_component labels have the wrong sort order. #11846

Author: omiroshnichenko

app/code/Magento/Catalog/view/adminhtml/web/js/components/dynamic-rows-tier-price.js

@@ -9,6 +9,10 @@ define([
 ], function (_, DynamicRows) {
     'use strict';
 
+    /**
+     * @deprecated Parent method contains labels sorting.
+     * @see Magento_Ui/js/dynamic-rows/dynamic-rows
+     */
     return DynamicRows.extend({
 
         /**

app/code/Magento/Ui/view/base/web/js/dynamic-rows/dynamic-rows.js

@@ -533,7 +533,8 @@ define([
          * Init header elements
          */
         initHeader: function () {
-            var data;
+            var labels = [],
+                data;
 
             if (!this.labels().length) {
                 _.each(this.childTemplate.children, function (cell) {
@@ -547,15 +548,9 @@ define([
                         sortOrder: cell.config.sortOrder
                     });
 
-                    this.labels.push(data);
-
-                    /**
-                     * Sort the array after an element was added to fix an bug where
-                     * additional added field labels in ui_components haven't the right
-                     * sort order.
-                     */
-                    this.labels.sort(this._compare);
+                    labels.push(data);
                 }, this);
+                this.labels(_.sortBy(labels, 'sortOrder'));
             }
         },
 
@@ -921,24 +916,6 @@ define([
             }));
         },
 
-        /**
-         * Compare two objects by the sortOrder property.
-         *
-         * @param {Object} $object1
-         * @param {Object} $object2
-         * @returns {Number}
-         * @private
-         */
-        _compare: function ($object1, $object2) {
-            if ($object1.sortOrder > $object2.sortOrder) {
-                return 1;
-            } else if ($object1.sortOrder < $object2.sortOrder) {
-                return -1;
-            }
-
-            return 0;
-        },
-
         /**
          * Set new data to dataSource,
          * delete element

dev/tests/js/jasmine/tests/app/code/Magento/Ui/base/js/dynamic-rows/dynamic-rows.test.js

@@ -131,5 +131,43 @@ define([
             model.deleteRecord(1, 1);
             expect(model.recordData()).toEqual([]);
         });
+
+        it('"initHeader" sortOrder', function () {
+            var labels = [{
+                    name: 'Name 1',
+                    config: {
+                        label: 'Label 1',
+                        validation: false,
+                        columnsHeaderClasses: '',
+                        sortOrder: 10
+                    }
+                }, {
+                    name: 'Name 2',
+                    config: {
+                        label: 'Label 2',
+                        validation: false,
+                        columnsHeaderClasses: '',
+                        sortOrder: 5
+                    }
+                }],
+                result = [{
+                    label: 'Label 2',
+                    name: 'Name 2',
+                    required: false,
+                    columnsHeaderClasses: '',
+                    sortOrder: 5
+                }, {
+                    label: 'Label 1',
+                    name: 'Name 1',
+                    required: false,
+                    columnsHeaderClasses: '',
+                    sortOrder: 10
+                }];
+
+            model.childTemplate = {
+                children: labels
+            };
+            expect(JSON.stringify(model.labels())).toEqual(JSON.stringify(result));
+        });
     });
 });