Registry / http-networking / keyboard-key

keyboard-key

library1.1.0jsnpmunverified

`keyboard-key` is a lightweight utility library designed to provide a consistent and reliable way to determine the `KeyboardEvent.key` property from keyboard events across different browsers, addressing inconsistencies in native browser implementations. Released as version 1.1.0, this package aims to normalize keyboard event key values, stepping in where `KeyboardEvent.key` lacked full cross-browser support or where older, deprecated properties like `keyCode` and `which` were still in use. It differentiates itself by attempting to infer key values, including interpreting shift key presses, which, while helpful for `en-US` layouts, introduces a locale-specific caveat. The library also offers `getCode()` for obtaining normalized `keyCode` values and provides constants for common key codes, promoting the use of modern `KeyboardEvent.key` semantics while providing a fallback.

http-networking

npm install keyboard-key

github ↗package ↗

INSTALL

IMPORT

SIG · KEYBOARD-KEY

keyboard-key

http-networkingjavascriptv1.1.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

getKey

✓ import { getKey } from 'keyboard-key'

✗ import keyboardKey from 'keyboard-key'; keyboardKey.getKey(event);

`getKey` is a named export for obtaining the normalized `key` string from a `KeyboardEvent`, which attempts to resolve cross-browser inconsistencies in the native `KeyboardEvent.key` property.

getCode

✓ import { getCode } from 'keyboard-key'

✗ const code = keyboardKey.getCode(event);

`getCode` is a named export for retrieving a standardized `keyCode` (number) value. While `keyCode` is deprecated, this function provides a normalized value for compatibility or specific use cases.

Escape

✓ import { Escape } from 'keyboard-key'

✗ import { escape } from 'keyboard-key'

Constants like `Escape` (and other key names in uppercase) are named exports, representing numeric `keyCode` values. They are useful for direct comparisons against the output of `getCode()`.

This code snippet demonstrates how to import and use `getKey()` and `getCode()` to normalize keyboard events, and how to use the provided key code constants for robust keyboard input handling.

import { getKey, getCode, Escape } from 'keyboard-key'; document.addEventListener('keydown', (event: KeyboardEvent) => { const key: string = getKey(event); const code: number = getCode(event); console.log(`Key pressed: ${key}, Code: ${code}`); switch (key) { case 'Escape': console.log('Escape key detected via getKey!'); break; case 'Enter': console.log('Enter key detected via getKey!'); break; default: break; } // Using getCode with named constant if (code === Escape) { console.log('Escape key detected via getCode and constant!'); } }); // Simulate keydown events for demonstration purposes in a browser-like environment. // In a real application, these would come from user interaction. setTimeout(() => { const escapeEvent = new KeyboardEvent('keydown', { key: 'Escape', keyCode: 27, which: 27 }); document.dispatchEvent(escapeEvent); }, 100); setTimeout(() => { const enterEvent = new KeyboardEvent('keydown', { key: 'Enter', keyCode: 13, which: 13 }); document.dispatchEvent(enterEvent); }, 200);

Debug

Known issues

gotchaThe `getKey()` function's logic for inferring `key` values, especially with `shift` key presses (e.g., `shift` + `/` resulting in `?`), assumes an `en-US` keyboard layout. Using different locales (e.g., German, French) will lead to incorrect `key` values for certain shifted characters or special keys.

fix

For internationalized applications, prefer `getCode()` where consistent numeric codes are sufficient, or implement custom locale mapping logic for `key` values if string representation is critical. Thoroughly test on target locales.

affects: >=1.0.0

gotchaWhile `keyboard-key` provides a normalized `key` property, the underlying browser support for the native `KeyboardEvent.key` has historically been inconsistent across different browsers and versions. This library aims to mitigate these inconsistencies, but developers should remain aware that edge cases might exist in very old or niche browser environments.

fix

Continue using `keyboard-key` for improved cross-browser consistency; however, ensure thorough testing across all target browser versions, especially if supporting older or less common browsers.

affects: <1.1.0

deprecatedDirect reliance on deprecated `KeyboardEvent` properties such as `keyCode`, `charCode`, `which`, or `keyIdentifier` is highly discouraged in modern web development. While `keyboard-key` provides `getCode()` for numeric values, its primary purpose is to normalize and promote the use of the `KeyboardEvent.key` property.

fix

Prioritize `getKey()` for string representations of keys. If numeric identification is absolutely necessary for legacy compatibility or specific scenarios, use `getCode()` rather than accessing deprecated event properties directly.

affects: *

Errors

Common errors & fixes

TypeScript error: Cannot find name 'keyboardKey'.

Attempting to use `keyboardKey` as a default import or global variable when `keyboard-key` primarily exports named functions.

fix

Use named imports for TypeScript: `import { getKey, getCode, Escape } from 'keyboard-key';`

ReferenceError: keyboardKey is not defined

Attempting to use `keyboardKey` as a global variable or accessing its members without proper ES module named imports or CommonJS destructuring.

fix

For ESM, use named imports: `import { getKey } from 'keyboard-key';`. For CommonJS, use destructuring: `const { getKey } = require('keyboard-key');`

Upgrade

Version history

1.1.0latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

2 hits · last 30 days

node

Resources

githubhttps://github.com/levithomason/keyboard-key ↗

packagehttps://www.npmjs.com/package/keyboard-key ↗