I’m encountering an issue with keyboard events in JavaScript. When I press the ctrl+shift+y key combination, the event.key property correctly reports Y, but the event.code property incorrectly reports KeyZ. This is unexpected because the physical key being pressed is Y, not Z. This also happens when I just press Y without ctrl/shift.
Here is the test code I’m using:
<code>document.addEventListener('keydown', function(event) {
console.log('Key:', event.key); // Character produced by the key
console.log('Code:', event.code); // Physical key on the keyboard
console.log('Ctrl:', event.ctrlKey); // Boolean for Ctrl key
console.log('Shift:', event.shiftKey); // Boolean for Shift key
});
</code>
<code>document.addEventListener('keydown', function(event) {
console.log('Key:', event.key); // Character produced by the key
console.log('Code:', event.code); // Physical key on the keyboard
console.log('Ctrl:', event.ctrlKey); // Boolean for Ctrl key
console.log('Shift:', event.shiftKey); // Boolean for Shift key
});
</code>
document.addEventListener('keydown', function(event) {
console.log('Key:', event.key); // Character produced by the key
console.log('Code:', event.code); // Physical key on the keyboard
console.log('Ctrl:', event.ctrlKey); // Boolean for Ctrl key
console.log('Shift:', event.shiftKey); // Boolean for Shift key
});
- Browser: Chrome, Firefox, Edge
- Operating System: Windows
I also tested it on this page
When I press ctrl+shift+y, I get the following output:
<code>Key: Y
Code: KeyZ
Ctrl: true
Shift: true
</code>
<code>Key: Y
Code: KeyZ
Ctrl: true
Shift: true
</code>
Key: Y
Code: KeyZ
Ctrl: true
Shift: true
Expected output:
<code>Key: Y
Code: KeyY
Ctrl: true
Shift: true
</code>
<code>Key: Y
Code: KeyY
Ctrl: true
Shift: true
</code>
Key: Y
Code: KeyY
Ctrl: true
Shift: true