From bae0e985b2025e89a6d7e7b218efd156ab52e38f Mon Sep 17 00:00:00 2001
From: David Luzar <luzar.david@gmail.com>
Date: Mon, 27 Dec 2021 14:18:11 +0100
Subject: [PATCH] fix: prevent browser from scrolling when panning (#4489)

---
 src/components/App.tsx               | 2 ++
 src/packages/excalidraw/CHANGELOG.md | 1 +
 2 files changed, 3 insertions(+)

diff --git a/src/components/App.tsx b/src/components/App.tsx
index 6b470134a2..578ed71711 100644
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -1765,6 +1765,7 @@ class App extends React.Component<AppProps, AppState> {
       if (event.key === KEYS.SPACE && gesture.pointers.size === 0) {
         isHoldingSpace = true;
         setCursor(this.canvas, CURSOR_TYPE.GRABBING);
+        event.preventDefault();
       }
 
       if (event.key === KEYS.G || event.key === KEYS.S) {
@@ -2731,6 +2732,7 @@ class App extends React.Component<AppProps, AppState> {
       return false;
     }
     isPanning = true;
+    event.preventDefault();
 
     let nextPastePrevented = false;
     const isLinux = /Linux/.test(window.navigator.platform);
diff --git a/src/packages/excalidraw/CHANGELOG.md b/src/packages/excalidraw/CHANGELOG.md
index c140bf1805..eeaa46d5d5 100644
--- a/src/packages/excalidraw/CHANGELOG.md
+++ b/src/packages/excalidraw/CHANGELOG.md
@@ -66,6 +66,7 @@ Please add the latest change on the top under the correct section.
 
 ### Fixes
 
+- Panning the canvas using `mousewheel-drag` and `space-drag` now prevents the browser from scrolling the container/page [#4489](https://github.com/excalidraw/excalidraw/pull/4489).
 - Scope drag and drop events to Excalidraw container to prevent overriding host application drag and drop events.
 
 ### Build