Keyboard Event Tester

What this tool does

Keyboard Event Tester captures keydown and keyup events on the page and displays the exact key, code, legacy keyCode, repeat flag and active modifier keys (Ctrl, Alt, Shift, Meta) for each one, alongside a running log of the most recent 25 key presses, for debugging keyboard shortcuts and input handling.

Implementing a keyboard shortcut correctly means knowing exactly what a browser reports for a given key press, and the modern KeyboardEvent.key and KeyboardEvent.code properties behave differently from each other and from the older, deprecated keyCode number, especially for non-letter keys, numpad keys, and keys that change meaning with Shift.

This tester captures every keydown and keyup event on the page while it’s open and displays the event’s key (the actual character or named key, affected by Shift and layout), code (the physical key position, unaffected by layout or Shift), legacy keyCode number, whether the key event was a repeat (from holding the key down), and which modifier keys (Ctrl, Alt, Shift, Meta) were active at the same time.

How to use Keyboard Event Tester

1. Click anywhere on the page to make sure it has focus.
2. Press any key or key combination.
3. Read the Last event panel for that key’s exact key, code, keyCode, modifiers and repeat status.
4. Check the Recent key presses log to review a sequence of presses.
5. Press Pause if you need to stop capturing temporarily, then Resume to continue.

Tips for better results

• KeyboardEvent.code reports the physical key position regardless of keyboard layout or Shift state (e.g. "KeyA" always means the A-position key), while KeyboardEvent.key reports what that key press actually produces (e.g. "a" or "A" depending on Shift) — use code for layout-independent shortcuts and key for what the user is actually typing.
• The numeric keyCode property is deprecated in modern browsers in favour of key and code, but still appears in some older code and libraries, which is why it’s shown here too.
• While this tool is open, almost every key press is intercepted and prevented from triggering its normal browser behaviour, except Tab, which still navigates focus normally so you’re never trapped on the page.
• The repeat flag lets you distinguish a genuinely new key press from the automatic repeated keydown events a browser fires while a key is held down.

Common use cases

• Debugging why a keyboard shortcut isn’t triggering correctly by checking the exact key or code value a browser reports.
• Finding the correct KeyboardEvent.code value for a specific physical key, including less common ones like numpad or media keys.
• Testing how different modifier key combinations are reported across a browser or operating system.
• Teaching the difference between key, code and the legacy keyCode property.

Common mistakes to avoid

• Using the deprecated numeric keyCode property in new code when the modern key or code string properties are more readable and equally well supported in current browsers.
• Checking KeyboardEvent.key for a layout-independent shortcut; key changes with Shift and keyboard layout, while code reports the fixed physical key position regardless of either.
• Forgetting that most keys are intercepted while this tool is focused, which is intentional so you can see every event, but means normal browser shortcuts won’t fire while testing.