ENGCOM-5439: #14071: Not able to change a position of last two rel… #22984

 - Merge Pull Request #22984 from m-a-x-i-m/magento2:issue#14071
 - Merged commits:
   1. 98d1c9a

Author: magento-engcom-team

app/code/Magento/Catalog/Test/Mftf/Test/AdminSimpleSetEditRelatedProductsTest.xml

@@ -22,6 +22,11 @@
             <actionGroup ref="LoginAsAdmin" stepKey="loginAsAdmin"/>
             <createData entity="SimpleProduct2" stepKey="simpleProduct0"/>
             <createData entity="SimpleProduct2" stepKey="simpleProduct1"/>
+            <createData entity="SimpleProduct2" stepKey="simpleProduct2"/>
+            <createData entity="SimpleProduct2" stepKey="simpleProduct3"/>
+            <createData entity="SimpleProduct2" stepKey="simpleProduct4"/>
+            <createData entity="SimpleProduct2" stepKey="simpleProduct5"/>
+            <createData entity="SimpleProduct2" stepKey="simpleProduct6"/>
         </before>
         <after>
             <!-- Delete simple product -->
@@ -31,6 +36,11 @@
             <amOnPage url="{{AdminLogoutPage.url}}" stepKey="amOnLogoutPage"/>
             <deleteData createDataKey="simpleProduct0" stepKey="deleteSimpleProduct0"/>
             <deleteData createDataKey="simpleProduct1" stepKey="deleteSimpleProduct1"/>
+            <deleteData createDataKey="simpleProduct2" stepKey="deleteSimpleProduct2"/>
+            <deleteData createDataKey="simpleProduct3" stepKey="deleteSimpleProduct3"/>
+            <deleteData createDataKey="simpleProduct4" stepKey="deleteSimpleProduct4"/>
+            <deleteData createDataKey="simpleProduct5" stepKey="deleteSimpleProduct5"/>
+            <deleteData createDataKey="simpleProduct6" stepKey="deleteSimpleProduct6"/>
         </after>
 
         <!--Create product-->
@@ -69,6 +79,28 @@
         <conditionalClick selector="{{AdminProductFormRelatedUpSellCrossSellSection.relatedDropdown}}" dependentSelector="{{AdminProductFormRelatedUpSellCrossSellSection.relatedDependent}}" visible="false" stepKey="openDropDownIfClosedRelatedSee"/>
         <see selector="{{AdminProductFormRelatedUpSellCrossSellSection.selectedRelatedProduct}}" userInput="$$simpleProduct1.sku$$" stepKey="seeRelatedProduct"/>
 
+        <!--See more related products in admin-->
+        <actionGroup ref="addRelatedProductBySku" stepKey="addRelatedProduct2">
+            <argument name="sku" value="$$simpleProduct2.sku$$"/>
+        </actionGroup>
+        <actionGroup ref="addRelatedProductBySku" stepKey="addRelatedProduct3">
+            <argument name="sku" value="$$simpleProduct3.sku$$"/>
+        </actionGroup>
+        <actionGroup ref="addRelatedProductBySku" stepKey="addRelatedProduct4">
+            <argument name="sku" value="$$simpleProduct4.sku$$"/>
+        </actionGroup>
+        <actionGroup ref="addRelatedProductBySku" stepKey="addRelatedProduct5">
+            <argument name="sku" value="$$simpleProduct5.sku$$"/>
+        </actionGroup>
+        <actionGroup ref="addRelatedProductBySku" stepKey="addRelatedProduct6">
+            <argument name="sku" value="$$simpleProduct6.sku$$"/>
+        </actionGroup>
+        <scrollTo selector="{{AdminProductFormRelatedUpSellCrossSellSection.relatedDropdown}}" stepKey="scrollTo2"/>
+        <conditionalClick selector="{{AdminProductFormRelatedUpSellCrossSellSection.relatedDropdown}}" dependentSelector="{{AdminProductFormRelatedUpSellCrossSellSection.relatedDependent}}" visible="false" stepKey="openDropDownIfClosedRelatedSee2"/>
+        <see selector="{{AdminProductFormRelatedUpSellCrossSellSection.selectedRelatedProduct}}" userInput="$$simpleProduct6.sku$$" stepKey="seeSixthRelatedProduct"/>
+        <selectOption selector=".admin__collapsible-block-wrapper[data-index='related'] .admin__control-select" userInput="5" stepKey="selectFivePerPage"/>
+        <dontSee selector="{{AdminProductFormRelatedUpSellCrossSellSection.selectedRelatedProduct}}" userInput="$$simpleProduct6.sku$$" stepKey="dontSeeSixthRelatedProduct"/>
+
         <!--See related product in storefront-->
         <amOnPage url="{{SimpleProduct3.sku}}.html" stepKey="goToStorefront"/>
         <waitForPageLoad stepKey="waitForStorefront"/>

app/code/Magento/Ui/view/base/web/templates/dynamic-rows/templates/grid.html

@@ -16,11 +16,23 @@
 
     <div class="admin__field-control" data-role="grid-wrapper">
         <div class="admin__control-table-pagination" visible="!!$data.getRecordCount()">
-            <div class="admin__data-grid-pager">
-                <button class="action-previous" type="button" data-bind="attr: {title: $t('Previous Page')}, click: previousPage, disable: isFirst()"></button>
-                <input class="admin__control-text" type="number" data-bind="attr: {id: ++ko.uid}, value: currentPage">
-                <label class="admin__control-support-text" data-bind="attr: {for: ko.uid}, text: 'of ' + pages()"></label>
-                <button class="action-next" type="button" data-bind="attr: {title: $t('Next Page')}, click: nextPage, disable: isLast()"></button>
+            <div class="admin__data-grid-pager-wrap">
+                <select class="admin__control-select" data-bind="value:pageSize, event:{change: reload}">
+                    <option value="5">5</option>
+                    <option value="20" selected="selected">20</option>
+                    <option value="30">30</option>
+                    <option value="50">50</option>
+                    <option value="100">100</option>
+                    <option value="200">200</option>
+                    <option value="500">500</option>
+                </select>
+                <label class="admin__control-support-text" data-bind="text: $t('per page')"></label>
+                <div class="admin__data-grid-pager">
+                    <button class="action-previous" type="button" data-bind="attr: {title: $t('Previous Page')}, click: previousPage, disable: isFirst()"></button>
+                    <input class="admin__control-text" type="number" data-bind="attr: {id: ++ko.uid}, value: currentPage">
+                    <label class="admin__control-support-text" data-bind="attr: {for: ko.uid}, text: 'of ' + pages()"></label>
+                    <button class="action-next" type="button" data-bind="attr: {title: $t('Next Page')}, click: nextPage, disable: isLast()"></button>
+                </div>
             </div>
         </div>