Ie 11 window scroll fix

src/view/drag-handle/sensor/create-keyboard-sensor.js

@@ -192,7 +192,16 @@ export default ({
       // https://twitter.com/alexandereardon/status/985994224867819520
       // Using capture: false here as we want to avoid intercepting droppable scroll requests
       options: { capture: false },
-      fn: callbacks.onWindowScroll,
+      fn: (event: UIEvent) => {
+        // IE11 fix:
+        // Scrollable events still bubble up and are caught by this handler in ie11.
+        // We can ignore this event
+        if (event.currentTarget !== getWindow()) {
+          return;
+        }
+
+        callbacks.onWindowScroll();
+      },
     },
     // Cancel on page visibility change
     {

src/view/drag-handle/sensor/create-mouse-sensor.js

@@ -212,7 +212,14 @@ export default ({
       // Using capture: false here as we want to avoid intercepting droppable scroll requests
       // TODO: can result in awkward drop position
       options: { passive: true, capture: false },
-      fn: () => {
+      fn: (event: UIEvent) => {
+        // IE11 fix:
+        // Scrollable events still bubble up and are caught by this handler in ie11.
+        // We can ignore this event
+        if (event.currentTarget !== getWindow()) {
+          return;
+        }
+
         // stop a pending drag
         if (state.pending) {
           stopPendingDrag();

test/unit/view/drag-handle/keyboard-sensor.spec.js

@@ -204,6 +204,24 @@ describe('progress', () => {
     expect(event.defaultPrevented).toBe(false);
   });
 
+  it('should not fire an onWindowScroll if it is not the window scrolling (ie11 bug)', () => {
+    // start the lift
+    pressSpacebar(wrapper);
+
+    // trigger scroll event
+    const scrollable: HTMLElement = document.createElement('div');
+    const fakeEvent: Event = new Event('scroll');
+    Object.defineProperties(fakeEvent, {
+      currentTarget: {
+        writable: true,
+        value: scrollable,
+      },
+    });
+    window.dispatchEvent(fakeEvent);
+
+    expect(callbacks.onWindowScroll).not.toHaveBeenCalled();
+  });
+
   it('should prevent using keyboard keys that modify scroll', () => {
     const keys: number[] = [
       keyCodes.pageUp,

test/unit/view/drag-handle/mouse-sensor.spec.js

@@ -554,14 +554,23 @@ describe('window scroll during drag', () => {
       x: 100,
       y: 200,
     });
-    // no animation frame to release diff
 
+    // no animation frame to release diff
     expect(
       callbacksCalled(callbacks)({
         onLift: 1,
         onWindowScroll: 0,
       }),
     ).toBe(true);
+
+    // releasing a frame
+    requestAnimationFrame.step();
+    expect(
+      callbacksCalled(callbacks)({
+        onLift: 1,
+        onWindowScroll: 1,
+      }),
+    ).toBe(true);
   });
 
   it('should only trigger onWindowScroll if still dragging when the animation frame fires', () => {
@@ -594,6 +603,28 @@ describe('window scroll during drag', () => {
       }),
     ).toBe(true);
   });
+
+  it('should not fire an onWindowScroll if it is not the window scrolling (ie11 bug)', () => {
+    // start the lift
+    mouseDown(wrapper);
+    windowMouseMove({ x: 0, y: sloppyClickThreshold });
+    expect(callbacks.onLift).toHaveBeenCalled();
+
+    // trigger scroll event
+    const scrollable: HTMLElement = document.createElement('div');
+    const fakeEvent: Event = new Event('scroll');
+    Object.defineProperties(fakeEvent, {
+      currentTarget: {
+        writable: true,
+        value: scrollable,
+      },
+    });
+    window.dispatchEvent(fakeEvent);
+    // ensuring any events would be published
+    requestAnimationFrame.flush();
+
+    expect(callbacks.onWindowScroll).not.toHaveBeenCalled();
+  });
 });
 
 describe('finish', () => {

test/unit/view/drag-handle/util/callbacks.js

@@ -40,6 +40,7 @@ export const callbacksCalled = (callbacks: Callbacks) => ({
   onMoveLeft = 0,
   onDrop = 0,
   onCancel = 0,
+  onWindowScroll = 0,
 }: CallBacksCalledFn = {}) =>
   callbacks.onLift.mock.calls.length === onLift &&
   callbacks.onMove.mock.calls.length === onMove &&
@@ -48,7 +49,8 @@ export const callbacksCalled = (callbacks: Callbacks) => ({
   callbacks.onDrop.mock.calls.length === onDrop &&
   callbacks.onCancel.mock.calls.length === onCancel &&
   callbacks.onMoveRight.mock.calls.length === onMoveRight &&
-  callbacks.onMoveLeft.mock.calls.length === onMoveLeft;
+  callbacks.onMoveLeft.mock.calls.length === onMoveLeft &&
+  callbacks.onWindowScroll.mock.calls.length === onWindowScroll;
 
 export const whereAnyCallbacksCalled = (callbacks: Callbacks) =>
   !callbacksCalled(callbacks)();