Block the wheel -> scrollTop/scrollLeft assignment when window …

…is the instance's scrollable container. (#10996)

* Block the scrollTop/scrollLeft assignment when window is the scrollable container.

* Add the changelog entry.

.changelogs/10996.json

@@ -0,0 +1,8 @@
+{
+  "issuesOrigin": "private",
+  "title": "Fixed a problem where clicking and dragging on cells on a window-controlled scrolled instances would end up in unpredictable results.",
+  "type": "fixed",
+  "issueOrPR": 10996,
+  "breaking": false,
+  "framework": "none"
+}

handsontable/src/3rdparty/walkontable/src/overlays.js

@@ -413,7 +413,11 @@ class Overlays {
     const shouldNotWheelHorizontally = masterHorizontal !== rootWindow &&
       target !== rootWindow && !target.contains(masterHorizontal);
 
-    if (this.keyPressed && (shouldNotWheelVertically || shouldNotWheelHorizontally)) {
+    if (
+      (this.keyPressed && (shouldNotWheelVertically || shouldNotWheelHorizontally))
+       ||
+      this.scrollableElement === rootWindow
+    ) {
       return;
     }
 

handsontable/src/3rdparty/walkontable/test/spec/scroll.spec.js

@@ -1273,6 +1273,35 @@ describe('WalkontableScroll', () => {
         bottomHolder.removeEventListener('scroll', bottomCallback);
         leftHolder.removeEventListener('scroll', leftCallback);
       });
+
+      it('should not try to set the window\'s `scrollTop`/`scrollLeft` and `scrollY`/`scrollX` properties ' +
+      'when the window-scrolled table is scrolled', async() => {
+        spec().$wrapper.eq(0).css({ overflow: '', height: '', width: '' });
+
+        const wt = walkontable({
+          data: getData,
+          totalRows: getTotalRows,
+          totalColumns: getTotalColumns,
+        });
+
+        spyOn(wt.wtOverlays, 'scrollVertically').and.callThrough();
+        spyOn(wt.wtOverlays, 'scrollHorizontally').and.callThrough();
+
+        wt.draw();
+
+        const masterRootElement = wt.wtTable.wtRootElement;
+
+        wheelOnElement(masterRootElement, 400);
+        wt.draw();
+
+        await sleep(200);
+
+        expect(window.scrollTop).toEqual(undefined);
+        expect(window.scrollLeft).toEqual(undefined);
+
+        expect(wt.wtOverlays.scrollVertically).not.toHaveBeenCalled();
+        expect(wt.wtOverlays.scrollHorizontally).not.toHaveBeenCalled();
+      });
     });
 
     describe('horizontal scroll', () => {

handsontable/src/plugins/dragToScroll/dragToScroll.js

@@ -95,7 +95,7 @@ export class DragToScroll extends BasePlugin {
   }
 
   /**
-   * Sets the value of the visible element.
+   * Sets the boundaries/dimensions of the scrollable viewport.
    *
    * @param {DOMRect|{left: number, right: number, top: number, bottom: number}} [boundaries] An object with
    * coordinates. Contains the window boundaries by default. The object is compatible with DOMRect.