Most appropriate sub-area of p5.js?
p5.js version
2.x (main)
Web browser and version
Any
Operating system
Windows 11, but doesn't matter
Steps to reproduce this
Steps:
- Open a sketch with keyboard input (see snippet below)
- Click the canvas, then hold down the right arrow key
- While still holding it, Alt-Tab to another window
- Release the key in the other window
- Switch back to the sketch tab
Snippet:
function setup() {
createCanvas(400, 200);
}
function draw() {
background(220);
textSize(16);
text('keyIsPressed: ' + keyIsPressed, 20, 40);
text('RIGHT_ARROW down: ' + keyIsDown(RIGHT_ARROW), 20, 80);
}
After step 5, both keyIsPressed and keyIsDown(RIGHT_ARROW) are still true even though no key is being held. The key stays "stuck" until you physically press and release it again inside the sketch. Super annoying in any movement-based sketch
Root cause:
_onblur in keyboard.js only clears _downKeys but completely ignores _downKeyCodes, keyIsPressed, key, and code:
// what's there now
fn._onblur = function(e) {
this._downKeys = {};
};
_downKeyCodes is new to 2.x _onblur was just never updated when it got added. Since keyIsDown() checks both maps, clearing only one of them doesn't actually fix the stuck state.,
Fix would be:
fn._onblur = function(e) {
this._downKeys = {};
this._downKeyCodes = {};
this.keyIsPressed = false;
this.key = '';
this.code = '';
};