Properly disable scrolling in Android 🤖

iOS still bounces

public/index.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="apple-mobile-web-app-capable" content="yes"/>
     <meta name="theme-color" content="#000000">
     <!--
       manifest.json provides metadata used when your web app is added to the

src/Game.css

@@ -7,3 +7,7 @@
   text-align: center;
   font-size: 4rem;
 }
+
+#game {
+  touch-action: none;
+}

src/Game.js

@@ -114,6 +114,8 @@ export default class Game extends Component {
     animate()
 
     const handleMove = e => {
+      e.preventDefault()
+
       const touch = e.touches ? e.touches[0] : e
 
       this.player.acceleration.x =
@@ -128,8 +130,13 @@ export default class Game extends Component {
       this.player.maxSpeed = (center.distanceTo(mouse) / center.distanceTo(corner)) * PLAYER_MAX_SPEED
     }
 
-    window.addEventListener('touchmove', handleMove, false)
-    window.addEventListener('mousemove', handleMove, false)
+    const disableScroll = e => {
+      e.preventDefault()
+    }
+
+    window.addEventListener('touchstart', disableScroll)
+    window.addEventListener('touchmove', handleMove)
+    window.addEventListener('mousemove', handleMove)
   }
 
   render() {

src/index.css

@@ -1,6 +1,7 @@
 html {
   font-family: 'VT323', monospace;
   font-size: 1vw;
+  overflow: hidden;
 }
 
 body {