What is the difference between `event.key` and `event.code`?

`event.key` represents the character value of the key, which changes with keyboard layout (e.g., 'a' vs. 'A' with Shift). `event.code` represents the physical key on the keyboard, independent of the current layout (e.g., 'KeyA' for the A key).

How can I test for keyboard ghosting with this tool?

To test for keyboard ghosting, press several keys simultaneously. If some key presses do not register as `keydown` events in the viewer, it indicates a ghosting issue where the keyboard hardware cannot handle that specific combination of simultaneous presses.

What are modifier keys, and how are they shown?

Modifier keys are special keys like Shift, Ctrl, Alt, and Meta (Windows/Command) that modify the behavior of other key presses. This tool shows their state (pressed or not) through boolean flags like `shiftKey`, `ctrlKey`, `altKey`, and `metaKey` in the event details.

Is `keyCode` still relevant for keyboard event handling?

`keyCode` is officially deprecated by the W3C and is not recommended for new development. Developers should use `event.key` for character values and `event.code` for physical key identification, as these provide more consistent and internationalization-friendly results.

Does this tool work with all keyboard layouts?

Yes, this tool works with all keyboard layouts. It accurately reports `event.code` for the physical key pressed and `event.key` for the character produced by that key according to the active layout, including international and special character layouts.

Why would a web developer use a keyboard event viewer?

Web developers use a keyboard event viewer to debug custom keyboard shortcuts, ensure accessibility features respond correctly to various key presses, and understand how different browser and OS environments handle keyboard input, especially for complex web applications.

Online Keyboard Tester

Online Keyboard Tester Overview

Check if your computer keyboard keys are working correctly.

A Keyboard Event Viewer is an online utility that displays detailed information about keyboard key presses and releases in real-time. When a user interacts with their keyboard, this tool captures the underlying JavaScript event data, providing insights into properties like `key`, `code`, `keyCode`, and the state of modifier keys such as Shift, Ctrl, Alt, and Meta (Windows/Command). It serves as a diagnostic aid for developers, gamers, and anyone troubleshooting keyboard functionality or understanding event propagation. Technically, this tool listens for standard DOM `keydown` and `keyup` events on the document object. When an event fires, it accesses the event object's properties, including `event.key` (the character value), `event.code` (the physical key identifier), `event.keyCode` (deprecated, but still common), and boolean flags like `event.shiftKey`, `event.ctrlKey`, `event.altKey`, and `event.metaKey`. This information is then formatted and displayed on the user interface, providing an immediate visual representation of each keyboard interaction without server-side processing. This utility is used by web developers debugging keyboard shortcuts or accessibility features, gamers checking for keyboard ghosting or key rollover issues, and technical support personnel diagnosing faulty keys. It also assists users in identifying specific key codes for remapping software or understanding how different keyboard layouts affect event data, particularly for non-standard characters or international keyboards.

How to Use Online Keyboard Tester

Step 1: Open the Keyboard Event Viewer in your web browser.
Step 2: Click anywhere within the designated input area or on the page to ensure it has focus.
Step 3: Press any key on your keyboard.
Step 4: Observe the real-time display of key events, including `key`, `code`, and modifier states.
Step 5: Press multiple keys simultaneously to test for ghosting or N-key rollover capabilities.

Frequently Asked Questions

What is the difference between `event.key` and `event.code`?: `event.key` represents the character value of the key, which changes with keyboard layout (e.g., 'a' vs. 'A' with Shift). `event.code` represents the physical key on the keyboard, independent of the current layout (e.g., 'KeyA' for the A key).
How can I test for keyboard ghosting with this tool?: To test for keyboard ghosting, press several keys simultaneously. If some key presses do not register as `keydown` events in the viewer, it indicates a ghosting issue where the keyboard hardware cannot handle that specific combination of simultaneous presses.
What are modifier keys, and how are they shown?: Modifier keys are special keys like Shift, Ctrl, Alt, and Meta (Windows/Command) that modify the behavior of other key presses. This tool shows their state (pressed or not) through boolean flags like `shiftKey`, `ctrlKey`, `altKey`, and `metaKey` in the event details.
Is `keyCode` still relevant for keyboard event handling?: `keyCode` is officially deprecated by the W3C and is not recommended for new development. Developers should use `event.key` for character values and `event.code` for physical key identification, as these provide more consistent and internationalization-friendly results.
Does this tool work with all keyboard layouts?: Yes, this tool works with all keyboard layouts. It accurately reports `event.code` for the physical key pressed and `event.key` for the character produced by that key according to the active layout, including international and special character layouts.
Why would a web developer use a keyboard event viewer?: Web developers use a keyboard event viewer to debug custom keyboard shortcuts, ensure accessibility features respond correctly to various key presses, and understand how different browser and OS environments handle keyboard input, especially for complex web applications.

Related Dev Tools

IP Geolocation - Find location data for any IP address
Domain Availability - Check if a domain name is available for registration
React Component Gen - Generate boilerplate for React components
.htaccess File Generator - Create Apache redirects and security rules
robots.txt Tester - Test if a specific URL is allowed by robots.txt
JSON to TOON Converter - Optimize JSON for LLMs (30-60% Token Reduction)
Regex Tester - Test and debug regular expressions
UUID Generator - Generate unique identifiers (UUIDs/GUIDs) instantly