Modifier keyboard shortcuts with DeviceSourceManager - Copy to Clipboard

Questions
,
1

Morning all,

I’m making a Copy & Paste functionality in my project and would like to make sure I’m not missing something with the Device Source Manager.

https://playground.babylonjs.com/#Y4YWCD#8

In the playground above, if you hit ‘Command + c’, then the copy function is triggered as expected BUT when I release all keys and then just press ‘Command’ the copy function is fired again.

Why is the state of the ‘c’ key being reset to 1 in this case?

I’d like the ‘c’ key to be reset to 0 when I release all keys, so then on my next input changed observable I’m back in my original state. (No keys pressed)

Thanks,

Jonny

1 Like
2

cc @PolygonalSun

4

Just out of curiosity, what browsers are you seeing this behavior on?

5

I’m seeing the same behavior on all my installed browsers, could this be browser specific?

I’ve noticed this is only the case for the command key. (ctrl, alt, shift all work as expected)

Chrome
Version 103.0.5060.53 (Official Build) (arm64)

Brave
Version 1.40.105 Chromium: 103.0.5060.53 (Official Build) (arm64)

Safari
Version 15.5 (17613.2.7.1.8)

6

Okay, so I’m able to repro this on my Mac. Lemme take a look and see what’s going on. I suspect that the CMD+C combo is somehow preventing the keyup event from being registered, which is why the C is still showing as active. I’ll need to confirm this though.

7

My limited investigation shows that IF a keydown event for a non-modifier key (a, b, c, etc) has metaKey = true, then you will never see the keyup event for that key…

8

Hmmm, this maybe bigger than Babylon - looking at the MDN docs for KeyboardEvent.key and typing into KeyboardEvent sequence example I never see the keyup for a key that was typed while Meta (Command) was held down on a Mac in Chrome at least…

Check out: KeyboardEvent.key - Web APIs | MDN

9

Okay, well, I hope someone proves me wrong but I believe this is Mac OS default behavior that cannot be fixed (not receiving the keyup event for a key pressed while Meta was held down):

Many projects have encountered this, for example:

10

Unfortunately, because this is an OS level issue, there isn’t too much that we can do. I have created a sort of a workaround for this though: Added code to track buttons pressed while meta key is active on MacOS by PolygonalSun · Pull Request #12693 · BabylonJS/Babylon.js (github.com)

In this PR, we will track what keys are pressed when the Meta (Command) key is active and manually release them when the Meta key is released.

1 Like
11

PR is merged

1 Like
13

@PolygonalSun Wow, thanks for the quick fix for this issue. As an aside, during my exploration of the problem, I did notice that keyup events were fired when focusing/clicking off the browser. Weirdly though, the keyup events don’t look the same as the normal IKeyboardEvent. Specifically they are missing the code property of the normal Keyboard event (KeyboardEvent.code - Web APIs | MDN)

The below shows what I received when doing Command + V in the browser:

keydown for Command:

inputIndex: 91
isTrusted: true
altKey: false
bubbles: true
cancelBubble: false
cancelable: true
charCode: 0
code: "MetaLeft"
composed: true
ctrlKey: false
currentTarget: null
defaultPrevented: false
detail: 0
eventPhase: 0
isComposing: false
key: "Meta"
keyCode: 91
location: 1
metaKey: true
repeat: false
returnValue: true
shiftKey: false
srcElement: canvas
target: canvas
timeStamp: 9807880
type: "keydown"
which: 91

keydown for V:

inputIndex: 86
isTrusted: true
altKey: false
bubbles: true
cancelBubble: false
cancelable: true
charCode: 0
code: "KeyV"
composed: true
ctrlKey: false
currentTarget: null
defaultPrevented: false
detail: 0
eventPhase: 0
isComposing: false
key: "v"
keyCode: 86
location: 0
metaKey: true
repeat: false
returnValue: true
shiftKey: false
srcElement: canvas
target: canvas
timeStamp: 9809787.700000048
type: "keydown"
which: 86

Received when clicking off the browser I got the V keyup but missing the code property:

altKey: false
ctrlKey: false
deviceSlot: 0
deviceType: 1
inputIndex: 86
key: "V"
keyCode: 86
metaKey: false
shiftKey: false
target: canvas
type: "keyup"

Is this related at all?

14

@PolygonalSun Thanks very much!