fix: [#3126] Fix keyboard events in scene scope (#3127)

Closes #3126 Fixes an issue where key events (and other event types) get stuck in the previous scene `InputHost` and cause issues when switching back. This state will never be useful and has lost relevancy after the scene has switched. ## Changes: - Adds a `InputHost.clear()` to clear previous scene event state - `Director` clears the previous scene input host
excaliburjs · Jul 17, 2024 · 10c75ce · 10c75ce
1 parent c2cb169
commit 10c75ce
Show file tree

Hide file tree

Showing 7 changed files with 8,245 additions and 9,438 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -67,6 +67,7 @@ are doing mtv adjustments during precollision.
 
 ### Fixed
 
+- Fixed issue where `ex.Scene` scoped input events would preserve state and get stuck causing issues when switching back to the original scene.
 - Fixed issue where not all physical keys from the spec were present in `ex.Keys` including the reported `ex.Keys.Tab`
 - Fixed invalid graphics types around `ex.Graphic.tint`
 - improve types to disallow invalid combo of collider/width/height/radius in actor args

diff --git a/package-lock.json b/package-lock.json
diff --git a/sandbox/tests/scene-keyboard/index.html b/sandbox/tests/scene-keyboard/index.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Scene Keyboard</title>
+  </head>
+  <body>
+    <script src="../../lib/excalibur.js"></script>
+    <script src="index.js"></script>
+  </body>
+</html>
diff --git a/sandbox/tests/scene-keyboard/index.ts b/sandbox/tests/scene-keyboard/index.ts
@@ -0,0 +1,38 @@
+var a = new ex.Scene();
+a.on('initialize', () => {
+  console.log('a input:', a.input.keyboard);
+  // console.log('b input:', b.input.keyboard);
+  a.input.pointers.primary.on('down', (e) => {
+    a.engine.goToScene('b');
+  });
+  a.input.keyboard.on('press', (e) => {
+    console.log('a input:', a.input.keyboard.getKeys());
+    if (e.key === ex.Keys.Key1) {
+      a.engine.goToScene('b');
+    }
+  });
+});
+
+var b = new ex.Scene();
+b.backgroundColor = ex.Color.DarkGray;
+b.on('initialize', () => {
+  // console.log('a input:', a.input.keyboard);
+  console.log('b input:', b.input.keyboard);
+  b.input.pointers.primary.on('down', (e) => {
+    b.engine.goToScene('a');
+  });
+  b.input.keyboard.on('press', (e) => {
+    console.log('a input:', a.input.keyboard.getKeys());
+    console.log('b input:', b.input.keyboard.getKeys());
+    if (e.key === ex.Keys.Key2) {
+      b.engine.goToScene('a');
+    }
+  });
+});
+
+var game6 = new ex.Engine({
+  scenes: { a, b }
+});
+
+game6.goToScene('a');
+game6.start();
diff --git a/src/engine/Director/Director.ts b/src/engine/Director/Director.ts
@@ -555,6 +555,7 @@ export class Director<TKnownScenes extends string = any> {
         const context = { engine, previousScene, nextScene };
         await this.currentScene._deactivate(context);
         this.currentScene.events.emit('deactivate', new DeactivateEvent(context, this.currentScene));
+        this.currentScene.input.clear();
       }
 
       // wait for the scene to be loaded if needed

diff --git a/src/engine/Input/InputHost.ts b/src/engine/Input/InputHost.ts
@@ -52,4 +52,10 @@ export class InputHost {
       this.gamepads.update();
     }
   }
+
+  clear() {
+    this.keyboard.clear();
+    this.pointers.clear();
+    // this.gamepads.clear();
+  }
 }
diff --git a/src/engine/Input/Keyboard.ts b/src/engine/Input/Keyboard.ts
@@ -346,6 +346,12 @@ export class Keyboard {
     this._keys.length = 0;
   };
 
+  public clear() {
+    this._keysDown.length = 0;
+    this._keysUp.length = 0;
+    this._keys.length = 0;
+  }
+
   private _handleKeyDown = (ev: KeyboardEvent) => {
     if (!this._enabled) {
       return;