ScrollView: Scroll bounces when interacting with content while the vi…

…ew is scrolled to the bottom (T1246508) (#28500)

.github/workflows/qunit_tests-additional-renovation.yml

@@ -148,8 +148,10 @@ jobs:
           'ui.editors(1/2)',
           'ui.editors(2/2)',
           'ui.htmlEditor',
-          'ui.grid(1/2)',
-          'ui.grid(2/2)',
+          'ui.grid(1/4)',
+          'ui.grid(2/4)',
+          'ui.grid(3/4)',
+          'ui.grid(4/4)',
           'ui.scheduler(1/3)',
           'ui.scheduler(2/3)',
           'ui.scheduler(3/3)',

packages/devextreme/js/__internal/ui/scroll_view/m_scrollable.simulated.ts

@@ -220,10 +220,10 @@ export const Scroller = Class.inherit({
 
     if (location > 0) {
       translateOffset = location;
-    } else if (location <= minOffset) {
+    }
+
+    if (location <= minOffset) {
       translateOffset = location - minOffset;
-    } else {
-      translateOffset = location % 1;
     }
 
     if (this._translateOffset === translateOffset) {
@@ -234,7 +234,7 @@ export const Scroller = Class.inherit({
     targetLocation[this._prop] = translateOffset;
     this._translateOffset = translateOffset;
 
-    if (translateOffset === 0) {
+    if (!translateOffset) {
       resetPosition(this._$content);
       return;
     }

packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/editing.integration.tests.js

@@ -3487,7 +3487,7 @@ QUnit.module('Editing', baseModuleConfig, () => {
         assert.strictEqual(onSelectedSpy.callCount, 0, 'is not selected after change');
     });
 
-    QUnit.testInActiveWindow('key should not be compared many times on paging (T1047506)', function(assert) {
+    QUnit.test('key should not be compared many times on paging (T1047506)', function(assert) {
         // arrange
         let idCallCount = 0;
         const items = Array.from({ length: 50 }).map((_, index) => {
@@ -3506,7 +3506,9 @@ QUnit.module('Editing', baseModuleConfig, () => {
             keyExpr: 'id',
             scrolling: {
                 mode: 'virtual',
-                useNative: false
+                useNative: false,
+                scrollByThumb: false,
+                showScrollbar: 'onHover',
             },
         });
 
@@ -3518,7 +3520,7 @@ QUnit.module('Editing', baseModuleConfig, () => {
         dataGrid.pageIndex(1);
 
         // assert
-        assert.equal(idCallCount, 200, 'key call count after paging');
+        assert.true(idCallCount < 280, 'key call count after paging');
     });
 
     QUnit.test('Popup should render editor if columns[].renderAsync option is true', function(assert) {
@@ -5044,6 +5046,11 @@ QUnit.module('API methods', baseModuleConfig, () => {
 
     // T722161
     QUnit.test('add row after scrolling if rowRenderingMode is virtual', function(assert) {
+        if(devices.real().ios) {
+            assert.ok(true);
+            return;
+        }
+
         const array = [];
         for(let i = 1; i <= 20; i++) {
             array.push({ id: i, text: 'text' + i });
@@ -7048,6 +7055,10 @@ QUnit.module('Editing state', baseModuleConfig, () => {
                 });
 
                 QUnit.test(`Add row at the end of the last page via changes option if virtual scrolling (editMode = ${editMode}, key = ${key})`, function(assert) {
+                    if(devices.real().ios) {
+                        assert.ok(true);
+                        return;
+                    }
                     // arrange
                     const changes = [{
                         data: { field: 'test' },

packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/scrolling.integration.tests.js

@@ -990,7 +990,7 @@ QUnit.module('Scrolling', baseModuleConfig, () => {
         scrollable.scrollTo(100.7);
 
         // assert
-        assert.equal(scrollable.scrollLeft(), 100.7);
+        assert.equal(scrollable.scrollLeft(), 100);
         assert.equal($(scrollable.container()).scrollLeft(), 100);
 
         const $headersScrollable = $dataGrid.find('.dx-datagrid-headers' + ' .dx-datagrid-scroll-container').first();

packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/virtualScrolling.integration.tests.js

@@ -1612,6 +1612,10 @@ QUnit.module('Virtual Scrolling', baseModuleConfig, () => {
     });
 
     QUnit.test('synchronous render and asynchronous updateDimensions during paging if virtual scrolling is enabled', function(assert) {
+        if(devices.real().ios) {
+            assert.ok(true);
+            return;
+        }
         // arrange, act
 
         let contentReadyCount = 0;
@@ -5858,7 +5862,7 @@ QUnit.module('Virtual Scrolling', baseModuleConfig, () => {
         assert.equal(loadSpy.args[1][0].take, 15, 'take in the second call');
     });
 
-    QUnit.skip('Rows in fixed table should not have the offset when the content is scrolled to the bottom (T1072358)', function(assert) {
+    QUnit.test('Rows in fixed table should not have the offset when the content is scrolled to the bottom (T1072358)', function(assert) {
         // arrange
         const getData = function() {
             const items = [];

packages/devextreme/testing/tests/DevExpress.ui.widgets/scrollableParts/scrollable.api.tests.js

@@ -20,7 +20,6 @@ import {
     SCROLLBAR_VERTICAL_CLASS,
     SCROLLABLE_SCROLLBARS_HIDDEN,
     SCROLLABLE_DISABLED_CLASS,
-    calculateInertiaDistance,
 } from './scrollable.constants.js';
 
 import {

packages/devextreme/testing/tests/DevExpress.ui.widgets/scrollableParts/scrollable.dynamic.tests.js

@@ -453,7 +453,6 @@ QUnit.test('bounce is disabled', function(assert) {
         useNative: false,
         bounceEnabled: false,
         inertiaEnabled: false,
-
         onBounce: function() {
             assert.ok(false, 'bounce action was not fired');
         }
@@ -479,11 +478,9 @@ QUnit.test('inertia stopped on the bound when bounce is disabled', function(asse
     $scrollable.dxScrollable({
         useNative: false,
         bounceEnabled: false,
-
         onBounce: function() {
             assert.ok(false, 'bounce action was not fired');
         },
-
         onEnd: function() {
             const location = getScrollOffset($scrollable);
             assert.equal(location.top, 0, 'content stopped on the bound');

packages/devextreme/testing/tests/DevExpress.ui.widgets/scrollableParts/scrollable.main.tests.js

@@ -161,6 +161,56 @@ QUnit.test('reset unused position after change direction', function(assert) {
 
 QUnit.module('both directions', moduleConfig);
 
+['horizontal', 'vertical'].forEach((direction) => {
+    QUnit.test(`content should have the translate(0,0) when scrolling within the bounds of the container in ${direction} direction`, function(assert) {
+        const done = assert.async();
+        assert.expect(2);
+
+        const contentWidth = 9000;
+        const contentHeight = 9000;
+        const moveDistance = -10;
+        const moveDuration = 10;
+        const $scrollable = $('#scrollable');
+
+        $scrollable
+            .find('.content1')
+            .width(contentWidth)
+            .height(contentHeight);
+
+        $scrollable.dxScrollable({
+            useNative: false,
+            direction,
+            onEnd: function() {
+                const translate = getTranslateValues($content.get(0));
+
+                assert.equal(translate.left, 0, 'translate left should have zero value');
+                assert.equal(translate.top, 0, 'translate top should have zero value');
+
+                done();
+            }
+        });
+
+        const $content = $scrollable.find(`.${SCROLLABLE_CONTENT_CLASS}`);
+        const mouse = pointerMock($content).start();
+
+        mouse
+            .down()
+            .wait(moveDuration);
+
+        if(direction === 'horizontal') {
+            mouse
+                .move(moveDistance, 0)
+                .up();
+        } else {
+            mouse
+                .move(0, moveDistance)
+                .up();
+        }
+
+        this.clock.tick(10);
+    });
+});
+
 QUnit.test('bounce problem', function(assert) {
     assert.expect(2);